-
-
On my website every page has a very small Cart icon in the top right side of the header. It it possible to make this larger and also to change the text on the pop up box that appears when you hover over it from ‘View Cart’ to ‘View Basket’?
It would also be nice to be able to add a small bit of text next to it to indicate that something has been added to the Basket. At the moment it looks the same whether a product has been added or not.
Do you think the above is possible and if so how should I go about it please?
-
Hello,
To make the icon bigger you have to change this line into style.css file :
.header_tools .cart_icon{font-size:20px;}
As you can see i have changed the font size from 14px to 20px;
Normally you have to see a number upper the chart but seems there is an issue. Have you installed any third party plugin ?
Let us know.
Regards!
-
Do I add your line of code into the custom CSS section in your theme settings?
I’ve only added one plugin that might cause an issue but turning it off does not fix the issue.
-
Hello,
Yes, you can add the custom css in Specular > General Options > Custom Css box, too!
Best regards!
-
I already tried that and it did not have any effect on the size.
-
Hello,
Edit the code to this:
.header_tools .cart_icon{ font-size:20px !important; }
-To change the text “View Cart” to “View Basket” you need to edit every file where this string is present. This is not recommended as it will prevent you from taking future theme updates which are very important.
But there is a simpler solution. Use the pot file to change the text. This way you can save a copy of only one file and replace it again after a theme update in the future.
Read more about it here: https://support.ellethemes.com/?ht_kb=translate-site-using-po-mo-files
If you are not much familiar with this type of translation, watch this video tutorial.Best regards!
-
Just tried it with your new code but still no difference unfortunately.
-
Hello,
Can i please see a link where are you having this? The site link in your profile does not have any cart.
Best regards!
-
-
Hello,
I see the code is indeed there but it’s inactive. This means something else is stopping it from taking action. See screenshot: https://postimg.cc/t73P2ybm
Please deactivate other third party plugins you may have or comment out other custom css added. Then check again.
Let us know how it goes.
Best regards!
-
I’ve tried deactivating plugins but still have the issue unfortunately.
-
I also tried taking out all the custom css code but unfortunately that didn’t resolve it either. Not sure what to do now.
-
Hello,
Go to file style.css and find this line (862):
.header_tools .cart_icon{font-size: 14px !important;float:left;position:relative;}
Remove the !important. Like this:
.header_tools .cart_icon{font-size: 14px;float:left;position:relative;}
Save changes.
Let me know.
Best regards! -
-
-
Hi,
Thanks for the details. Will be in touch shortly.
Thanks again
-
Any news on this please? It’s a while since I posted the question.
-
Hi,
Kindly hard reload your website now and check if the size is fine now. If you still want some bigger size let me know ?
Thank You
-
-
Hi,
You are welcome. If you like our theme and support then rate us with 5 star rating as it keeps us focused in more active way :)
Thanks in advance
-
Hi,
I just checked and unfortunately the cart icon has reduced back in size again. No idea why. Could you please help again.
Thanks.
-
Hi,
Well, I have done that again. Kindly don’t forget to rate us with 5 star :)
Thank You
-
You must be logged in to reply to this topic.