Align Product Title and Vendor Name to Left & Adjust Font Sizes

LEEDIA
Excursionist
25 0 6

I currently have a few changes on my catalog and product page I’d like to make, which I hope aren’t too complicated.

 

On mobile view I managed to align the product title and price to the left but not the vendor name (which I use to show color options), but in desktop view the product title and vendor name are still centered.

 

I would also like to adjust each of the font sizes (product title, vendor name, and price) separately for both mobile and desktop since the title is too big on mobile and the vendor name is small on both. 

Hope this isn’t too much to ask for. I appreciate any help 🙂


URL:  https://leediastore.com

Password: yaurow 

IMG_7635.jpeg

Replies 2 (2)

Beae_Anthony
Shopify Partner
436 167 175

Hi @LEEDIA ,

This is Anthony from Beae Landing Page Builder, and I’m happy to assist you today.

 

While I acknowledge that this issue falls short of the desired outcome, I have an idea that I believe might be of help:

1. Go to Online Store -> Theme -> Edit code
2. Open your theme.liquid file
3. Paste below code before </body>:

<style>
@media only screen and (max-width: 747px){
    .card__heading {
        font-size: 14px;
    }
    .card-information>.price {
    text-align: left !important;
}

}
.card-information>.price {
    text-align: center;
}
</style>

Beae_Anthony_0-1696158134383.pngBeae_Anthony_1-1696158144021.png

 

Best regards,

Anthony

Beae - The NextGen Page Builder


- Was my answer helpful? Please hit Like or Mark it as solution!
- Get in touch with us: App Store | Blog
LEEDIA
Excursionist
25 0 6

Using some of the code you provided I managed to get everything aligned to the left on mobile, but on desktop the product title is still in the center. Any way to align it to the left there too? Thanks