How To Use List Blocks

How to Use List Blocks in PhotoBiz

Overview

The List Block is a flexible content block in the PhotoBiz Website Builder that lets you organize images, text, and videos into structured layouts. You can use List Blocks to showcase photography services, team members, testimonials, portfolio categories, promotions, process steps, and other groups of related content.

PhotoBiz offers several List Block layouts, including image grids, editorial designs, image-and-text combinations, and Story Panels. You can customize how your content appears on desktop and mobile devices.

This guide walks you through adding a List Block, managing its Items, choosing layouts, customizing its appearance, and using additional features such as Last Item links, animations, and DuoBuild.

STEP ONE

Open the page where you want to add the List Block. You can also create a new page if needed.

STEP TWO

Find the LIST icon on the right side of the Website Builder.

Click and hold the LIST icon, then drag it to the location where you want the block to appear. Use the placement line to position the block, then release it to add the List Block to your page.

You can also click the LIST icon once to automatically add the block to the bottom of the page.

STEP THREE

The SELECT LIST BLOCK panel displays a Blank Block and 18 Pre-Designed List Block options.

Click SELECT under Blank to create an empty List Block and add your own content.

Alternatively, browse the available designs, labeled List 1 through List 18, and click SELECT under the design you want to use.

When you select a Pre-Designed List Block, PhotoBiz automatically populates the design using images from your Image Clipboard. If your Image Clipboard is empty or does not contain enough images, PhotoBiz uses available stock photos to fill the remaining spaces.

PhotoBiz also uses information from your Business Profile to generate text content for the Pre-Designed Block.

You can edit or replace the automatically generated images, text, and other content after adding the block to your page.

STEP FOUR

Click ITEMS in the right-side panel to open EDIT LIST.

If you selected a Blank Block, your List Block will not contain any Items. Click IMAGE, TEXT, or VIDEO to add your first List Item.

If you selected a Pre-Designed Block, the List Items will already be populated with images and text based on the design you selected. You can click an existing Item to edit its content, add new Image, Text, or Video Items, rearrange their order, or delete Items you don't want to use.

Continue adding or editing Items until your List Block contains the content you want to display on your website.

Blank Example

Pre Designed Example

FINAL STEP

Use the right-side panel to customize your List Block. The settings appear in this order: ITEMS, LAST ITEM, LAYOUT, STYLING, COLORS, BACKGROUND, FONTS, and ANIMATION.

Choose the settings that work best for your content and click SAVE CHANGES after making updates.

Your saved changes automatically apply to your PhotoBiz website. You do not need to publish the page separately.

Preview your page on desktop and mobile to make sure your finished List Block displays the way you want.

Managing Your List Items

The ITEMS section opens EDIT LIST, where you can add, edit, reorder, and delete the content displayed in your List Block.

PhotoBiz supports three types of List Items:

Image: Display an image with optional titles, descriptions, and buttons.
Text: Display text-focused content with optional titles, descriptions, and buttons.
Video: Display an embedded or uploaded video with optional supporting text and buttons.

You can combine Image, Text, and Video Items within the same List Block. Buttons are optional for all three Item types, and their appearance depends on the layout you select.

You can add up to 50 List Items per List Block, using any combination of Image, Text, and Video Items. The number of Items displayed at once depends on your selected layout and Last Item settings.

Image Items

Use an Image Item to display a photo or graphic with optional supporting text, a button, and a link.

Click IMAGE in the EDIT LIST panel to create a new Image Item.

You can add an image using any of these options:

Clipboard: Choose an image from your PhotoBiz Image Clipboard.
Stock Images: Select an available stock image.
Add Files: Upload an image from your computer or drag and drop your image into the upload area.

You can also customize the following fields:

Title: Add an optional heading for your Image Item.
Description: Include optional supporting information about your image.
Alt Text: Describe the image for visitors who use screen readers.
Button Text: Add an optional button label.
Link To: Select a destination for your Image Item or button. Leave this set to None if you don't want to add a link.

For complete details about linking your Items, see How to Link a List Block Item.

