Debut theme - product title on 'collection page' won't center

Solved
Tourist
5 1 1

Hello.

 

I've tried everything this thread has recommended but didn't work.

https://community.shopify.com/c/Shopify-Design/Center-Product-Title-Price-Debut-Theme/td-p/426224?ad...

 

My case was the opposite to the poster. I got the price to center but the title won't go to center.

Anyone have the same problem? How do you fix it?

 

Thank you!

0 Likes

Success.

Tourist
5 1 1

I got the issue fixed now. Yay!

 

For anyone who has the same problem, try this

 

In your: theme.scss.liquid

 

Ctrl+F for ".product-card"

You'll find>>

.product-card {
position: relative;

 

Add this at the bottom.:

text-align: center;

 

 

On my sheet it's on line #6500

 

Good luck guys!

1 Like
Shopify Staff
Shopify Staff
335 31 79

Hey, @PaewArun!

 

First of all, I'd like to say that those bracelets are beautiful! Second of all, I'm glad to see that you are able to figure out how to centre your product titles! Thank you for also sharing the solution here.

 

When editing the theme code, I always strongly recommend duplicating your theme before making changes to your code, to ensure that your customers aren’t affected if you see any unintended results! It is especially important to do this step if you are making changes to your theme.scss.liquid file, since you cannot roll back to an older version after changes are made. 

 

Thank you again for sharing and contributing to our community! Best of luck with your business.

 

Cheers!

May | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
Excursionist
75 1 1

It worked! Thank you

0 Likes
Excursionist
75 1 1

How can I center the price on the product/collection page as well?


@gofuturefresh wrote:

It worked! Thank you


 

0 Likes
Shopify Staff
Shopify Staff
335 31 79

Hi, @gofuturefresh!

 

You can add the following code at the bottom of your 'theme.scss.liquid' file to center your product prices:

 

.product-card .price {
    justify-content: center !important;
}

Then, click 'Save' and your prices should be centered! Let me know if this helps.

 

Cheers! 

May | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

1 Like
Excursionist
75 1 1

Thanks

0 Likes
New Member
9 0 0

hi there,

i'm using the masonry theme and want to limit the product title on the collections page to just 1 line - the width of the image. 

can you pls guide me to do that?

thabnks

0 Likes
Highlighted
New Member
1 0 0

Hi May, I was hoping you could please also help me on this.

 

My product title is now centered, but the price text is still aligned to the left. I've tried all the articles I've found, and nothing seems to be working on my end! 

 

Please help, would greatly appreciate itScreen Shot 2019-12-16 at 12.46.40 AM.png

0 Likes
New Member
1 0 0

@catalinak315  Follow the advice given above by @May  It works

0 Likes