Lorenza 3.0

Product template

Lorenza's Product pages template lets you change the look and feel of your product images and information, add sections that highlight other parts of your store, and configure other features like Swatches, Product Reviews, and an Information Popup. :

:

Set up your Product pages

Lorenza's product pages offer a flexible layout with alternate column and thumbnail views. You can also enable other features like Swatches, social sharing buttons, and a dynamic checkout button.

Your browser does not support the video tag.

Your browser does not support the video tag.

Change the look and feel of product information

From the Product pages settings, you can change the look and feel of the product info on your product pages:

STEPS

  1. From your Customize theme editor, choose Products from the pages drop-down menu at the top of the screen.

  2. Choose Product pages from the list of sections.

  3. Check the Enable full width checkbox to expand the product page content across the entire webpage.

By default, the content of your product page will have a margin on either side when displayed on wide desktop windows.

  1. Check the Show image thumbnails to enable an alternate layout for your product images and set the Thumbnail position to Below the product image or Beside the product image.

  1. Check the Show vendor checkbox to show the Vendor field as set up in your products.

    The vendor is typically the product's brand name.

  2. Check the Show swatches checkbox to let customers pick from product variants using swatch buttons.

    In order to show swatches, you need to set up the product swatches feature. See the Swatches article for more information.

  3. Check the Show social sharing buttons checkbox to let customers share your products on their social media.

    Available social sharing buttons include Facebook, X (Twitter), and Pinterest.

    These buttons display as a dropdown below your product description.

  4. Check the Show quantity selector to allow customers to easily buy more than one of your products at a time.

  5. Check the Show dynamic checkout button to show let customers quickly check out using a saved payment method.

    When enabled, the product page will display a secondary add-to-cart button with a payment option familiar to the current customer.

    This button only shows up for customers who have previously ordered something on a Shopify store and have a payment method saved. Check out Shopify's Dynamic checkout buttons documentation for more details.

  6. Check the Enable video looping checkbox to make product videos loop continuously after customers click to play them.

See Shopify's Product media guide to learn more.

  1. Click Save.

Settings reference

The main Product pages section has the following settings:

Enable full-width

Display your product page content across the entire webpage without side margins.

Show image thumbnails

Show thumbnails of your alternate product images that customers can click through.

Thumbnail position

Display product images thumbnails either Below the product image or Beside the product image.

Thumbnail size

Choose to display the product image thumbnails as Small, Medium, or Large.

Show vendor

Show the product's Vendor as you entered it while adding or editing your products.

Show swatches

Show swatch buttons as a way to let customers pick from your product's variants.

In order to show swatches, you need to set up the product swatches feature. See the Swatches article for more information.

Show social sharing buttons

Show Facebook, X (Twitter), and Pinterest share buttons to let customers share your products.

Show quantity selector

Show a quantity picker that lets customers add more than one product to the cart at a time.

Show dynamic checkout button

Show a "Checkout with <Payment Method>" button to customers who have ordered with Shopify previously.

Check out Shopify's Dynamic checkout buttons documentation for more details.

Enable video looping

For your products that have product videos added as media, make videos loop continuously after customers click to play them.

Add a Text section

A Text section can be added to the Product pages template that display below the product media.

Here's how to add a Text section:

STEPS

  1. From your Customize theme editor, choose Products from the pages drop-down menu at the top of the screen.

  2. Choose Text in the list of sections.

This will open the Text section settings.

  1. Check the Enable checkbox to show this section.

  2. Add a Heading.

    We recommend a title of just a few words long.

  3. Add Text.

Use the formatting buttons to add bold or italic text, and add a link to your social media or other pages.

  1. Click Save.

Settings reference

The following settings are available for Text sections on the product pages:

Enable

Check this checkbox to enable this section.

Heading

Change the heading displayed in the header area the section.

We recommend keeping this to just a few words long.

Text

Add subheading text.

Use the formatting buttons to add text styles, links, or lists. To learn more, see Shopify's Rich text editor guide.

Add a Gallery section

In addition to the home page, the Gallery section can be added to the Product pages template.

Here's how to add a Gallery section:

STEPS

  1. From your Customize theme editor, choose Products from the pages drop-down menu at the top of the screen.

  2. Choose Gallery in the list of sections.

This will open the Gallery section settings.

. Check the Enable checkbox to show this section.

  1. Choose how many Columns of gallery images to display per row.

    Choose between 2 and 4 columns.

    Note that on mobile devices only two columns per row are displayed.

  2. Choose the Image aspect ratio to be used for all gallery images.

    Use Natural to use the original images. Or, use Square (1:1), Landscape (3:2), or Portrait (2:3) to have the images cropped to match one another.

  3. Change the Heading text.

  4. Add Text to display beneath the gallery images.

    You can use the formatting options to add bold and italic text and add a link to another page.

  5. Return to the list of Product or Collection page sections to find your Gallery section with the content blocks nested below.

You can change the order of the blocks by using the drag handles:

  1. Use the Add item button to add as many gallery images as you want.

  2. Repeat this process until you've added all the features you need.

    You can also use the Remove block button to remove a gallery image from this section entirely.

  3. Click Save.