Click CREATE ITEM after entering your content to add the Image Item to your List Block.

Depending on your selected layout, the Title, Description, and Button may appear below the image or when visitors hover over it.

List Item Image Example

This example shows an Image Item using the Arches layout, with a Title, Description, and optional Button.

Text Item

Use a Text Item to display text-focused content without an image. Text Items work well for service descriptions, pricing details, testimonials, and other information you want to organize within your List Block.

Click TEXT in the EDIT LIST panel to create a new Text Item.

You can customize the following fields:

Title: Add an optional heading for your Text Item.
Description: Enter the text you want to display.
Button Text: Add an optional button label.
Link To: Select a destination for your Text Item or button. Leave this set to None if you don't want to add a link.

For more information about linking List Items, see How to Link a List Block Item.

Click CREATE ITEM after entering your content to add the Text Item to your List Block.

The appearance of your Title, Description, and optional Button depends on the List Block layout you select.

Video Items

Use a Video Item to display video content within your List Block, with optional supporting text, a cover image, and a button.

Click VIDEO in the EDIT LIST panel to create a new Video Item.

Under VIDEO TYPE, select one of the following options:

Embed Code: Paste an embed code from a video service such as YouTube or Vimeo into the EMBED CODE field.
My Videos: Select a video you previously uploaded to your PhotoBiz account using the CHOOSE A VIDEO dropdown.

If you want to use a video uploaded directly to your PhotoBiz account, see How to Upload Video to PhotoBiz for step-by-step instructions.

You can also customize the following fields:

Image: Add an optional cover image using CLIPBOARD, STOCK IMAGES, or ADD FILES.
Title: Add an optional heading for your Video Item.
Description: Include optional supporting text about your video.
Alt Text: Describe your cover image for visitors who use screen readers.
Button Text: Add an optional button label.

Note: A cover image is not required. Without one, the Video Item may display a blank background with a play button, depending on your selected layout. Visitors can click the play button to watch the video.

Click CREATE ITEM after entering your content to add the Video Item to your List Block.

The appearance of your video, supporting text, and optional button depends on the List Block layout you select.

Embedded Video Example

Uses an embed code from YouTube or Vimeo.

Uploaded Video

Choose a video you have uploaded directly to your PhotoBiz account.

Reordering List Items

You can change the order of your List Items without deleting or recreating them.

In the EDIT LIST panel, click and hold the Item you want to move, then drag it to a new position. Release it where you want the Item to appear.

The order of your Items determines how they appear within your selected List Block layout.

You can rearrange Image, Text, and Video Items in any order to create the presentation you want.

Deleting Individual List Items

To remove an Item from your List Block, open ITEMS and drag the Item onto the DELETE option in the EDIT LIST panel.

PhotoBiz displays a DELETE ITEM confirmation asking:

ARE YOU SURE YOU WANT TO DELETE THIS ITEM?

Click YES, DELETE IT to permanently remove the Item, or click CANCEL to keep it.

Important: Deleting a List Item cannot be undone. If you delete an Item and want to use it again, you will need to create a new Image, Text, or Video Item and add its content again.

Deleting an individual List Item does not delete the entire List Block.

Last Item Options

The LAST ITEM section controls whether visitors can load additional List Items or follow a link to another page.

Click LAST ITEM in the right-side panel to open DISPLAY LAST ITEM LINK.

You can select one of the following options:

None: No link is added to the last Item in your grid.
Yes, as a "load more link": Allows visitors to load another set of List Items without leaving the page. You can customize the LINK TEXT and, for certain layouts, select a LINK STYLE to control how the Load More option appears.
Yes, as a "standard link": Adds a link that directs visitors to a separate page.

Note: The LINK STYLE setting is only available for certain List Block layouts. The available options may change depending on your selected layout.

Click SAVE CHANGES after selecting your Last Item settings.

For more detailed instructions, see How to Adjust Last Item Load More Options in a List Block.

List Block Layouts

The LAYOUT section controls how your List Items are arranged and displayed on your website.

