How To Center Title, Vendor, Price, Size, Quantity, Cart and Description Text on Product Page (Dawn)

Solved

How To Center Title, Vendor, Price, Size, Quantity, Cart and Description Text on Product Page (Dawn)

WholesomeBoy
Explorer
99 1 18

I want to CENTER ALIGN all text and info/buttons on the product pages. It is currently all left aligned, which comes by default. I am currently using the Dawn 8.0.0 theme.

 

Someone please help. It's driving me crazy.

 

Thanks!

Thanks,
Justin
Accepted Solution (1)

PageFly-Richard
Shopify Partner
4400 1006 1657

This is an accepted solution.

Hi @WholesomeBoy ,

 

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/section-main-product.css->paste below code at the bottom of the file:

.product__info-container,
.product__info-container .product__text ,
.product__info-container .product__title,
.product__info-container .price {
    text-align: center !important;
}
.product-form__input,
.product-form__input .quantity,
.product-form__buttons,
.share-button__button {
    margin: 0 auto !important;
}
.accordion .summary__title {
    justify-content: center !important;
}

I hope it would help you
Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

Replies 5 (5)

Moeed
Shopify Partner
4361 1123 1380

Hey @WholesomeBoy 
Share your Store URL and Password if enabled

Need a Shopify Specialist? Chat on WhatsApp


- Custom Design | Advanced Coding | Store Modifications
- Your Coffee Tip and my code, A perfect blend. ❤️
WholesomeBoy
Explorer
99 1 18

Hey Moeed,

 

Version 8.0 (the one I’m currently working on) is not live on my site, because I’m still building it. I’m currently using the older version. So, It won’t be exactly the same, because I’ve successfully aligned some elements on my current site on my product page, but not all.

 

Website: https://www.wholesomeboy.co/

Thanks,
Justin

PageFly-Richard
Shopify Partner
4400 1006 1657

This is an accepted solution.

Hi @WholesomeBoy ,

 

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/section-main-product.css->paste below code at the bottom of the file:

.product__info-container,
.product__info-container .product__text ,
.product__info-container .product__title,
.product__info-container .price {
    text-align: center !important;
}
.product-form__input,
.product-form__input .quantity,
.product-form__buttons,
.share-button__button {
    margin: 0 auto !important;
}
.accordion .summary__title {
    justify-content: center !important;
}

I hope it would help you
Best regards,

Richard | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

WholesomeBoy
Explorer
99 1 18

Thank you, Richard! You're awesome!

Thanks,
Justin
BeyzaNisa
Visitor
3 0 0

Hi Richard,

I just tried out your code and it worked great. With the new dawn update there is just one issue: The color swatch and share button are not centered yet (see picture). Can you help me with the correct code to fix this?

 

Bildschirmfoto 2024-07-09 um 23.55.38.png

Thanks, 
Nisa