Dawn Theme | How To Move Collection Description To Bottom Of Page

Hello!

Does anyone know how to move the collection description to the bottom of the collection page on Dawn Theme? There is an option to hide it entirely but I would like to keep it for SEO purposes. However, the descriptions are fairly long so I would like to keep the collection title as it is, but would like to move only the description at the bottom of the page. Alternatively, I can accept to make a toggle with “view more”/ “view less” button as a solution but I cannot find information to organize the description as I want. I just do not want the first thing to show to our visitors to be like a word document.

Dear Shopify agents & partners: I will not accept “Hire an Expert” as a solution.

Thank you for reading and I am looking forward to hearing from someone who has a solution for this:)

1 Like

@Logius

Please share your site URL,
I will check out the issue and provide you a solution here.

@Logius Can you please send me store url?

Hey @Logius
I need the exact same thing you do. If you find a solution, can you share it here?
Thanks and have a nice day!

@AirdropSEO @infoatcodelab7 - this needs code editing and then description can be taken down

Yes i figured this out.

Go into collection.json

Youll see at the bottom is says order.

Change the order to be product grid first like so:

{
“sections”: {
“banner”: {
“type”: “main-collection-banner”,
“settings”: {
}
},
“product-grid”: {
“type”: “main-collection-product-grid”,
“settings”: {
}
}
},
“order”: [
“product-grid”,
“banner”
]
}

2 Likes

@fastandsticky

Thanks for replying!

I’ve tried it but this way, the page title moved to the bottom too. How can I move only the description?

@DelightCart

8lackclothing.com but I am inquiring about a theme that is not published yet.

Thanks!

I had the same problem but I found the solution by myself

In “Main-Collection-banner.liquid”, at line 6 you must have :

"


{{- collection.title | escape -}}

"
  • Select the text and cut it

  • Then you go to “main-collection-product-grid.liquid” and paste the code at line 35 just below :

@AirdropSEO

Thanks for replying!

I’ve tried your method but it just switched the order of page title and the page description.

Did you first modify the collection.json as fastandsticky said?

I changed the order following what fastandsticky said and then I applied what I said and it worked.

  1. First you change the order in “collection.json”

and then you paste this :

{{- collection.title | escape -}}

"

in main-collection-product-grid.liquid

Capture d’écran 2022-02-23 à 18.21.51.png

1 Like

@AirdropSEO

Amazing! It worked too!

@AirdropSEO @fastandsticky

Hello, I just realized that the text moved to the top but the page title is duplicated and now it appears both at the top and the bottom after trying your method. I don’t need this to appear twice. How can I keep the one on the top while deleting the one at the bottom? Any advice?

@Logius

It’s normal, you have to delete this part of the code :

"


{{- collection.title | escape -}}

"

in “Main-Collection-banner.liquid”, at line 6

1 Like

Hi,

I have same issue. Want to have Collection banner title on top, and Collection describtion below Product grid.

  1. I changed the order in “collection.json”

  2. In “Main-Collection-banner.liquid” I can not find what is specifed up:

Also in main-collection-product-grid.liquid can not find where to paste this code:

Thank you in advance for your help.

I’ve followed all of these steps and hit publish but now none of my collection Titles are present. Any insight? Here’s the link to a collection - https://rolflexrecovery.com/collections/deep-tissue-massage-roller

How to move Collection Description to the bottom and keep the H1 at the top ?

→ Here is the easiest way :

Go to → Personalise

  • Select : Default collection.

Now, you are on the personalisation page, where you can change colours, sections, etc.

  • Add under your Products Grid a Custom Section called : Custom Liquid
  • Write in this Custom Liquid : {{collection.description}}

Now, you have your Collection description at the top and at the bottom of your products.

Now, click on Collection Banner and Uncheck " Show Collection description ".

Hope it will help :blush:

1 Like

It‘s shown on full screen. How can I solve it?

You just have to put a div around the product description, like this :

{{collection.description}}

------>

{{collection.description}}

Thank you so much. It solved! This is really the easiest way.

1 Like