Product template

Ira'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 chips, and Product Reviews.

Using the product template

The Default product template provides the layout and style of your product pages. Use the theme editor to preview, create, and customize product templates with Ira's available sections and theme settings.

If you want to create custom layouts and styles for different product pages, see the next section on how to create and assign multiple product templates.

To preview and edit a template

STEPS
  1. Use the Templates selector in the theme editor to open a template.

  2. Under Preview, click Change to see how your different pages will look with this template.

    If a warning icon (!) appears, you will need to assign the template to your page in the Shopify admin. You must have a purchased copy of the theme to assign templates.

  3. To assign a template, go to the your page in the Shopify admin and use the Theme template menu to select a specific template.

Your browser does not support the video tag.

  1. After editing, remember to Click Save.

Create and assign multiple templates

If you want to customize your product pages with different settings or sections, you can create a new template and then assign your new template to specific product pages in the Shopify admin.

Note: On the trial version, templates cannot be assigned to pages. Templates can be customized and created using the Preview setting in the theme editor, but templates can be assigned in the Shopify admin only after purchasing the theme.

To create and assign a new template

Set up your Product pages

Ira's product pages offer a flexible layout with alternate column and grid 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:

Settings reference

The main Product pages section has the following settings:

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 quantity input

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

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 full width

Check this checkbox to remove the outer margins from this section, making it span the entire width of the screen with no gaps between images.

Layout

Choose a layout: either Column or Grid.

Remember that this affects all of your product pages. We recommend reviewing all product pages to make sure you are happy any layout changes.

Enable video looping

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

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:

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 click-through gallery.

Image aspect ratio

Use this setting to automatically crop images to a specific aspect ratio. Choose from Square (1:1), Landscape (3:2), or Portrait (2:3) aspect ratios.

Choose Natural if you do not want your images to be cropped.

Add a Collection list section

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

Here's how to add a Collection list section:

1

Settings reference

The following settings are available for collection list sections on product pages:

Add collection

Select the collections to display.

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.

Collections per row

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

On mobile, the section will display a maximum of two columns at once.

Image aspect ratio

Use this setting to automatically crop images to a specific aspect ratio. Choose from Square (1:1), Landscape (3:2), or Portrait (2:3) aspect ratios.

Choose Natural if you do not want your images to be cropped.

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:

Settings reference

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

Add image

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

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.

Select or paste a link.

You can add a link to each image and also to a text link for the whole Gallery section.

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.

Add text for customers to click on to take them to your chosen link.

This text will appear after you have added a link.

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.

Images per row

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

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:

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 Product Reviews

Ira 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, Ira will display whether an item is available for pickup, along with the store's location.

Here is how to configure your local pickup settings:

Set up Unit pricing

Ira supports Shopify's Unit pricing feature, which is available only in France and Germany. You can learn more about this feature from Shopify's Unit pricing documentation.

To display a Unit price, check the Show unit price for this variant checkbox in the Pricing section of your desired product in your Shopify admin. Ira will automatically display the unit price. No code snippets are necessary.

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

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

Accordion shortcodes are also supported on [Pages][pages], [About pages][about-page], and [Blog posts][articles].

Last updated