MENU

How To Use Products Blocks

May 8, 2025 | By: PhotoBiz Knowledge Base

Using the Product Block to Sell Items on Your Website

The Product Block makes it easy to showcase and sell your e-commerce products right on your PhotoBiz site. You can add it to any page — or even create a dedicated store page to display all your items.

Follow these steps to get started and style it your way!

STEP ONE

LOG IN

  • Log in to your PhotoBiz account.
  • Click WEBSITE from the left-hand menu.

STEP TWO

ADD A PRODUCT BLOCK TO A PAGE

  1. Click the name of the page you want to edit — or create a new one.

  2. To add a Product Block:

    • Click the Product icon in the right panel to add the block to the bottom of the page.

    • OR drag the icon where you'd like it to appear. When you see the teal line, drop the block in place.

  3. You can always move the block later by dragging it up or down.

STEP THREE

CHOOSE WHAT PRODUCTS TO SHOW

  1. Click directly into the Product Block (or click the pencil icon to edit it).

  2. Go to the Advanced tab on the right.

  3. Choose what to display:

    • All Product Categories

    • A Single Product Category

    • Products with a Specific Tag

    • Custom Products (select individual items)

  4. Click Save Changes — your selected products will now display on the page.

STYLING YOUR PRODUCT BLOCK

LAST ITEM LINK (Optional)

This is a link that appears at the end of your product grid. Use it to load more items or send visitors elsewhere.

Available options:

  • None – No link.

  • Load More Link – Loads more products when clicked.

  • Standard Link – Send visitors to:

    • Another page on your site

    • A form

    • An external link

    • A PDF or downloadable file

    • A video

    • A pop-up

    • A map, email, or phone number

You can also customize the button text and link destination.

PRODUCT BLOCK LAYOUT OPTIONS

Choose from 27 unique layouts to best display your products:

Grid Layouts

  • Modern (Square, Portrait, Landscape) – Title & price appear on the image.

  • Editorial (Circle, Square, Portrait, Landscape) – Similar to Modern with subtle style changes.

  • Designer (Pinboard, Portrait, Landscape) – Title below image, price on image.

  • Gallery – Large featured image with thumbnails below; perfect for fine art and prints.

Image + Text Layouts

  • Image Small/Large/Thin Left – Image on the left, text on the right.

  • Image Bottom – Text on top, image below.

Classic & Contemporary Layouts

  • Classic – Landscape, Layers, Menu, Stack Menu (with or without images).

  • Contemporary – Clean modern layouts with flexible arrangements.

  • Designer Menu – Polished, high-end layout.

  • Center Menu – No images; centered text-only layout.

Single Item Layouts

  • Single Item Square / Landscape – Highlight one item with multiple images.

💡 Pro Tip

Selling artwork or prints?
Use the Gallery Layout to beautifully feature your work and sell it directly from the page!

STYLING YOUR PRODUCT BLOCK

Make your Product Block match your brand with easy visual customizations.
Styling options vary depending on your selected layout.

Available Styling Options

  • Overlay Opacity – Set how transparent the hover overlay appears.

  • Title & Description Alignment – Align your text left, center, or right.

  • Image Border Thickness – Add borders from none to thick.

  • Spacing – Adjust:

    • Space between product items

    • Space above and below the block

    • Padding inside the block

  • Flushing – Choose between full-width or centered content.

  • Mobile View – Show one or two columns on phones.

Click Save Changes to apply your updates.

COLORS

Customize the colors in your Product Block without affecting global site styles.
Available color options depend on your layout.

You can update:

  • Title Color

  • Text Color

  • Background Color

  • Overlay Color

  • Last Item Text Color

  • Last Item Background Color

  • Shape Background Color

  • Shape Text Color

  • Border Color

  • Caption Title

  • Caption Text

Click a color square to choose a shade or enter a HEX code. A flag will appear beside any setting you’ve changed from your global defaults.

Click Save Changes when you're done.

BACKGROUND OPTIONS

Customize your block’s background to match your site’s style:

  • Upload your own image or choose one from the Background Library.

  • Choose how the background displays:

    • Tile

    • Top Left

    • Centered

    • Cover

Click Save Changes to apply your background.

FONTS

Personalize the fonts used in your Product Block.
Font options vary by layout.

Common font settings include:

  • Title

  • Price

  • Last Item Text

  • Button Text

You can adjust font style, size, spacing, and line height.

Click Save Changes when you’re done.

ANIMATIONS

Add subtle motion to enhance your Product Block and create a more engaging shopping experience.
Available animations depend on the layout you choose.

Image Hover Animations

Choose what happens when someone hovers over a product image:

  • None – No animation.

  • Scale – Gently zooms in.

  • Blur – Soft blur effect.

  • Scale Blur – Zoom + blur.

  • Bounce – Adds a playful bounce.

Button Hover Animations

Enhance button interactions:

  • Fill – Bold style change on hover.

  • Overlay – Highlights button and text with contrast.

  • Scale – Grows the button by 10% on hover.

  • Arrows – Adds a sleek arrow icon for a polished look.

These animations help draw attention and encourage more clicks!
Previous Post Next Post

Related Posts

How should I get started with my Photography Online Store?

June 21, 2024

How should I get started with my Retail Online Store?

April 9, 2025

How To Make Products Searchable On Your Website

July 28, 2023

How Do I Set Up Products?

May 2, 2025

CLOSE