How To Add "Read More" Button To Collection Description In The Impact Theme

[mcrofbre1010]

Hello,

I would like to add "Read More" to the description of the collection. 

For example: https://www.mountainwarehouse.com/travel/accessories/microfibre-towels/

Is there anyone who can help me with this?

i am on impact theme

[mcrofbre1010]

It is the "Read More" button circled in blue

[mdi47]

You need to create a new section, so you can dynamically add it to the collection page. Just create a file named "collection-info.liquid" in your section folder.

<div class="details-container">
  {% if collection.description != blank %}
    <details>
      <summary>{{ section.settings.readmore }}</summary>
      <p>
        {{ collection.description }}
      </p>
    </details>
  {% endif %}
</div>

{% schema %}
{
  "name": "Collection Info",
  "settings": [
    {
      "type": "text",
      "id": "readmore",
      "label": "Button Text",
      "default": "Read More"
    }
  ],
  "presets": [
    {
      "name": "Collection Info",
      "category": "Collection Info"
    }
  ]
}
{% endschema %}

{% stylesheet %}
  .details-container {
    text-align: center;
  }
{% endstylesheet %}

If you need additional help, let me know

[mcrofbre1010]

and how would i go about adding the following "info icon" in the following location.

[mdi47]

It depends: What should happen after you click the info icon? Should it behave the same like the Read More?

[mcrofbre1010]

i want it to behave exactly like the website, basically further information on the collection for SEO purposes.