How to Use Image Blocks in PhotoBiz

Image Blocks allow you to display photos throughout your website in organized, professional layouts. You can use them to showcase your portfolio, highlight services, feature blog-style content, or create visual storytelling sections on any page.

In this guide, you will learn how to add an Image Block, upload and manage images, choose a layout, and customize styling options including colors, fonts, backgrounds, and animations.

STEP ONE

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

STEP TWO

CHOOSE A PAGE

Click on the name of the page where you’d like to add images—or create a new page.

There are two ways to add an image block:

• Quick Add: Click the Image icon on the right side of the screen. The image block will be added to the bottom of your page.
  
  
• Drag & Drop: Hover over the Image icon, click and hold, then drag it to your preferred spot. Release when a teal line appears. You can always move the block later by dragging it up or down.

STEP THREE

CHOOSE YOUR BLOCK STYLE

You’ll have two options:

• Blank Block: Customize the layout and design from scratch using your global style settings.
  
  
• Pre-designed Block: Choose from professionally styled layouts with custom designs ready to go.

Click the Select button under your preferred image block design.

STEP FOUR

ADD & MANAGE IMAGES

Once the block is added, you’ll be in the Images section where you can upload and organize your photos.

If you selected a pre-designed block, stock images will appear in your layout. You can:

• Keep the stock images
  
  
• Remove them by dragging them to the Delete button

To add your own images, choose one of the following options:

• UPLOAD – Add new images from your device
  
  
• CLIPBOARD – Use images you’ve previously uploaded
  
  
• STOCK IMAGES – Browse royalty-free stock photos

Once your images are added, you’ll see them in the right panel. You can:

• Rearrange images by dragging

• Click on each image to:

  • Add Titles & Descriptions

  • Add Alt Text

  • Link images to other content

STYLING OPTIONS FOR YOUR IMAGE BLOCK

LAST ITEM LINK

Use this to turn the last image in your block into a clickable link or “Load More” feature. This is particular useful if you have many images uploaded OR if you have more images than the number of rows and columns that are available in your page layout and you want visitors to be able to view the additional images. 

Link options include:

• None (no link)

• Load More (displays more images in the same block)

• Standard Link (link to):

  • A different page

  • Form

  • Landing page or campaign

  • PDF or file

  • Phone, email, or map

  • Video (YouTube/Vimeo)

  • Pop-up

You can also customize the button text for this item.

IMAGE BLOCK LAYOUT OPTIONS

You can choose from a variety of Image Block layouts. Below is an overview of all available layout options in the PhotoBiz Website Builder:

• SQUARE – Square grid layout. Titles and descriptions appear on hover.

• PORTRAIT – Taller images in a grid. Titles and descriptions appear on hover.

• LANDSCAPE – Wider images in a grid. Titles and descriptions appear on hover.

• EDITORIAL CIRCLE – Circular images in a grid with text below each image.

• EDITORIAL SQUARE – Square images in a grid with text below.

• EDITORIAL LANDSCAPE – Wide rectangular images in a grid with text below.

• EDITORIAL PORTRAIT – Vertical rectangular images with text below.

• PINBOARD – Mixed-size images displayed in a flowing grid. Text appears below.

• COLLAGE 4 – Four cropped images in a predefined arrangement. Text appears on hover.

• COLLAGE 5 – Five cropped images in a predefined arrangement. Text appears on hover.

• COLLAGE 6 – Six cropped images in a predefined arrangement. Text appears on hover.

• MODERN SQUARE – Cropped squares with title overlays. Descriptions are not supported.

• MODERN PORTRAIT – Cropped vertical images with title overlays. Descriptions are not supported.

• MODERN LANDSCAPE – Cropped horizontal images with title overlays. Descriptions are not supported.

• STACK MINI – Images fill approximately 70% of the content width and stack in rows. Text appears below.

• STACKABLE – Images fill 100% of the content width and stack vertically.
  
  
• GALLERY – A large main image with thumbnails underneath. Arrows allow navigation. Text appears over the main image.
  
  
• SLIDESHOW – Auto-playing slideshow with uncropped images. Titles and descriptions appear over each slide.

