Skip to main content

: Product Page Content Blocks

  • Updated

How to find these settings...

  1. Online Store
  2. Customize (Theme Editor)
  3. Top, middle dropdown
  4. Products
  5. Default product
  6. Left column, access content blocks using black arrow next 'Product page'

Recommended reading

In this section...

 

Vendor

The vendor title will display.  The title will be linked to the default collection page or to a collection created using the vendor name

 

Text size

Set the vendor size with the slider. 12px is the minimum, and it steps up by 6 to a maximum of 96px

 

Title

Use h1 tag

For SEO purposes, set the 'Heading' to use an h1 tag. NOTE: This should only be used once per page

 

Heading outline

Text defaults to the solid state, but can be customized with 3 outline thicknesses

 

Heading size

Set the heading size with the slider. 18px is the minimum, and it steps up by 6 to a maximum of 96px

 

SKU and barcode

Show SKU

If a product or variant has an associated SKU, it will display

 

Show barcode

If a product or variant has an associated barcode, it will display

 

Show label

Display the default text labels, ie 'SKU: 1234'

 

Product rating

Display

Display the product rating based on reviews collected from review apps.  There are 3 options available:

  • Stars and text
  • Stars
  • Text

NOTE: Requires a product review app, and metafield definitions for 'reviews.rating_count' and 'reviews.rating'.

 

Price

Display the price, plus compare at price, per variant

 

Price size

Set the price size with the slider. 18px is the minimum, and it steps up by 6 to a maximum of 96px

 

Disable tax message

By default, if the store is set to include taxes in pricing, a message with display

 

Product description

This will add the product description to the column

 

Custom description

A text block for basic formatting including bold, italic, formatted lists & linked text

 

SLIDE

 

Enable slide

Condense the content down to a clickable slide

 

Slide heading

Provide a title to the closed slide

 

ShopPay installments

Shop Pay offers customers the option to pay in full at checkout, or to split their purchase into 4 equal, interest-free installment payments for orders between 50 USD and 1000 USD.  Learn More

 

Variant picker

Show single option variant

By default, if there is only 1 option to a variant, the option will not display. Since there is no choice for the customer to make, this option is removed. Check the box to display the single option dropdown.

 

Variant options

Choose how to display various variants:

  • Buttons: Variants will be displayed as block buttons or swatches
  • Dropdowns: Variant will be displayed in a dropdown

 

Buttons

Color swatches are dependent on the Product Taxonomy set up in the product admin.  Choose how the color will be displayed:

  • Swatches: 'Swatches' can be customized with Category Metafields and the Search & Discovery app
  • Variant image: Display the variant image associated with the variant. If an image is not available, it will default to the color
  • Magnified variant image: Display the zoomed in variant image associated with the variant. If an image is not available, it will default to the color

 

Enable rounded buttons

Buttons can be sharp edged squares or rectangles, or rounded circles or ovals

 

Quantity

Make the quantity field available to allow the customer to add more than 1 item to the cart at a time

 

Buy Buttons

Enable cart redirection

Automatically sends users to the cart page after adding a product

 

Show dynamic checkout button

Dynamic checkout buttons allow customers to skip the cart and go directly to the checkout using a variety of payment options

 

Show recipient form for gift card products

When enabled, gift card products can optionally be sent to a recipient with a personal message

 

Enable sticky options

When enabled, adds a fixed content bar displayed at the bottom of the screen. This bar will display:

  • Title
  • Breadcrumbs
  • Variants
  • Quantity
  • Add to cart button
  • Dynamic checkout button
  • Cart dropdown similar to the header

 

Sticky cart icon

The icon in the add to cart button can be a cart or a bag

 

Show lock icon on sticky cart checkout button

After a product is added to the cart, the checkout button can have a lock to promote security to your customers

 

Store pickup

Displays option for customers to pick up their online orders at your retail store, curbside, or any location that you choose. Learn more

 

Enable Geolocation

Offer users the option to share their location to display distances to stores, when the customer clicks on the 'View store information' text link.  The user will be prompted by the browser to allow the use of their location

 

Complementary products

Complementary products are set in the Shopify Search & Discovery app

 

Number of products

Select the number of products to display. 1 is the minimum, and it steps up by 1 to a maximum of 10

 

SLIDE

 

Enable slide

Condense the content down to a clickable slide

 

Slide heading

Provide a title to the closed slide

 

Social sharing buttons

Customers can be provided options to share to their social media channels. Social options are set in Settings > Social Media

 

Button

Text

Add text to your button

 

Link

Use the link picker to assign a link to the button

 

Style

There are 2 options for the button based on the settings from Theme Settings > Buttons:

  • Primary
  • Secondary

 

Text

Text

A text block for basic formatting including bold, italic, formatted lists & linked text

 

Text alignment

Text can be aligned to the left, right or centered to the container

 

SLIDE

 

Enable slide

Condense the content down to a clickable slide

 

Slide heading

Provide a title to the closed slide

 

Page

Use the page picker to assign a page and display the content

 

SLIDE

 

Enable slide

Condense the content down to a clickable slide

 

Slide heading

Provide a title to the closed slide

 

Line item properties

Line item properties are used to collect customization information for an item added to the cart

 

CHECKBOX

 

Labels

Add an option for users to agree to

 

RADIO BUTTONS

 

Labels

Add a label above the field. This text also acts as the label for the text in the email you receive. If left blank, the field with be removed and the 'Radio options' text will be used as the label in the email

 

Options

Separate options with a comma to create multiple radio buttons. Example: Option 1, Option 2, Option 3. If left blank, the field & label with be removed

 

TEXT

 

Labels

Add a label above the text input. This text also acts as the label for the text in the email you receive. If left blank, the field with be removed and the 'Text placeholder' text will be used as the label in the email

 

Placeholder

The initial text the users sees within the input

 

SELECT DROPDOWN

 

Labels

Add a label above the field. This text also acts as the label for the text in the email you receive. If left blank, the field with be removed and the 'Placeholder' text will be used as the label in the email

 

Placeholder

The initial text the users sees within the field.

 

Options

Separate options with a comma to create dropdown selections. Example: Option 1, Option 2, Option 3. If left blank, the field & label with be removed

 

SLIDE

 

Enable slide

Condense the content down to a clickable slide

 

Slide heading

Provide a title to the closed slide

 

Image

Use the image picker to assign an image

 

Insta filter

App like filters can be applied to your images

 

Image alignment

Align the image to left, center or right of the column

 

Link

Use the link picker to assign a link

 

Liquid

Liquid

Add app snippets or other Liquid code to create advanced customizations.

The block will come preloaded with Liquid that will display ALL available variant metafields. Variant metafields are added in the admin, and can be displayed using Liquid. Learn more

 

Enable reload on variant change

Enable this option to allow the block content to update when a new variant is selected. This will ensure the metafield data is displayed for each variant.

 

SLIDE

 

Enable slide

Condense the content down to a clickable slide

 

Slide heading

Provide a title to the closed slide

 

Divider

Add padding and a dividing line

 

* NOTE: May not be available on all sections, blocks or templates