How to add a collapsible option in the Description section of a product page

[Ajing]

Hi There,

I’d like to add a collapsible frame to my product page that collapses my detailed description.

for example

[AAAA ] （here is the display title）

{{{aaaa}}} （this is the folded content）

Here is my website: https://www.lilygo.cc/products/t-beam-v1-1-esp32-lora-module （password: lilygo)

Any help would be greatly appreciated.

Thank you in advance

[Dan-From-Ryviu]

You can use a tab app to do it

https://apps.shopify.com/search?q=tab

[AvadaCommerce]

Hi @Ajing ,

You can edit the Collapsible Row in Online Store > Theme > Customize.

If the content of the collapsible row is the same for all product pages, simply click on Add block > Collapsible row and insert the content in Row content.

Otherwise, in order to add different content for each product, you first need to create metafield and then connect it with your theme setting to display metafield on your online store:

• Create Metafield by going to Setting > Metafields > Products > Add definition > fill out the required info.
• Go to Products > Within each product page, scroll down to the bottom and you’ll see the metafield you’ve created before, then fill out the specific content for each.
• Navigate to Online Store > Theme > Customize
• Select Products then Default Product from the page selector at the top
• Within the sidebar menu, click on the click on Add block > Collapsible row > click on the Insert Dynamic Source as the photo attached below > Select the associated metafiled

I hope it helps.

[Ajing]

Hi BanBim,

Thank you, I will try.

[Ajing]

Hi dear,

Thank you so much!

This suggestion of yours is also very helpful, I have some content that really needs to do this.

But I have different “description” content for each product, and there is a lot of text, so I have to find a way to fold them, I don’t know much about code, so maybe I can try it with a plugin

Thank you for your help.

[Ajing]

One more question, how do I add different subtitles to the title of each product?

Like this

It’s too cumbersome to set up a template for each product, any good suggestions?

Thank you so much.

[AvadaCommerce]

Hi @Ajing ,

• As I mentioned in my last reply, the first way to add different collapsible content for each product is to create metafield for products.

And then fill in the content for the metafield on each product page.

Finally, in theme customization, add a collapsible tab that is linked with the created metafield

• If you don’t want to edit the metafield for each product, you can link the tab content with an existing page

• Regarding your question about adding different subtitles to each product, you’ll need to create a metafiled for product subtitles and then go to theme customize to add a text blocked linked to the product subtitle.

Good luck

[Ajing]

Hi dear,

Yes, I got it, thank you so much.

[AnnaRocks]

I’m replying here because my objective is along these same lines. I’ve followed the above instructions, but get stuck at adding my metafield to the Collapsible Row.

It gives me the option to insert Nutrition, my Multi-line text metafield but doesn’t show my other existing metafield, Nutrition-Info, which is a file (it displays an image of the nutrition label.)

Any suggestions on how to insert the image Metafield?