How to move collection description to below the products

Solved

How to move collection description to below the products

wildsouldigital
Tourist
4 0 3

Hello,

 

I need help moving the collection description to below the products. but need the heading to stay above the products. Everything I have read already doesn't seem relevant to this theme/ or doesn't work.

 

We are using the studio theme.

 

Thanks!!

Accepted Solution (1)

made4Uo
Shopify Partner
3845 717 1189

This is an accepted solution.

Hi @wildsouldigital,

 

Just follow the instructions below.

 

We need to hide the description. 

1. In your Admin page, go to Online store > Themes
2. Choose the theme you want to edit then click Actions > Edit code. 
3. Open the base.css under the Asset folder. 
4. Add the code below. 

.collection-hero__inner .collection-hero__description {
display: none;
}

 

We need to open the Theme editor. 

1. In your Admin page, go to Online store > Themes
2. Choose the theme you want to edit then click Customize. 
3. Open the collection page, change the Home page to collection, then default collection. 
4. Add a custom liquid section, then place the code below.

<div class="page-width"><div class="collection-hero__description rte">{{ collection.description }}</div></div>

 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free

View solution in original post

Replies 4 (4)

made4Uo
Shopify Partner
3845 717 1189

This is an accepted solution.

Hi @wildsouldigital,

 

Just follow the instructions below.

 

We need to hide the description. 

1. In your Admin page, go to Online store > Themes
2. Choose the theme you want to edit then click Actions > Edit code. 
3. Open the base.css under the Asset folder. 
4. Add the code below. 

.collection-hero__inner .collection-hero__description {
display: none;
}

 

We need to open the Theme editor. 

1. In your Admin page, go to Online store > Themes
2. Choose the theme you want to edit then click Customize. 
3. Open the collection page, change the Home page to collection, then default collection. 
4. Add a custom liquid section, then place the code below.

<div class="page-width"><div class="collection-hero__description rte">{{ collection.description }}</div></div>

 

If this fixed your issue Likes and Accept as Solution is highly appreciated. Coffee tips fuels my dedication.
Get EXPERIENCED Shopify developers at affordable rates—visit Made4Uo.com for quick quote!
Do not lost your Shopify store! Get FREE trial with ✔️ Rewind Backup: Automatic, reliable, stress-free
wildsouldigital
Tourist
4 0 3

Thank you so much this worked perfectly!

KelleyPSM
Visitor
1 0 0

How would you do this in the Supply Theme?  My Assets folder does not contain a base.css line of code.  Thank you for your help!

Isellfitness
Visitor
3 0 0

Hi

I have empire theme and am trying to do this same thing, move all collection descriptions to below the products in the collection.  When I go to edit code there is no base.css under asset folder, maybe this is because we are now in Shopify 2.0?  Could you revise steps for current shopify?  Thanks.