Add a Banner image slideshow featuring text and buttons to create a great visual and to highlight important information on your website.
ADDING A BANNER BLOCK TO YOUR WEBSITE
STEP ONE
Log into your PhotoBiz account and click on the WEBSITE option in the left side menu.
STEP TWO
- Select the page where you'd like to add a banner.
- From the right-side block menu, click Add Block and choose BANNER.
STEP THREE
- Once the banner block is added, click inside the block to open the editing menu.
- Alternatively, click the pencil icon in the top-right corner of the banner block and select Advanced Settings.
ADDING IMAGES & STYLING YOUR BANNER BLOCK
IMAGES
Adding Images
-
In the banner editing menu, click Add Images.
- Each banner block supports up to 24 images.
-
You can:
- Upload images from your computer.
- Insert images from the Clipboard.
- Choose images from the Stock Image Library.
-
Add:
- One image for a static banner.
- Multiple images to create a slideshow.
PRO TIP!
- Use horizontal images for best results unless you're using a Carousel layout, which works well with vertical images.
- Images with centered subjects (not close-ups) look better in banner designs.
Adding Text, Alt Text, & Buttons
- After adding an image, you'll see a thumbnail in the editing menu.
- Click the thumbnail to add:
- Title: Main text for your banner.
- Subtitle: Supporting text.
- Alt Text: For accessibility and SEO.
- Button: Add call-to-action buttons.
- Customize the text and alignment settings, then click Save Changes.
STEP FIVE
MOBILE IMAGES
- Upload a separate set of images for mobile viewers by clicking the Mobile Images icon.
- This is especially useful for layouts like Classic, ensuring mobile images display properly on vertical screens.
LAYOUT
There are ten different layouts for the Banner Block.
- 4 Classic layouts: Classic Full Screen, Classic Medium, Classic Short, and Classic Thin.
- 2 Carousel layouts: Carousel Full Screen and Carousel Medium.
- 4 No Crop versions of our Classic layouts: No Crop Full Screen, No Crop Medium, No Crop Short, and No Crop thin.
Once you've chosen the layout you wish to use, click save.
CLASSIC LAYOUTS
Best for horizontal "hero" images. These fill the space entirely and may crop images based on screen size.
- Full Screen
- Medium
- Short
- Thin
CAROUSEL LAYOUTS
Display multiple images in a scrolling carousel, ideal for mixed aspect ratios.
- Full Screen
- Medium
NO CROP LAYOUTS
Fits the entire image into the banner without cropping, adding white space as needed.
- Full Screen
- Medium
- Short
- Thin
MOBILE LAYOUT OPTIONS
- Customize how your banner appears on mobile by selecting a mobile-specific layout.
- Available styles: Full Screen, Medium, Short, or Thin.
- Click Save Changes to apply your selection.
STYLING
To adjust the styling settings for your banner block, click on styling and you will be presented with the following options:
- Overlay Opacity: Add a color overlay to your banner and adjust its transparency.
- Scroll Animation: Enable parallax scrolling for dynamic effects or keep it static.
- Space Below Blocks: Adjust the spacing between your banner and the next block.
Click on SAVE CHANGES to apply your selections.
COLORS
- Change the banner's colors by clicking the Color tab in the editing menu.
- Choose from your accent colors or pick a custom color.
- Click OK and Save Changes.
FONTS
- Adjust the banner font to override global settings.
- Customize:
- Font Type
- Size
- Letter Spacing (Kerning)
- Line Height
- Click Save Changes to apply your font settings.
ANIMATIONS
- Select the Animations tab to apply hover effects to your banner buttons.
- Choose from:
- None
- Fill
- Overlay
- Scale
- Arrows
- Click Save Changes to finalize your animation settings.
PRO TIP!
Use horizontal images for Classic and No Crop layouts. For vertical images, Carousel layouts work best.
If you have any questions, call our Passionate Support Team at 866.463.7620 or start a live chat from your PhotoBiz control panel. We’re available Monday – Friday, 9:00 AM – 6:00 PM EST.