Click LAYOUT in the right-side panel to browse the available List Block designs. PhotoBiz automatically scrolls to your currently selected layout, which is highlighted in the list. The CURRENT LAYOUT section also displays the active layout name and its Rows and Columns settings, when applicable.

Each layout includes a preview showing how your List Items can appear. To change your layout, browse the available designs, adjust the Rows and Columns dropdowns if they are available, and click SAVE beneath the layout you want to use.

PhotoBiz includes 26 List Block layouts, ranging from traditional image grids and editorial designs to image-and-text combinations and Story Panels. Available Rows, Columns, Styling options, and content behavior vary by layout.

For more detailed instructions, see How to Change a List Block Layout.

Square, Portrait, and Landscape Layouts

These layouts use image-based designs that display the Title, Description, and Button when visitors hover over an Item.

Available layouts:

Square
Portrait
Landscape

Layout settings:

Rows: 1–10
Columns: 1–5

Use these layouts when you want images to be the primary focus while keeping supporting content available through hover effects.

Because these layouts rely on hover interactions for supporting content, review how they display on mobile devices.

Editorial Layouts

Editorial layouts display supporting text below the image instead of relying on hover effects for the primary content.

Available layouts:

Editorial Circle
Editorial Square
Editorial Landscape
Editorial Badges
Editorial Portrait

Layout settings:

Rows: 1–10
Columns: 1–5

Editorial layouts work well for services, team profiles, portfolio categories, and other content where you want titles and descriptions to remain visible.

Pinboard Layout

The Pinboard layout creates a visual grid with differently sized content areas.

When visitors hover over an Item, the Title and Description appear. Buttons are not displayed in this layout.

Layout settings:

Rows: 1–10
Columns: 2–4

Use Pinboard when you want a varied visual arrangement instead of evenly sized image tiles.

Modern Layouts

Modern layouts keep the Title visible while using a simplified, image-focused design.

Available layouts:

Modern Square
Modern Portrait
Modern Landscape

Layout settings:

Rows: 1–10
Columns: 1–4

These layouts work well when you want a clean presentation with titles that are easy to identify.

Image Left and Image Right Layouts

These layouts place an image on one side and supporting text on the other.

Available layouts:

Image Small Left
Image Small Right
Image Large Left
Image Large Right

These designs work well for services, team introductions, featured offerings, and other content where images and text should share attention.

They also allow images to display without the same type of cropping used by some grid-based layouts.

These layouts use their own structure instead of the standard Rows and Columns controls.

Story Panel Layouts

Story Panels provide a visual, sequential way to present images, text, and videos instead of using a traditional grid.

Available layouts:

Story Panel Square
Story Panel Portrait
Story Panel Landscape

Story Panels work well for:

Photography processes and client experiences
Before-and-after content
Testimonials and featured stories
Event highlights
Vertical video presentations

Story Panels use their own layout structure instead of the standard Rows and Columns controls.

For complete setup instructions, see How to Set Up Story Panels.

Additional Specialized Layouts

PhotoBiz includes several additional layouts with unique image shapes, text placements, borders, and overlays.

Available layouts:

Arches
Circle Overlay Top
Designer Portrait Title Overlay
Portrait Border
Image Border Text Bottom

Layout settings:

Rows: 1–10
Columns: 1–4

Each layout uses a different combination of image shape, supporting text, and visual styling.

Use these layouts when you want a more distinctive presentation than a traditional image grid.

Contemporary Layouts

Contemporary layouts offer alternative grid designs with a structured column arrangement.

Available layouts:

Contemporary Square
Contemporary Landscape

Layout settings:

Rows: 1–10
Columns: 2–4

Use these layouts when you want an alternative grid style with a more structured column arrangement.

Understanding Rows and Columns

For layouts that support them, Rows and Columns control how many List Items appear within the block.

Rows determine how many horizontal groups of Items can display, while Columns determine how many Items appear across each row.

The available Rows and Columns settings depend on your selected List Block layout. Image Left, Image Right, and Story Panel layouts use their own layout structures instead of the standard Rows and Columns controls.

Avoid overcrowding your layout with too many Columns, especially when your List Items contain longer Titles or Descriptions.

