Customizing your embedded address book

Unlike when you are getting the embed code for a single address or a folder of addresses, you get the opportunity to customize the appearance of your address book once it’s embedded so that it matches the rest of your website.

You can change the color of almost every element in your Address Book and you can also choose what functions do or do not show up in the embedded Address Book. For example, you can choose not to have the search or print options.

Customization options

First you will need to find the embed code for your address book. When you click on the Address Book of your choice in your account, you will see a gray “Customize” button in the blue bar at the top of your screen. Click on that button and you will see a blue “Embed Address Book” link that you can click on. On the final page where you can copy your embed code, you will see a screen that looks like this:

On the left side of the embed screen are your options for adjusting color and viewing options. The bar below shows your display options for Address Book functions such as search and print. On the right hand side of the screen is a preview of what your embedded Address Book will look like after making any customizations.

You'll notice blue text in parentheses next to the black text labels in the left and bottom panels. For example, Menu Bar BG (mbc). The text in blue represents the code that will appear in your Address Book embed code when you make any customizations. See the sample code below:

As you will see in the sample code above the “mbc” shows where the code for the Menu Bar BG is and the “40A0FF” represents the color that the Menu Bar BG is. At the bottom of this screen is a “Reset” button that you can click to clear any customizations you have made to your Address Book.

Left-hand panel: Color customization and viewing options

At the top of the left-hand panel you can copy your final embed code for your Address Book. This embed code will reflect any customizations you may have made to the Address Book. The customizations you can make include:

Style — choose your Address Book style as List View or Card View
Width/Height — select your maximum height and width of the Address Book
Color Code — type in a specific hexadecimal code for a color in the long rectangular boxes
Color Picker — choose a color from a pop-up color list by clicking on the shorter boxes
Max Display (Items) — choose the number of addresses to show up per page in the embedded Address Book

Bottom panel — Displaying Address Book functions

By clicking the check boxes next to the items listed in the bottom panel of the embed Address Book screen, you can choose to show or not show certain functions in your Address Book. In the bottom panel the “Name” option will show the name of your Address Book on the final embedded code.

If you want to change what types of information show up in your embedded Address Book (Notes, names, phone numbers, etc.) you will need to first customize your Address Book display.