Solved

Centre Align Product Page Title, selection and buy buttons on Refresh theme

Fardale
Tourist
11 0 3

Hello,

 

Can anyone help me with aligning my title, price, options, add to cart and the buy button  (Desktop shows the buttons to the left) - I am using the Refresh theme 🙂

 

Fardale_1-1678310097674.png

 

 

Accepted Solution (1)

GemPages
Shopify Partner
5625 1261 1244

This is an accepted solution.

Hi @Fardale,

 

Glad to support you today.

 

You can check out my suggestion below to get your concern resolved.

 

1. Go to Edit code on Online Store:

 

GemPages_0-1678331431251.png

 

2. add my code  above the </body> tag on Theme.liquid:

 

<style>

	.product__info-wrapper .product__title, .product__info-wrapper .price {
		text-align: center !important;
	}
	fieldset.product-form__input, .product-form .product-form__buttons {
		margin: 0 auto !important;
		text-align: center !important;
	}
	fieldset.product-form__input .form__label {
		display: block !important;
		width: 100% !important;
	}
</style>

 

Hope you find my answer helpful!

Kind & Best regards,
GemPages Support Team.

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center

View solution in original post

Replies 8 (8)

PageFly-Victor
Shopify Partner
7865 1785 3103

Hi @Fardale ,

Could you please share URL and your store password if it enabled? So that we can help you.
Thank you.

Mubashir_H
Shopify Partner
84 4 13

Hello @Fardale 

 

To center align the product page title, selection, and buy buttons on the Shopify Refresh theme, you can follow these steps:

  1. Go to your Shopify Admin panel and click on "Online Store" from the left-hand menu.

  2. Click on "Themes" and then click on "Customize" next to the Refresh theme.

  3. Click on "Product pages" from the left-hand menu.

  4. Click on "Product page" to expand the section.

  5. Click on "Theme settings".

  6. Scroll down to the "Typography" section and select the "Center" option for the "Product title alignment" and "Button alignment" options.

  7. Save your changes.

This should center align the product page title, selection, and buy buttons on your Shopify Refresh theme. If you encounter any issues, you can contact Shopify support for further assistance.

SEO pro | speed Optimization expert | SEO content writer

Drop me a message on Whatsapp for Free consultation.
Hire me at Shopify Experts Marketplace

GemPages
Shopify Partner
5625 1261 1244

Hi @Fardale,

 

To provide you with the most precise solution in this case, could you please share your page URL ( with pass if your store password is enabled )?

 

Thank you and hope to hear from you.
Best regards,
GemPages Support Team

 

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center

GemPages
Shopify Partner
5625 1261 1244

This is an accepted solution.

Hi @Fardale,

 

Glad to support you today.

 

You can check out my suggestion below to get your concern resolved.

 

1. Go to Edit code on Online Store:

 

GemPages_0-1678331431251.png

 

2. add my code  above the </body> tag on Theme.liquid:

 

<style>

	.product__info-wrapper .product__title, .product__info-wrapper .price {
		text-align: center !important;
	}
	fieldset.product-form__input, .product-form .product-form__buttons {
		margin: 0 auto !important;
		text-align: center !important;
	}
	fieldset.product-form__input .form__label {
		display: block !important;
		width: 100% !important;
	}
</style>

 

Hope you find my answer helpful!

Kind & Best regards,
GemPages Support Team.

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
Fardale
Tourist
11 0 3

@GemPages That has worked 🙂 thank you so much!

GemPages
Shopify Partner
5625 1261 1244

I do appreciate your compliment! 😁

GemPages - Build any high-converting store pages for any business


- If you find my reply helpful, please hit Like and Mark as Solution
- Get connected: App Store | Blog | Community | Help Center
Fardale
Tourist
11 0 3

@GemPages is it possible for the 'dropdown' variation picker to also be aligned in the centre?

Fardale_0-1678397640221.png

 

whboutique
Tourist
7 0 1

Can you please include product quantity for this code as well?  Thank you so much in advance.