Settings reference

The following settings are available for Gallery sections on the product pages:

Image

Select or upload an image to be associated with the current block.

Enable

Check this checkbox to enable this section.

Columns

Use the slider to choose how many items to display side by side. You can choose between 2 and 4.

Image aspect ratio

Choose the aspect ratio for all images displayed.

Use Square (1:1), Landscape (3:2), or Portrait (2:3) to have the images cropped to match one another

Use Natural to display your images without cropping.

Heading

Change the heading displayed in the header area the section.

We recommend keeping this to just a few words long.

Text

Add subheading text.

We recommend a single, short paragraph.

Use the formatting buttons to add text styles, links, or lists. To learn more, see Shopify's Rich text editor guide.

Add Recommended products

You can add a Recommended products section to product pages on your store. This section appears underneath the main product media.

This section recommends products based on Shopify's Product recommendations algorithm, which takes into account a number of factors, like other products that are in the same collection(s) as the current product, products with similar descriptions, or items that have been commonly purchased together. :

For more information about product recommendations, see Shopify's Product recommendations guide.

Here's how to add a Recommended products section:

STEPS

  1. From your Customize theme editor, choose Products from the pages drop-down menu at the top of the screen.

  2. Select Recommended products from the list of sections.

  3. Check the Enable checkbox to enable the Recommended products section.

  4. Change the Heading.

  5. Change the Columns to display 2, 3, or 4 recommended products per row.

  6. Click Save.

Settings reference

The Recommended products section has the following settings:

Enable

Check this checkbox to enable the recommended products section.

Heading

Change the heading displayed above the list of products.

We recommend a title of just a few words long.

Columns per row

Change the amount of products displayed. You can choose between 2 and 4 products per row.

On mobile devices, this section will become a drag-through gallery.

Set up Product chips

You can replace the variant dropdown with square chips displayed in a row. These chips are clickable buttons that customers can use to switch between your product's variants.

Here's how to set up Product chips:

STEPS

  1. From your Customize theme editor, go to your Theme settings and select the Product section.

  2. Change the Option for chips name to match the Product option that you want to display variant chips for.

You can add chips to multiple Product options. Use a list seprated by commas, for example: "Size, Material, Fabric".

  1. Click Save.

Set up Swatches

You can replace the variant dropdown with circular images of the color or pattern of each variant. Color swatches are tiny, clickable buttons on your products. Each swatch links to one of your color variants.

To learn more about setting up swatches on your product pages, see our Swatches article.

Set up an Information popup

The Information popup displays extra information about your products, like a size guide or other details about your product variants.

Here's an example of an information popup used as a size guide:

To learn more about setting up an information popup on your product pages, see our Information popup article.

Set up Product Reviews

Lorenza is fully integrated with Shopify's Product Reviews app. You can add the app for Shopify's app store and won't need to add any code snippets.

To learn more about setting up Shopify's Product Reviews on your product pages, see our Product reviews article.

Add Local pickup

You can add a local pickup option for online orders. This is a Shopify feature and you can learn more by reading Shopify's Local pickup documentation.

After you've configured your preferences for a local pickup location, Lorenza will display whether an item is available for pickup, along with the store's location.

Here is how to configure your local pickup settings:

STEPS

  1. From your Shopify admin, go to Settings and select Shipping and delivery.

  2. Under Local pickup, click Manage beside the location that you want to enable. If you have several locations, then click Show more to display all your locations.

    You must have a location set up already before you can select it.

  3. Select This location offers local pickup.

  4. Under Information at checkout, change the settings to meet your needs.

  5. (Optional.) Under Order ready for pickup notification, enter pickup instructions for customers.

  6. Click Save.

Add accordions with shortcodes

Accordions are collapsible tabs that reveal more text when an accordion heading is clicked. They're great for additional product details.

Create accordions with our "shortcodes", which are small blocks of HTML pasted directly into the page text editor in your Shopify admin.

Follow the steps below to use our shortcode generator with easy-to-use fields that automatically creates a shortcode without needing to edit the HTML yourself.

Steps

STEPS

  1. Open our shortcode generator in a new window or tab.

  2. Enter text in the Accordion Title field for the clickable heading.

    We recommend a short 1-3 word heading that describes the content of the accordion. Example: "Product materials" or "Shipping policy".

  3. Enter a few sentences in the Accordion Description field for the text that's revealed when the accordion title is clicked.

  4. Click (+) Add New Item to create additional accordion tabs.

    Repeat steps 1 - 3 until you have created all the accordion tabs you need.

  5. Click Generate Code. You code will appear in the Results box.

  6. Select and copy the entire code in the Results box.

  7. In your Shopify admin, add or open an existing page in your Pages, Blog posts, or Products.

    We recommend making a backup of your page content or creating a new page with the same content for testing in case any mistakes occur.

  8. Click the "Show HTML" (</>) button on the text editor toolbar.

  9. Paste your shortcode into the editor.

  10. Click Save.

  1. Finally, click View page to see how your accordions look on your page.

Accordion shortcodes are also supported on Pages, About pages, and Blog posts.