How to add: "starts at" before price. or show custom price, rather than lowest price.

WoodLeon
Tourist
4 0 1

Hey there! I have multiple variants on my products that range in pricing.  On the home page it is showing the lowest of these prices.  When people click on the item and see higher prices for the variant they want, they are disappointed and back away.  How can I add "starts at" before the $ amount, or perhaps even choose an average or custom price to display before customer clicks on product?

Replies 75 (75)

ahadad24
Visitor
2 0 0

I have the same issue. Would like to know how to do this

suyash1
Shopify Partner
9078 1129 1479

@ahadad24 - can you please share your website url? I will check it on browser

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
WoodLeon
Tourist
4 0 1

woodleon.com

suyash1
Shopify Partner
9078 1129 1479

@WoodLeon - if you want something like in screenshot then please add given css to the end of theme.scss file

.template-index .product-card__description dt:before {
    content: "starts at";
    padding-right: 10px;
    font-size: 20px;
    font-family: verdana;
}

 

suyash1_0-1615311576200.png

 

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
WoodLeon
Tourist
4 0 1

Thanks so much! How can I do the same for this page: https://woodleon.com/collections/neckties  or any collection page for that matter.

suyash1
Shopify Partner
9078 1129 1479

@WoodLeon - please add this and check 

.template-collection .product-price__price:before {content: "starts at";   padding-right: 10px;    font-size: 20px;    font-family: verdana;}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
WoodLeon
Tourist
4 0 1

I think that worked! Thanks so much!

aegyocakes
Visitor
1 0 0

Hi @suyash1 ! Can you check out my website too? I would like to add the same "starts at" on some of my products only. 

suyash1
Shopify Partner
9078 1129 1479

@aegyocakes - if you want on some products only then we will need to create new template, add code for it and set that template manually for the products you want..

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
NEI-Arlene
Excursionist
11 0 7

I know it's been a while but is this still accurate? Can I just add the css given to the end of my theme.css? I have 3 options theme.liquid , theme.css.liquid , and theme.gem-layout-none.liquid , i don't know if this is normal. 

suyash1
Shopify Partner
9078 1129 1479

@NEI-Arlene - yes, add css to  theme.css.liquid

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
NEI-Arlene
Excursionist
11 0 7

Hmmm, seems I'm doing something wrong. Copied and pasted the given css to the end of theme.css.liquid . This is my website. https://www.uniquehomefurniture.com/  

Would ( .template-collection ) this part be different on my website vs the other one? 

suyash1
Shopify Partner
9078 1129 1479

@NEI-Arlene - please try this

.template-collection .price__current.price__current--emphasize.price__current--on-sale:before {content: "starts at";}

 

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
NEI-Arlene
Excursionist
11 0 7

YAY! It worked! So grateful! I couldn't find the class name for the website, can't believe you were able to do it so fast. Thank you! Starts at SS.png

suyash1
Shopify Partner
9078 1129 1479

@NEI-Arlene - welcome, do let me know if you need anything, you have my email below

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
bhaumik57
Visitor
3 0 0

https://admin.shopify.com/store/5704c7-2/themes/161370603809/editor?previewPath=%2Fcollections%2Fdec....

 

 this is my collection page, and i am not able to apply given code to css to show price from "Start at". please help me out.

suyash1
Shopify Partner
9078 1129 1479

@bhaumik57 - please share your theme preview link, the current link you shared will ask for admin login

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
bhaumik57
Visitor
3 0 0

thanks for your kind consideration,

https://thearomaverse.in/collections/decants

this is theme preview link

ahadad24
Visitor
2 0 0

Sure it is sm-expert.com. It will be under custom products which you will need to create a fake account for to view it. 

bhaumik57
Visitor
3 0 0

https://thearomaverse.in/collections/all.

This is my page, please help set that "start at price" too🥲

saachi
Excursionist
29 0 4

@suyash1 Just wondering if you'd please be able to help me out with same for my website?

 

url: www.blingfactory.com.au

suyash1
Shopify Partner
9078 1129 1479

@saachi - please add this css to the very end of your theme.scss.css file and check

 

