If you’re set on doing this, I’d rather you do it well than do it poorly.

This opportunity is more advanced, and it involves editing your theme files. I strongly recommend you work with a developer to implement this or reach out to a task-based service like Hey Carson or Task Husky for their help implementing this.

If you genuinely want to split your collection description and DIY the work, here’s how to do it. (I learned this approach via Soar Digital.) I take no responsibility if implementing the following messes up your theme or causes unintentional consequences.

1. Make a backup of your theme by navigating to: Online Store > Themes > Actions Menu > Duplicate Theme.
   
   Then, once that completes, you’ll have a backup on your Theme.
2. Once duplicated, click “Edit code” for your Theme.
   
   Find the part of your Theme that’s responsible for your collection pages. This varies from Theme to Theme.
   
   You can track this down by going to the collection.liquid file and reading it to identify the sections used there.
3. Navigate to the section responsible for your collection page. Once you’ve found it, you’ll want to go to that section in the editor.
4. While editing the section responsible for your collection page, search for the collection description content snippet. You’re going to delete it and replace it with something else.
   • Search the code (with Ctrl or Command + F) for {{ collection.description }}.
   • Delete that statement.
   • Make sure to leave the enclosing <div> </div> tags. You’ll be adding something new there.
5. On that newly blank line (inside the enclosing <div> </div> tags where {{ collection.description }} used to be), enter the following:
   
   {% assign descriptions = collection.description | split: "<!-- split -->" %}
{% assign upper_desc = descriptions[0] %}
{% assign lower_desc = descriptions[1] %}
{{ upper_desc }}
   
   That gives you the logic for splitting the collection description and outputs the upper description in place of the whole collection description.
6. Search the section you’re editing for the final closing </div> tag of the product grid wrapper.
7. Paste the following line right before that final <div> tag
   
   {{ lower_desc }}
   That will output the lower description below the product grid.
8. Match the styling and presentation of the lower description to the upper description
   
   ‘Wrap’ the second description in the same div lass as the first description.
   
   Copy and paste the classes of the div enclosing {{ upper_desc }} to the div enclosing {{ lower_desc}}.
   
   Ensure both the upper and lower descriptions are wrapped in opening and closing div tags and have the same classes applied in the enclosing div tags.
9. Save your work. Exit out of the theme editor.
10. Go and edit a collection page where you want to implement a split collection description.
11. Enter a collection description into the description field at the top of the page.
12. Click ‘show HTML’ in the description field.
13. Copy and paste <!– split –> into the HTML where you’d like the description to split.
14. Save the page. Go and preview your work on the front end.
    
    It might take a minute or two for the changes to be visible on your store.
15. If everything worked, any text after the split tag (<!– split –>) should show beneath the product grid.
    
    And if it didn’t work or if your store’s collections are now somewhat broken, you have a backup of your Theme that you can restore to.