• CAROUSEL – A horizontal row of scrollable images.

• CAROUSEL SLIDESHOW – A scrollable carousel that automatically cycles through images.

• EDITORIAL CAROUSEL PORTRAIT – Vertically cropped carousel with editorial-style text below.

• EDITORIAL CAROUSEL LANDSCAPE – Horizontally cropped carousel with editorial-style text below.

• EDITORIAL CAROUSEL NO CROP – Carousel that maintains original image proportions with text below.

• EDITORIAL CAROUSEL MINI – A compact editorial-style carousel.

• EDITORIAL COLLAGE 3 – Three cropped images in an editorial-style collage with text below.

• EDITORIAL COLLAGE 4 – Four cropped images in an editorial-style collage with text below.

• GALLERY COLLAGE 3 – A collage of three images above a traditional gallery layout.

• GALLERY COLLAGE 4 – A collage of four images above a traditional gallery layout.

• CARD PORTRAIT – Portrait-oriented card layout for showcasing images with text.

• CARD CIRCLE – Circular image cards with text.

• CARD PORTRAIT OVERLAY RIGHT – Portrait card layout with text overlay on the right.

• CARD LANDSCAPE OVERLAY LEFT – Landscape card layout with text overlay on the left.

• CARD PORTRAIT SPLIT – Split layout with image and text displayed side-by-side.
• ACCORDION GALLERY SQUARE - Image displayed in a square with title and captions displayed. 

• ACCORDION GALLERY IMAGE LEFT

• ACCORDION GALLERY RIGHT

To use a layout, click SAVE under the one you want to apply.

STYLING OPTIONS

Styling controls may vary depending on your chosen layout. You can override your site’s global styles for more control:

• Overlay Opacity

• Title & Description Alignment

• Image Border Thickness

• Open Full Screen Mode

• Spacing:

  • Between items

  • Below blocks

  • Inside blocks

• Flushing: Choose full-width or centered

• Mobile View: Show 1 or 2 columns

👉 Click "Save Changes" to apply your updates.

COLORS

You can override your website’s global color settings for your Image block. The options in the Colors section can vary depending on the layout you've selected. Color options can include:

• Title Color - image title font color
• Text Color - image description font color
• Background Color - background color for image block.
• Overlay Color - color for image overlay
• Last Item Text Color - last item link font color
• Last Item Background Color - last item link background color
• Border Color - image border color

Click save changes to apply. 

BACKGROUND

Add a background image behind your image block. Choose from:

• Custom Upload

• Background Library

Background Display Settings:

• Tile – Repeats image

• Top Left – Anchors image in top left

• Centered – Centers image

• Cover – Scales image to fill background

Click Save Changes to apply.

FONTS

You can easily customize the fonts you're using on your image 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 banners:

• TITLE

• DESCRIPTION

• LAST ITEM TEXT

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

ANIMATIONS

Choose hover animations for your images:

• NONE

• SCALE

• BLUR

• SCALE BLUR

• BOUNCE

👉 Don’t forget to click Save Changes to apply your animation!

Using DuoBuild with the Text Editor Block

The Image Block supports DuoBuild.

DuoBuild allows you to place supported blocks side by side to create a two-column layout without using custom code. To activate DuoBuild, drag one supported block horizontally over another supported block. When the block highlights in green and you release your mouse, the blocks will snap into a side-by-side layout.

The block you drag onto will appear on the left, and the other block will appear on the right.

If the blocks do not snap into place, confirm that both block types are included on the supported DuoBuild list.

FINAL STEP

After adding your images, selecting a layout, and adjusting styling settings, your changes update in real time as you work.

Review your page to confirm your images are arranged correctly, titles and captions display as expected, links function properly, and styling matches your brand.

Your Image Block is now live on your website.

If you have any questions about the Images 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 - 6:00pm EST and we're happy to help you however we can.