The PhotoBiz Website Package includes the powerful Client Galleries tool. With Client Gallery Blocks in the website builder, you can create a dedicated page to showcase your private Client Gallery events—making it easy for clients to view their images. This guide will walk you through how to use the Client Galleries block on your PhotoBiz website.
STEP ONE
Log into your PhotoBiz account and click on WEBSITE in the left side menu.
STEP TWO
Add A Client Gallery block
- Navigate to the page where you'd like to display your events.
- In the right-hand column, find the CLIENT GALLERY block.
- Add the block to your page:
- Option 1: Click to add the block to the bottom of the page.
- Option 2: Click and hold the block, then drag and drop it to the desired spot on your page.
- Option 1: Click to add the block to the bottom of the page.
STEP THREE
Select Your Events
Click on the Click to Add Events option or click on the pencil icon on the upper right corner of the Client Galleries block and click on advanced in the menu that opens.
Note: To display multiple Client Gallery event categories, you’ll need to add multiple CLIENT GALLERY blocks.
Select the event category you’d like to display in the block.
Choose whether or not to show the expiration date for each gallery.
When you’re finished, click Save Changes
STYLING OPTIONS FOR YOUR CLIENT GALLERY BLOCK
LAST ITEM LINK
The Last Item Link feature allows quick loading of additional client galleries in your client gallery block if the number of events you have uploaded exceed the total number of rows and columns you've selected for your client gallery block. You can also use the last item link as a call to action link to other pages/social media/items that you want to direct visitors to. You'll see the following options for Display Last Item Link:
- NONE: No link will be used on the last item in your grid.
- YES, AS A "LOAD MORE LINK": When clicked, it will load another set of items within the page. You can customize the text that appears in the load more link under the Link Text section.
- YES, AS A "STANDARD LINK": When clicked, it will link out to a separate page. You can customize the text that appears in the standard link under the Link Text section. You can also choose what you would like to link the standard link to from the following options:
- 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.
- NONE: The button will not link anywhere and exists for aesthetic reasons on your page.
None: The exact number of events according to your selection of rows and columns will display.
Yes, as a "load more link": A link will display as the last item in your sequence of events, which will load more of your events once clicked. You can customize the text that shows in this box in the LINK TEXT box provided.
For example, if you choose to display two rows and three columns of events, the last event on the second row will be replaced with your custom link text prompting users to click to load more events. (PRO TIP: Turning this feature on is recommended if you have more than ten items for mobile viewing.)
Yes, as a Standard Link: Similar to the previous load more option, this choice displays a box with custom link text as the last item in your sequence of products that connects to another area.
LAYOUT OPTIONS
You can choose from 8 different client gallery block layouts for how you'd like your events to be displayed in your client gallery block. The client gallery block layouts are the following:
- MODERN SQUARE: Events are cropped into squares, using your choice of rows and columns. Event titles and expiration dates will display as a cut out over the image. Event descriptions are not supported with the Modern Square layout.
- MODERN PORTRAIT: Events will display vertically, taller than they are wide, in a grid with the number of rows and columns of your choosing. Event titles and expiration dates will display as a cut out over the image.
- MODERN LANDSCAPE: Events will display horizontally, wider than they are tall, in a grid with the number of rows and columns of your choosing. Event titles and expiration dates will display as a cut out over the image.
- EDITORIAL CIRCLE: Events will display in circles with the number of rows and columns of your choosing. Event titles and expiration dates will display below the image.
- EDITORIAL SQUARE: Events will display as squares in a grid with the number of rows and columns of your choosing. Event titles and expiration dates will display below the image.
- EDITORIAL LANDSCAPE: Events will display horizontally in a grid of the number of rows and columns of your choosing. Your event cover image will be cropped to rectangles, wider than they are taller. Event titles and expiration dates will display below the image.
- EDITORIAL PORTRAIT: Images will display vertically, taller than they are wide, in a grid with the number of rows and columns of your choosing. Event titles and expiration dates will display below the image.
- GALLERY: Events fit the content area with no cropping, remaining events in the sequence show up as tiles below the main event. Any title and description will lay over the top of the main event. There are left and right arrows to navigate through the event when using the Gallery layout.
You can also control the number of rows and columns that display depending on the layout you've chosen. This will control how many events appear on screen when a visitor is looking at your client gallery block.
To choose your layout and apply it to your client gallery block, simply click on the SAVE button under the layout you wish to use.
STYLING OPTIONS
The client gallery styling section gives you more control over how your events are displayed within the layout you've selected. By default, this section will use the styling and spacing settings in the global styling section of your website. You can override the global settings for your client gallery block within this area. The settings in this section can include any of the following items depending on the layout that you've selected:
- Overlay Opacity: Adjusts the opacity upon hovering over an event. This setting only applies to layouts where titles and descriptions are seen by hovering over an image. Increase or decrease the opacity of your overlay by adjusting the percentage.
- Title Alignment
- Description Alignment
- Image Border Thickness
- Space Between Items: Controls the spacing between events using grid layouts.
- 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.
- Flushing: Controls whether the content of this block flushes to fill the screen width or remains contained in the center.
- Mobile View: Controls whether events on mobile and smaller devices display in one column or two.
Click on Save Changes to apply your changes to your client gallery block styling options. The customized message will apply to any colors you've changed from your default styling settings.
COLORS
The button color section includes six 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:
- TITLE COLOR
- TEXT COLOR
- BACKGROUND COLOR
- OVERLAY COLOR
- LAST ITEM TEXT COLOR
- LAST ITEM BACKGROUND COLOR
- BORDER COLOR
The customized flag will appear next to any color you've selected to override the global color picker for your website.
Click on save changes at the bottom to apply your color updates.
BACKGROUND
You can add a background image to display behind your Client Gallery 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
You can easily customize the fonts you're using on your client gallery 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 client gallery block:
- TITLE
- DATE
- LAST ITEM TEXT
Click on Save Changes at the bottom of the control panel menu to apply your changes.
ANIMATIONS
You can add IMAGE HOVER ANIMATIONS to your Client Galleries block. You can choose between the following options:
- NONE
- SCALE
- BLUR
- SCALE BLUR
- BOUNCE
Click on SAVE CHANGES at the bottom to apply your Image Hover Animation.