Styling Your List Block

The STYLING section lets you customize the appearance, spacing, alignment, and mobile display of your List Block. Available settings vary depending on the layout you select, so some layouts include additional options for slideshows, image borders, and other design features.

Click STYLING in the right-side panel to view the available settings.

Depending on your selected layout, you may see the following options:

Overlay Opacity: Adjust the transparency of the overlay displayed over your List Item images. Lower values make the overlay more transparent, while higher values make it more opaque.
Auto Play: Turn automatic slideshow playback on or off for layouts that support this feature.
Slideshow Speed: Adjust how long each slide displays before automatically advancing to the next Item.
Title Alignment: Select how List Item titles are aligned.
Description Alignment: Select how List Item descriptions are aligned.
Button Alignment: Select how buttons are aligned within your List Items.
Image Border Thickness: Adjust the thickness of borders around List Item images in supported layouts.
Space Between Items: Control the amount of space separating individual List Items.
Space Below Blocks: Adjust the spacing beneath the entire List Block.
Space Inside Blocks: Control the spacing inside the List Block around its content.
Flushing: Select On or Off to control whether the block extends across the available width without its standard outer spacing.
Mobile View: Choose how many columns of List Items display on mobile devices.

The spacing controls offer five options: None, Ultra Thin, Thin, Medium, and Thick.

Mobile View

The MOBILE VIEW setting lets you control how List Items are arranged on smaller screens.

Depending on your selected layout, you can choose:

1 Column: Displays List Items in a single column on mobile devices.
2 Column: Displays List Items in two columns on mobile devices.

Your mobile layout does not need to use the same number of columns as your desktop layout.

Customized Settings

When you change an applicable setting from your website's global design settings, PhotoBiz displays a CUSTOMIZED indicator next to that setting.

This lets you identify settings that have been customized specifically for your List Block. Click CUSTOMIZED to restore the corresponding global setting.

Note: Not every List Block layout includes every Styling option. If you change layouts, the available settings may also change.

Click SAVE CHANGES after adjusting your Styling settings. Your changes automatically apply to your website.

Preview your List Block on desktop and mobile to make sure your images, text, buttons, and spacing display as intended.

If you want to customize the border around images in your List Block, see How to Add Image Borders in a List Block on Your PhotoBiz Website.

Colors

The COLORS section lets you customize the colors used in your List Block without changing your website's global color settings.

Click COLORS in the right-side panel to view the available color options.

Depending on your selected List Block layout, settings may include:

Title Color / Item Title Color: Controls the color of List Item titles.
Text Color: Controls the color of List Item descriptions.
Button Text Color: Sets the color of button text.
Button Border Color: Controls the color of button borders.
Button Background Color: Controls the background color of buttons.
Button Overlay Color: Controls the color used for supported button overlay effects.
Button Contrast Color: Controls the contrasting color used for buttons.
Background Color: Controls the background color of the List Block.
Overlay Color: Controls the color of overlays displayed over List Item images.
Icon Color: Controls the color of icons used in supported layouts.
Last Item Text Color: Controls the text color of the Last Item link.
Last Item Background Color: Controls the background color of the Last Item link.
Border Color: Controls the color of borders used in supported layouts.
Line Color: Controls the color of decorative lines used in supported layouts.

You can select a color using the color picker or enter a specific hexadecimal (HEX) color code.

Customized Colors

When you change a color from your website's global design settings, PhotoBiz displays a CUSTOMIZED indicator next to that setting.

This lets you identify colors that have been customized specifically for your List Block. Click CUSTOMIZED to restore the corresponding global color setting.

Note: Available color options vary depending on your selected List Block layout. Some layouts include additional controls for buttons, overlays, borders, decorative lines, icons, or Last Item links. You may not see every option listed above.

Click SAVE CHANGES after adjusting your colors. Your changes automatically apply to your website.

For the best results, choose colors that complement your website design and provide enough contrast to keep titles, descriptions, and buttons easy to read.

Background

The BACKGROUND section lets you add a background image behind your List Block to customize its appearance.

