Main product section

The main product section is one of the most unique sections to the Whisk theme. On large desktop screens, the layout is 3 columns, then it collapses to 2 columns on smaller screens, and is only 1 column on mobile. In order to make this work seamlessly and keep the content in a good order for shoppers, the blocks on this section work a little differently than elsewhere. Let's start with going over the blocks in this section.

Blocks

Product title

Font style

Choose the font that you want the product title to display in.

Description

This is the product description that is entered for each product in the Shopify admin. There are no customizable settings for this block.

You can choose which social media share buttons you want to show by checking the box next to that platform option. The options are:

Facebook
Twitter
LinkedIn
Pinterest

There is also a button to copy the page url link to the computer's clipboard. This button will always display if this block is selected.

Price

Displays the product price. This price will automatically update when different variants with different prices are selected, and will show an original price crossed out next to the current selling price if the product is on sale. If your store in configured to have taxes included in the price of items, then a note will display here that reads, "Tax included." If you have a Shipping policy filled out for your store in the Shopify admin, a message will also show underneath the price that says "Shipping calculated at checkout" and it will be a link to your full Shipping policy. Example:

Show shop pay installment terms

You can choose to show Shop pay installment terms underneath the price if Shop pay is enabled for your store and by checking this box.

Vendor

No customizable settings here. It will just display the product vendor name.

Product subtitle

Displays the product subtitle for the product. For more information, see the documentation for Product subtitle.

Custom liquid

Add your own Liquid or HTML code here. See the Custom liquid documentation for more details.

Divider

This block adds a visual divider line with space above and below it. This is useful if you want help differentiating many blocks of content. Make sure your divider line looks good on all screen sizes as the layout shifts from 3, to 2, to 1 column.

Details tab

Details tabs are the place to add custom content for your products, like ingredients, nutrition facts, sizing information, etc. They support images, text, and even page content. They can do so much, they deserved their own documentation. Learn more about how to configure Details tabs.

Details tabs will always show after every other block in this section, even if they are organized in the Shopify theme editor to be above them. This is intentional in order to keep the product form and shopping buttons higher up on the page on smaller screens when the layout is 1 or 2 columns. The detail tabs themselves will display in the order they are in the theme editor.

Apps

You can add apps through this block. On the Whisk demo stores, we use this to show the star ratings for Shopify's Product Reviews app.

Settings

Add space above or below

Depending on the sections that are above or below this section, you may want to add some extra space for a more pleasing layout.

Show breadcrumbs

Check this box to show breadcrumb links above the product information. The breadcrumbs will show the collection page that the visitor was on before they arrived on the product page if they came from a collection page. If not, they'll just see a link back to "Home".

Details tabs style

You can choose either to show the details tabs as Accordions or Buttons. Here's an example of each:

Accordions

Accordions are all collapsed by default.

Buttons

The first tab is open by default.

Media settings

If you have more than one image on the product, the images will display in a slideshow media gallery. You can give visitors two choices for how to navigate through the images on desktop and mobile.

Center media on large desktop screens

Check this box to show all of the main product information across three columns on large desktop screens.

Uncheck this box to keep the layout at 2 columns on large desktop screens.

Gallery layout options

Thumbnails

Arrows

Enable video looping

Check this box if you want videos to loop over and over when they are played.

Enable sticky media on desktop

Check this box if you want the images to stay at the top of the section as the page scrolls through the other content in columns on the section.

Shopping options

Show product quick add on page scroll

When this checkbox is selected, a header with the product name, dropdown options (if any), and button to add to cart will show once the visitor scrolls past this section.

Show pickup options if available

If you have Local Pickup enabled on your store, check this box to show those options here to entice visitors who want local pickup to purchase. This information will display underneath the product form with a link to see details.

Show dynamic checkout buttons

Check this box to show any dynamic checkout options that you have configured for Payments. If you decide not to show them here, know that they will still be available options during checkout.