Solved

How to center "You may also like" text in Dawn 11.0 Theme

JenniferF
Excursionist
40 1 7

Screenshot 2023-08-16 12.37.13 PM.pngScreenshot 2023-08-16 12.35.19 PM.png

 

I need help with a code to center the "You may also like text" as well as the "Browse Other Collections" text. I've tried various other codes I found online but nothing is working.

Jennifer F
Accepted Solutions (2)

Made4uo-Ribe
Shopify Partner
5515 1326 1634

This is an accepted solution.

Thank you for the information.

Try this one. 

  • From your Shopify admin dashboard, click on "Online Store" and then "Themes".
  • Find the theme that you want to edit and click on "Actions" and then "Edit code".
  • In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

 

product-recommendations.related-products.page-width.section-template--20291029729561__related-products-padding.isolate.scroll-trigger.animate--slide-in.product-recommendations--loaded h2 {
    text-align: center;
}
.title-wrapper-with-link.title-wrapper--self-padded-mobile.title-wrapper--no-top-margin {
    justify-content: center;
}

 

  • And Save.
  • Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


View solution in original post

Made4uo-Ribe
Shopify Partner
5515 1326 1634

This is an accepted solution.

Oh, Sorry. I didnt read it right. Check this one. 

 

h2.related-products__heading.inline-richtext.h1 {
    text-align: center;
}
.title-wrapper-with-link {
    justify-content: center;
}

 

And Save. 

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


View solution in original post

Replies 15 (15)

dreamtechzone_5
Shopify Partner
168 1 20

You can do this without coding. It can be done by following.

Screenshot 2023-08-17 001509.pngScreenshot 2023-08-17 001542.pngScreenshot 2023-08-17 001640.pngScreenshot 2023-08-17 001614.png

JenniferF
Excursionist
40 1 7

I tried it and it's not working

Jennifer F
dreamtechzone_5
Shopify Partner
168 1 20

Have you put it in the center?

 

Screenshot 2023-08-17 003405.png

JenniferF
Excursionist
40 1 7

there is no option for "Rich text"

Jennifer F

Made4uo-Ribe
Shopify Partner
5515 1326 1634

Hi @JenniferF 

Would you mind to share your Store URL website? with password if its protected. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


Made4uo-Ribe
Shopify Partner
5515 1326 1634

This is an accepted solution.

Thank you for the information.

Try this one. 

  • From your Shopify admin dashboard, click on "Online Store" and then "Themes".
  • Find the theme that you want to edit and click on "Actions" and then "Edit code".
  • In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

 

product-recommendations.related-products.page-width.section-template--20291029729561__related-products-padding.isolate.scroll-trigger.animate--slide-in.product-recommendations--loaded h2 {
    text-align: center;
}
.title-wrapper-with-link.title-wrapper--self-padded-mobile.title-wrapper--no-top-margin {
    justify-content: center;
}

 

  • And Save.
  • Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


JenniferF
Excursionist
40 1 7

It worked, thank you so much!!! 🙂

Jennifer F
JenniferF
Excursionist
40 1 7

Hello. You helped me with this a while back. I'm in the process of updating my theme and adding codes back into it before publishing. I tried adding the code above and it's no longer centering the text. Can you please help me with another code?

Jennifer F
Made4uo-Ribe
Shopify Partner
5515 1326 1634

Did you make another theme? or you just updated the version? Would you mind to share the updated version of your store? Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


JenniferF
Excursionist
40 1 7

It's an updated version. I just published it. URL is jennszencreations.com

Jennifer F
Made4uo-Ribe
Shopify Partner
5515 1326 1634

Oh, Okay check this code. Same Instruction. 

 

product-recommendations.related-products.page-width.section-template--22358788669721__related-products-padding .card__information * {
    text-align: center;
}

.collection-list-wrapper.page-width.isolate.no-mobile-link.section-template--22358788473113__85b2f02b-3777-4f02-b189-7dea4bda9150-padding .card__information {
     text-align: center;
}

 

And Save. 

Result:

Made4uoRibe_0-1710776633418.png

 

Made4uoRibe_1-1710776664089.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


JenniferF
Excursionist
40 1 7

Hello. I don't need the product info centered. I need the text "You may also like" and "Browse Other Collections" centered.

Jennifer F
Made4uo-Ribe
Shopify Partner
5515 1326 1634

This is an accepted solution.

Oh, Sorry. I didnt read it right. Check this one. 

 

h2.related-products__heading.inline-richtext.h1 {
    text-align: center;
}
.title-wrapper-with-link {
    justify-content: center;
}

 

And Save. 

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

Please don't forget to 

Like

 and 

Mark Solution 

to the post that helped you. Thanks!
Sip, savor, and support – your

Coffee Tip

 helps us keep coding magic.❤️❤️❤️
Need a knowledgeable developer? Come and visit us at

Made4uo.com


JenniferF
Excursionist
40 1 7

No worries. It worked, thank you so much! I appreciate your help! 🙏🏽💜

Jennifer F
JenniferF
Excursionist
40 1 7

I just realized the "Browse Other Collections" title is not centered anymore either.

Jennifer F