|
FYI… UPDATE…
Since posting my question I’ve been hacking at the CSS and the best I could come up with is the following. It creates rectangles instead of the circle price tag.
.s_label .s_price {
background-image: url("") !important;
border-radius: 10px 10px 10px 10px;
width: 100px !important;
height: 30px !important;
padding-top: 10px !important;
}
.s_price_holder.s_size_1.s_label .s_price{
background-image: url("") !important;
border-radius: 10px 10px 10px 10px;
width: 100px !important;
height: 30px !important;
padding-top: 10px !important;
}
.s_price_holder.s_size_2.s_label .s_price{
background-image: url("") !important;
border-radius: 10px 10px 10px 10px;
width: 100px !important;
height: 30px !important;
padding-top: 10px !important;
}
.s_price_holder.s_size_3.s_label .s_price{
background-image: url("") !important;
border-radius: 10px 10px 10px 10px;
width: 100px !important;
height: 30px !important;
padding-top: 10px !important;
}
.s_price_holder.s_size_4.s_label .s_price{
background-image: url("") !important;
border-radius: 10px 10px 10px 10px;
width: 100px !important;
height: 30px !important;
padding-top: 10px !important;
}
I’m sure there is an easier way to do this but its the best I could come up with, with my limited CSS knowledge.
|
|
|
@kingdwight
Thanks for sharing your modification, mate 
BR,
ThemeBurn team
|
|
|
@kingdwight
Your custom css wil not show when a product is in sale. Then the price will be out of bounce.
@QenTox
Have you already managed to get that price tag on your website? I’m also interested in a tag like that, something more professional and from this time.
Hopefully there is someone with a solution!
Attached a PSD file from some free designs i found and do like.
Regards.
Kevin
|
|
|
Hi TB,
Sorry, but i’ve tried to implement my own price tag with above instruction, but it just isn’t work. There is nothing changing at all.
Can you please help me and tell me what i can possibly do wrong?
I’ve tried to use the image attached with the underneath coding.
#product_price .s_price {
height: 105px !important; /* May need adjustment */
width: 210px !important; /* May need adjustment */
padding: 32px 0 0 2px !important; /* May need adjustment */
background: url(“http://www.mydomain.nl/catalog/view/theme/shoppica2/images/pricetag.png”  no-repeat 0 0 transparent !important;
border-radius: 0 !important;
#product_price .s_promo_price {
height: 105px !important; /* May need adjustment */
width: 210px !important; /* May need adjustment */
padding: 32px 0 0 2px !important; /* May need adjustment */
background: url(“http://www.mydomain.nl/catalog/view/theme/shoppica2/images/pricetagpromo.png” no-repeat 0 0 transparent !important;
border-radius: 0 !important;
|
|
|
@Rovara
Please, use a code tag to properly publish css styles.
Thanks,
ThemeBurn team
|
|
|
Hi TB,
Sorry, but i’ve tried to implement my own price tag with above instruction, but it just isn’t work. There is nothing changing at all.
Can you please help me and tell me what i can possibly do wrong?
I’ve tried to use the image attached with the underneath coding.
#product_price .s_price {
height: 105px !important; /* May need adjustment */
width: 210px !important; /* May need adjustment */
padding: 32px 0 0 2px !important; /* May need adjustment */
background: url(“http://www.mydomain.nl/catalog/view/theme/shoppica2/images/pricetag.png&#8221 ;) no-repeat 0 0 transparent !important;
border-radius: 0 !important;
#product_price .s_promo_price {
height: 105px !important; /* May need adjustment */
width: 210px !important; /* May need adjustment */
padding: 32px 0 0 2px !important; /* May need adjustment */
background: url(“http://www.mydomain.nl/catalog/view/theme/shoppica2/images/pricetagpromo.png&#8221 ;) no-repeat 0 0 transparent !important;
border-radius: 0 !important;
-
This reply was modified 3894 days ago by
 Rovara.
|
|
You will need to register in order to post topics and read replies in the ThemeBurn.com support forums! |
|
|
Sorry, but i’ve tried and still don’t get it to work even when including the missing closing tag.
I also really want to add the new price tag style to the category pages, what is the code for this modification?
I’m currently using underneath code for the new price tag style on product page (promo and not promo).
}
#product_price .s_price {
height: 105px !important; /* May need adjustment */
width: 210px !important; /* May need adjustment */
padding: 32px 0 0 2px !important; /* May need adjustment */
background: url("http://www.domain.nl/public_html/catalog/view/theme/shoppica2/image/price_tag_blauw.png") no-repeat 0 0 transparent !important;
border-radius: 0 !important;
}
#product_price .s_promo_price {
height: 105px !important; /* May need adjustment */
width: 210px !important; /* May need adjustment */
padding: 32px 0 0 2px !important; /* May need adjustment */
background: url("http://www.domain.nl/public_html/catalog/view/theme/shoppica2/image/price_tag_blauw.png") no-repeat 0 0 transparent !important;
border-radius: 0 !important;
}
Hope you have the solution?
-
This reply was modified 3889 days ago by Rovara.
|
|
|
How to get the size bigger of my button image. When uploading bigger formats opencart is keeping the image 100×100. I need bigger else the outcome isn’t that equal (see screenshot).
How to get a link to a bigger image for the new button?
|
|
