Documentation

WooCommerce Product Image for Bricks Builder: Overview

Max Addons Product Image element for Bricks Builder allows you to seamlessly display WooCommerce product images with engaging hover effects.

In this guide, we'll explore all available options and features of the WooCommerce Product Image element.


Getting Started#

Before using the Product Image element, ensure you have the following installed and activated:


Steps to Get Started#

  1. Open the WooCommerce Single Product Page template in the Bricks Builder editor.
  2. Use the element search bar to find "Product Image."
  3. Add the Product Image element to your page.
  4. Ensure the element has the "Max" tag in the top-right corner, indicating it's part of Max Addons.


Content Tab: Product Image Customization#

Once the element is added, you'll see various customization options in the left sidebar. These allow you to control how your product image appears and behaves.

  • Image Size: Select the appropriate size for your product image to ensure optimal display quality.
  • HTML Tag: Choose the HTML tag (e.g., div, figure, picture) to structure your product image correctly for SEO and styling purposes.
  • Change Image on Hover: When enabled, the first image from the product gallery replaces the main product image on hover.
  • Hover Effects: Choose from various hover effects to create engaging visuals when users hover over the product image:

    • Fade
    • Fold Left
    • Fold Right
    • Push Left
    • Push Right
    • And more…

  • Link To: Define where the product image links to:

    • Post (links to the single product page)
    • Other (URL) (custom link for external or internal pages)

product image for bricks builder


WooCommerce Product Image element in Max Addons for Bricks Builder gives you complete control over how product images appear and behave on your eCommerce website built using WooCommerce.

So, this was the complete overview of the Max Addons Product Image element!

Not the solution you are looking for?

Please check other articles or open a support ticket.