Add descreption on Product Page (Dawn Theme)

[adword009]

Hi 

I want to add the description of the product on the product page in a collapsible row, which should be pulled directly from its description box. I have no clue how to do that. Please help me; your assistance will be appreciated.

https://ny6qoht1cxbrrjta-64576913585.shopifypreview.com

 

[devmont-digital · Accepted solution]

Hello @adword009,

To add a product description within collapsible content in the Dawn theme, follow these steps:

1. Navigate to Online Store -> Themes -> Edit Code.
2. Find the file "main-product.liquid" and search for the word "collapsible_tab". Paste the code within this section.

{{ block.settings.custom-liquid }}

 3. Next, search for the schema and locate the closing bracket for "collapsible_tab". Paste the code before this bracket. For your convenience, I have attached a screenshot.

{
  "type": "liquid",
  "id": "custom-liquid",
  "label": "Custom Liquid"
}

1. Then navigate to Online Store -> Themes -> Customize.

2. Go to the default product and select the collapsible tab, then type the code in custom liquid.

{{ product.description }}

[adword009]

Thanks, it worked, but the description coming like this.
I want it to come like SHIPPING & DELIVERY or  RETURN/EXCHANGE.

 

 

 

[devmont-digital]

Basically, if you enter the product description without using a table, it won't cause any issues like that.

[wo]

I prefer to handle it this way.

{% if block.settings.use_description %}
   {{ product.description }}
{% else %}
   {{ block.settings.content }}
   {{ block.settings.page.content }}
{% endif %}

{
   "type": "checkbox",
   "id": "use_description",
   "label": "Use Description",
   "default": false
},

[Anshul_arora]

Hello @adword009 ,

I understand you are looking to provide product description under the collapsible row.

As the shopify admin will add the product description here https://prnt.sc/KLCfz6p_B6lP & it will automatically display as collapsible row in product page.

You can implement this making some small changes in the existing code.

Steps -:

1. First select Edit Code section https://prnt.sc/z9yQDYIW-vm2 and open main-product.liquid file.

2. Next, press CTRL+ F and search the code mentioned in the image https://prnt.sc/D0j9OWNg_PuI

3. Replace the code with this code & save -:

<div class="product__accordion accordion quick-add-hidden" {{ block.shopify_attributes }}>
<details id="Details-{{ block.id }}-{{ section.id }}">
<summary>
<div class="summary__title">
<h2 class="h4 accordion__title">
Description
</h2>
</div>
{% render 'icon-caret' %}
</summary>
<div class="accordion__content rte" id="ProductAccordion-{{ block.id }}-{{ section.id }}">
<div class="product__description rte quick-add-hidden">
{{ product.description }}
</div>
</div>
</details>
</div>

==> https://prnt.sc/cEb_B3asz8QJ

OUTPUT =>

I hope the solution helps you.

Please share if you have any query.

Thank you.