.template-collection .grid-product__price:before {
    content: "starts at";
    padding-right: 10px;
    font-size: 15.6px;
}

 

suyash1_0-1685172064220.png

 

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
saachi
Excursionist
29 0 4

That worked! Thank you!! 😄

suyash1
Shopify Partner
9078 1129 1479

@saachi - welcome, do let me know if you need anything else, you have my email below

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
saachi
Excursionist
29 0 4

@suyash1 It has worked for everything apart from one section. There is a best seller slider on the homepage itself, but the "starts at" doesn't show up there. Is there a way to fix it? 🙂

suyash1
Shopify Partner
9078 1129 1479

@saachi - from the above css remove the word  .template-collection  , so it becomes

.grid-product__price:before {
    content: "starts at";
    padding-right: 10px;
    font-size: 15.6px;
}

 

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
saachi
Excursionist
29 0 4

@suyash1 didn't work unfortunately 😞

suyash1
Shopify Partner
9078 1129 1479

@saachi - try this

.featured-collection-slider .carousel-cell p:before{
content: "starts at";
    padding-right: 10px;
    font-size: 15.6px;
}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
DrivenMN
Visitor
1 0 0

Hello,  could you pease check my website to www.DrivenMN.com Thank you so much!  It is the Motion Theme

suyash1
Shopify Partner
9078 1129 1479

@DrivenMN - where do you want it?

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
Kim1306
Visitor
2 0 0

Hi Suyash, 

Is it possible to add the "starts at" option for individual products rather than whole collections? How would I go about it? Thanks!

suyash1
Shopify Partner
9078 1129 1479

@Kim1306 - shopify uses shared template approach, hence it uses same classes, therefore bit difficult to have it for individual products

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
AG-95
New Member
7 0 0

Hello,  Is it possible to add this to a single collection page only?

AG-95
New Member
7 0 0

This is our website - https://englishpewter.com/

suyash1
Shopify Partner
9078 1129 1479

@AG-95 - looks like that your pages have unique classes so it can be possible, on which page do you want it?

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
AG-95
New Member
7 0 0

Hello,

 

Thank you for getting back. The page I would like it on is - https://englishpewter.com/collections/brandy-gift-sets

 

At the moment, I do not have any products live as I am working on them. 

 

Thank you.

suyash1
Shopify Partner
9078 1129 1479

@AG-95 - can you please add dummy product with variants? so we can set css, and then it will work for all products on this page

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
xevo1993
New Member
6 0 0

can you please help me? my shop: https://dcseventeen.com 

 

i would that on alle products

suyash1
Shopify Partner
9078 1129 1479

@xevo1993 - you want it like this?

 

suyash1_0-1695023254903.png

 

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
xevo1993
New Member
6 0 0

Yes please

suyash1
Shopify Partner
9078 1129 1479

@xevo1993 - add this css to the very end of your base.css file and check 

.price .price-item:before {content: "Starts at";}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
xevo1993
New Member
6 0 0

I‘ve put that at the end of the base.css but its not working

suyash1
Shopify Partner
9078 1129 1479

@xevo1993 - try this

span.price-item.price-item--sale.price-item--last:before{content: "Starts at";}

 

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
xevo1993
New Member
6 0 0

Not working 😞

IMG_3604.png

suyash1
Shopify Partner
9078 1129 1479

@xevo1993 - it is working

 

suyash1_0-1695028249669.png

 

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
xevo1993
New Member
6 0 0

Is this only on Desktop version? On mobile i dont see it

IMG_3605.png

mimiT
Excursionist
18 0 2

Hello! You are so kind helping everyone in this thread!! Can you please help with mine? my website is lejardinbridal.com
I only need it for the product page "Custom Wedding Gowns"

suyash1
Shopify Partner
9078 1129 1479

@mimiT - can you please share this page link? I clicked on the option in menu but it took me to contact page

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
paranormal story video using AI
mimiT
Excursionist
18 0 2

Sure! it took you to a contact page because I want the customer to contact me before purchasing. but the price is listed on there as $2500 but I want the price to state "up to $2500"