Click BACKGROUND in the right-side panel to open the background settings.

Under BACKGROUND IMAGE, select one of the following options:

No Background: Displays the List Block without a background image.
Custom Background: Upload your own background image in JPG or PNG format.
Background Library: Choose a background image from PhotoBiz's available designs.

Uploading a Custom Background

If you select Custom Background, click ADD FILES to upload an image from your computer, or drag and drop your image into the upload area.

Background images support JPG and PNG formats, with maximum dimensions of 3000 pixels wide by 1730 pixels high.

Background Settings

After choosing a background image, you can select how it displays behind your List Block.

Available options include:

Tile: Repeats the image to fill the background.
Top Left: Positions the image at the top-left corner of the background area.
Centered: Centers the image within the available background area.
Cover: Scales the image to cover the entire background area. Some cropping may occur depending on the block's dimensions.

Click SAVE CHANGES after updating your background settings. Your changes automatically apply to your website.

Helpful Tip: Choose a background image that complements your List Items without distracting from your images, titles, descriptions, or buttons. If you use text over a background image, make sure it remains easy to read.

Fonts

The FONTS section lets you customize the typography used in your List Block without changing your website's global font settings.

Click FONTS in the right-side panel to view the available font options.

Depending on your selected List Block layout, you can customize fonts for:

Title: Controls the appearance of List Item headings.
Description: Controls the appearance of supporting text within your List Items.
Button Text: Controls the typography used for optional buttons.
Last Item Text: Controls the appearance of text used for Last Item links.

Each font section displays a preview of the current font and its settings. Click the font preview to access the available customization options, which include:

Font: Choose the typeface used for the selected text.
Size: Adjust how large or small the text appears.
Letter Spacing: Control the amount of space between characters.
Line Height: Adjust the vertical spacing between lines of text.

Customized Fonts

When you change a font from your website's global design settings, PhotoBiz displays a CUSTOMIZED indicator for that setting.

This helps you identify fonts that have been customized specifically for your List Block. Click CUSTOMIZED to restore the corresponding global font setting.

Note: Available font settings vary depending on your selected List Block layout. Some layouts may not use every text element listed above.

For more detailed instructions, see How to Change the Fonts in List Blocks.

Preview your List Block on desktop and mobile to make sure your text is readable and complements the rest of your website design.

Animation

The ANIMATION section lets you customize hover effects for images and buttons in your List Block.

Depending on your selected layout, you may see Image Hover Animation, Button Hover Animation, or both. If your layout does not support either type of animation, the ANIMATION tab will not appear.

Image Hover Animations

Image Hover Animations control how supported images respond when visitors hover over them.

Available options include:

None: No hover animation is applied.
Scale: Enlarges the image when hovered over.
Blur: Applies a blur effect to the image.
Scale Blur: Combines scaling and blurring effects.
Bounce: Adds a bouncing animation when the image is hovered over.

For more information about image hover effects, see How to Add Animation to My Images.

Button Hover Animations

Button Hover Animations control how supported buttons respond when visitors hover over them.

Available options include:

None: No hover animation is applied.
Fill: Adds a fill effect when visitors hover over the button.
Overlay: Applies an overlay effect to the button.
Scale: Changes the button's size when hovered over.
Arrows: Adds an arrow animation to the button.

For more information about button hover effects, see How to Add Animation to My Buttons.

Click SAVE CHANGES after selecting your animation settings. Your changes automatically apply to your website.

Note: Hover animations are designed for devices with a mouse pointer. Their appearance and behavior may differ on phones and tablets that use touchscreens.

Using DuoBuild With a List Block

The List Block supports DuoBuild, a Website Builder feature that automatically places two supported blocks side by side in a two-column layout.

DuoBuild allows you to combine a List Block with another supported block, such as a Text Editor Block, Images Block, or Video Block, without creating a separate page layout.

For complete instructions and a list of supported blocks, see DuoBuild Introduction.

Note: Each List Block counts toward the maximum number of supported blocks allowed on a Website Builder page, regardless of how many Items it contains. Using DuoBuild does not combine two blocks into one for counting purposes.

