Skip to product information
1 of 1
Published:2024.10.27

[Dawn] Example of setting up a tab-switching display in the product description section of the product details page on Shopify

[Dawn] Example of setting up a tab-switching display in the product description section of the product details page on Shopify

Applications

  • Product information management and editing

How to implement

  • HTML/CSS
View full details

This is an example of how to set up a product description with tab switching on a Shopify product detail page. After setting up the Javascript and CSS for tab switching in the product information section of the theme editor, set up HTML tags in the "Product Description" section of the product information according to the corresponding format. There are no particular theme restrictions.


Example of setting up a tab-switching display in the product description section of the product details screen


[Setting Method 1] Add the code to "sections/main-product.liquid" in the theme editor


[Setting Method 2] Insert elements containing the necessary tags into the product description field of the product information in HTML editing mode.


After making a purchase (all items are ¥0), you will be able to view the sample code.

If you have already made a purchase, please login here.

Sample Codes

Test Theme :Dawn/Rise 15.2.0

Add the code to "sections/main-product.liquid"

Related Post