Debut Theme - Resize Product Titles and centre price and sale price (home and collection pages only)

Solved
Excursionist
31 0 9

Hi all,

I am trying to decrease the size of the product title, price and reviews on both my home page and collection pages.

I was able to centre the product title, but now I am struggling to centre the price and any reviews part also.

Attached picture to show

Screen Shot 2020-04-30 at 4.16.54 pm.png

Any help on what file and the code would be greatly appreciated.

 

Using debut theme - https://positanoblue.com

 

Many thanks

1 Like
Highlighted
Shopify Partner
8463 1131 2967

Hello, @positanoblue 

Thanks for post.

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste bellow code at the bottom of the file.

.price {
align-items: center;
}
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
2 Likes
Highlighted
Excursionist
31 0 9

Thank you @KetanKumar

 

That did partially work. It worked for the home and collection pages. However it also edited the product page and now the price on that is not left alligned and looks out of place. How can I fix this? Also any idea on the font size for both home and collection pages only.

 

Screen Shot 2020-04-30 at 4.32.59 pm.png

0 Likes
Highlighted
Shopify Partner
8463 1131 2967

This is an accepted solution.

@positanoblue 

Thanks 

1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste bellow code in the bottom of the file.

.product-single__meta .price {
    align-items: flex-start;
}

.product-card .price--listing {
    font-size: 15px;
}
.product-card__title {
font-size: 18px;
}

change the font size value as you like

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
2 Likes
Highlighted
Excursionist
31 0 9

Thankyou - that has resolved the font size issue.

 

im still struggling with centering the price and review on home and collection pages only.

 

 

0 Likes
Highlighted
Shopify Partner
8463 1131 2967

This is an accepted solution.

@positanoblue 
why remove older CSS?

 

can you please add this 

.product-card .price--listing  {
align-items: center;
}
If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
2 Likes
Highlighted
Excursionist
31 0 9

Ok sorry i didnt realise you wanted me to keep the original CSS. After adding that back in, everything is now working perfectly

 

You are a star!

 

many thanks

0 Likes
Highlighted
Shopify Partner
8463 1131 2967

@positanoblue 

Thanks for it 

If helpful then please Like and Accept Solution.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like
Highlighted
Tourist
6 0 4

Hello, 

I am trying to centre the sale price on my grid. Titles and regular price is centred but not the sale price for some reason. Screenshot below. Also, how can I centre 'sale' in the black bar under the sale price? 

Thanks for your help!

 

 Untitled.png

1 Like
Highlighted
Shopify Partner
8463 1131 2967

Hello, @noora_meh 

Welcome to the Shopify community!
and Thanks for your Good question.

Please share your site URL,
So I will check and provide a solution here.

If helpful then please Like and Accept Solution.
Want to modify or custom changes on store Hire me.
- Feel free to contact me on bamaniyaketan.sky@gmail.com regarding any help
Shopify Expert | Skype : bamaniya.sky
PSD to Shopify | Shopify Design Changes | Shopify Custom Theme Development and Desing | Custom Modifications In to Shopify Theme | SEO & Digital Marketing
1 Like