Align text on product page

[changjojo]

How can i align the text (title, price, variant, product description and collapsable text) to the left and not center?

[DrewOswald]

1. In the "Product information" section look for the "Product description" block then the "Alignment" setting.

2. Switch the alignment setting from center to left by selecting the option on the left.

 

[changjojo]

I dont have this option on my product information page. Where else can i look for it?

[DrewOswald]

What theme are you using?

[goldi07 · Accepted solution]

Hello @changjojo To left-align the text elements (title, price, variant selectors, product description, collapsible content, etc.) on your Shopify product page, you’ll need to modify the CSS in your theme.

Here's how to do it:

Option 1: Use Shopify Theme Editor (for minor adjustments)
If your theme allows custom CSS in the theme editor:

1. Go to Online Store > Themes.

2. Click Customize on your active theme.

3. In the left panel, look for Theme settings > Custom CSS or Additional CSS.

4. Paste the following CSS:

.product__info-wrapper,
.product__title,
.product__price,
.product__description,
.product-form,
.product__accordion,
.product__media-wrapper {
    text-align: left !important;
    align-items: flex-start !important;
}

Option 2: Edit the CSS in theme files (more control)
1. Go to Online Store > Themes.

2. Click Actions > Edit code.

3. Open your CSS or SCSS file (commonly found under Assets and named something like base.css, theme.css, styles.css, or main.css).

4. Scroll to the bottom and add:

/* Left-align product text elements */
.product__info-wrapper,
.product__title,
.product__price,
.product__description,
.product-form,
.product__accordion {
    text-align: left !important;
    align-items: flex-start !important;
}

You may need to inspect the exact class names using your browser's Developer Tools (F12) if your theme uses different ones.

Thank you 😊