Centre Product Title on Product Page for Impulse Theme

Store Design

Topic summary

Main issue: The product title on the Impulse theme was not centered on desktop, while price/ratings/buttons were centered. A screenshot was provided to illustrate the misalignment.

Initial attempts: Contributors suggested adding CSS targeting .product__title with text-align: center; in theme.liquid (before ) or by appending similar CSS. The store owner tried adding it in theme.css.liquid, but it did not affect desktop (mobile was already centered).

Working fix: Adding the following CSS to Assets > theme.css resolved the issue on desktop:

  • .product-single__title { text-align: center; }

Why it worked: The correct selector for the Impulse product title on desktop is .product-single__title, not .product__title, and placing it in theme.css ensures it’s applied globally.

Outcome: Confirmed resolved. No further changes or outstanding questions noted; assistance offered for any future needs.

Summarized with AI on December 28. AI used: gpt-5.
1

Hey there!

I am needing some help to centre the product title on the desktop view on the Impulse theme. My price, ratings and buttons are centred, but my product title isn’t. I have tried to find other codes in the forum but have come up short. Any help you can offer would be very much appreciated!

Screenshot 2024-05-31 at 5.27.55 PM.png
Screenshot 2024-05-31 at 5.27.55 PM.png2000×1119 366 KB

1 Like
2

Hello @Sydonie_Baldiss

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.product__title { text-align: center; }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

3

@niraj_patel
So, GO to online store → theme–> edit code
In the left sidebar, locate the Assets–> theme.liquid
Scroll to the bottom of the file add the following CSS code.

.product__title { text-align: center; }

I think this will solve your problem, if yes, please mark the job as complete

4

This won’t work sorry! I have pasted into theme.css.liquid and it won’t centre on desktop view. It is centred on mobile view, but not on desktop.

Do you have any other suggestions or work arounds?

5

Hello @Sydonie_Baldiss ,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > theme.css and paste this at the bottom of the file:
.product-single__title {
text-align: center;
}
6

This worked! Thank you so much :slightly_smiling_face:

1 Like
7

Hi @Sydonie_Baldiss

Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance.
If helpful then please Like and Accept Solution.