For more information, see What Is the Maximum Number of Blocks on a Page?.

Managing Your List Block

The List Block includes a management menu that lets you copy, move, rename, change the layout, adjust advanced settings, or delete the entire block.

To access these options, click the pencil icon in the upper-right corner of your List Block.

Available Block Management Options

COPY: Creates a duplicate of your List Block directly below the original. You can edit the copied block independently. For instructions, see How to Move or Copy Blocks Between Pages.
MOVE: Moves your List Block to another page or repositions it at the top or bottom of the current page. For instructions, see How to Move or Copy Blocks Between Pages.
RENAME: Gives your List Block a custom name for easier identification and Anchor Links. For instructions, see How to Rename Blocks and Add Anchor Links.
CHANGE LAYOUT: Allows you to select a different List Block layout without recreating your Items. For instructions, see How to Change a List Block Layout.
ADVANCED: Opens additional settings for your List Block.
DELETE: Opens the confirmation panel for deleting the entire List Block.

Deleting an Entire List Block

Deleting an entire List Block permanently removes the block and its List Items from your website page.

To delete the block, click the pencil icon in the upper-right corner of your List Block and select DELETE.

PhotoBiz displays a DELETE BLOCK confirmation warning before completing the deletion.

Click YES, DELETE IT to permanently delete the block, or click CANCEL to keep it.

Important: Deleting a List Block cannot be undone. If you want to preserve its content and design for future use, consider copying the block before deleting it.

What Your Website Visitors See

Once you save your changes, visitors can see your List Block on the website page where you added it.

The appearance and available interactions depend on your selected layout and settings.

For example:

Image Grid Layouts: Titles, descriptions, and optional buttons may appear when visitors hover over images.
Editorial Layouts: Supporting text appears below images without requiring visitors to hover.
Modern Layouts: Titles remain visible within an image-focused design.
Image Left and Image Right Layouts: Images appear alongside supporting text.
Story Panel Layouts: Images, text, and videos appear in a more sequential visual presentation.
Video Items: Visitors can play embedded or uploaded videos. Depending on the layout, videos without cover images may display a blank background with a play button.
Load More Links: Visitors can reveal additional List Items without leaving the page.
Buttons and Linked Items: Visitors can click configured links to open their destinations.

Your mobile presentation may differ from your desktop layout depending on the settings you select.

Preview your website on desktop and mobile to make sure images, text, videos, and buttons display as intended.

Best Practices for List Blocks

For the best results when creating List Blocks:

Choose the right layout: Select a design that matches the type of content you want to display.
Use high-quality images: Choose clear images that look good on desktop and mobile.
Keep titles concise: Short titles are easier to scan, especially in layouts with multiple columns.
Write useful descriptions: Provide enough information for visitors to understand your services, images, or offerings.
Maintain consistent image proportions: Similar image dimensions help create an organized appearance in grid layouts.
Add meaningful Alt Text: Describe important images and video cover images for visitors who use screen readers.
Consider mobile visitors: Avoid relying entirely on hover effects to communicate essential information.
Use Last Item thoughtfully: Load More Links can help visitors explore additional content without displaying every Item at once.
Check your links: Make sure linked Items and buttons direct visitors to the intended destinations.
Preview your changes: Review your List Block on desktop and mobile after making design changes.

Related List Block Guides

For more detailed instructions about specific List Block features, see:

Need Help With Your Website Design?

If you'd rather have the PhotoBiz team help build or organize your website, our Custom Website service can help you create a professional website tailored to your business.

Need Help?

Support Hours: Monday to Friday, 9am to 6pm EST

Phone: 866.463.7620

Support Channels: Phone, Live Chat, Support Ticket

NEXT: HOW TO USE BLOG BLOCK

Previous Post Next Post

How To Use Text + Image Blocks

October 9, 2026

How To Use Banner Blocks

October 2, 2026

How To Use Text Editor Blocks

October 6, 2026

How To Use Gift Card Blocks

October 9, 2026

How To Use List Blocks