STEP ONE

Log into your PhotoBiz account and click on WEBSITE in the left side menu.

STEP TWO

Click on the name of the page you would like to add a button to, then click the button block icon from the right side.

You can either:

• Click the icon to add it to the bottom of your page, or
• Click and drag the icon to place it wherever you want on your page.
  As you drag it, a teal bar will appear to show you where it will land.

STEP THREE

Browse our library of predesigned layouts, and choose the select button on your favorite one.

• Blank blocks will use the global styling settings of your website.
• Predesigned blocks will use custom design settings to look exactly like the layout you have selected

STEP FOUR

Predesigned layout:

The side panel menu will remain open, and you can jump right in to the next step.

Blank layout:

Click in the center of the block where it says "click to add button text" and the side panel menu will reappear.

Your options for linking your button are:

NONE: The button will not link anywhere and exists for aesthetic reasons on your page.

EXTERNAL LINK:  Direct your clients to helpful resources that exist in a place other than your website.

PAGE: Direct your visitors to an existing web page on your website.

FORM: Connect to a Custom Form you have created in your FORM BUILDER.

MARKETING: Direct users to a Campaign or Landing Page you have created in the MARKETING tool.

FILE: Allow users to open a PDF, JPG, PNG, or GIF file that has been uploaded to the DOCUMENTS area of your account's FILES section.

PHONE: Connecting your button to a phone number allows users to quickly click to call you.

EMAIL: Connecting your button to an email address opens a user's default mail client to easily send you an email.

ADDRESS: Allow users to find where you are by opening an address in Google Maps.

VIDEO: Add a video embed code obtained from YouTube or Vimeo to play in a light-box.

POP-UPS: Enable one of your pop-ups to pop up when the button is clicked on to easily notify clients of your promotions, discounts or to sign up for your newsletter.

FINAL STEP

In the right side menu you will find advanced settings for your button block, including styling, colors and background. This will control how your button appears inside the button block.

STYLING 

The button styling section allows you to customize the following options for your button block:

• Button Alignment: Controls whether your button is left, right, or centered in the button block.

• Space Below Blocks: Controls the amount of space before the next block begins.

• Space Inside Blocks: Controls the amount of space at the top and bottom of a block.

Click on the Save Changes button once you've selected your button styling options.

COLORS

The button color section includes three color options. These colors will override the colors for the button that have been picked in the global color picker section under the DESIGN tab. Click on the color square or enter the HEX color code to customize the color for the following sections:

• Button Text Color: this is the font color of the text on your button. By default, this is controlled by the Button Text color in your global color picker.

• Button Background Color: this is background color of the button in this block. By default, this is controlled by the Button Background color in your global color picker.

• Background Color: this is the background color for the button block. By default, this is controlled by the Site Background color in your global color picker.

• Button Overlay Color: when the "overlay" animation style is enabled, the button background will turn this color when you hover your mouse over the button

• Button Contrast Color: when the "overlay" animation is enabled, the button text will turn this color when you hover your mouse over the button.

Click on Save Changes to apply your changes to your button block colors. The customized message will apply to any colors you've changed from your default color scheme settings.

BACKGROUND 

You can add a background image to display behind your Button block by adding a background image. You can upload your own custom background image or choose one from the Background Library. You can customize how the background image is displayed under the Background Settings.

If you upload a Custom Background or select a file from the Background Library, you can customize how the background image is displayed under the Background Settings from the following 4 different options:

• Tile: Will tile your image to fill the background

• Top Left: Will align your image to the top left

• Centered: Will align your image at the center of the available space

• Cover: Will scale your image to be as large as possible to completely cover the background

Click on Save Changes to apply your changes to the background settings.

FONTS

Click on the Fonts option in the right-side menu that opens up.

You can easily customize the fonts you're using on your button blocks to override your global font settings. You can change the font, font size, letter spacing (kerning), and line height for any of the following items in your button block:

• BUTTON TEXT

Click on Save Changes at the bottom of the control panel menu to apply your changes.

ANIMATIONS

• None

• Fill

• Overlay

• Scale

• Arrows

Once you have made your selection, click on Save Changes to apply the animation to your button.

If you have any questions about the Button block, please give our Support Team a call toll-free at 866.463.7620 or send us a live chat from your PhotoBiz control panel. We're available Monday - Friday 9:00am - 8:00pm EST and we're happy to help you however we can.