RapidCart Change Shopping "Basket" to "Cart" Icon


(Tony) #1

Hi Folks,

Anyone know how to change the icon in RapidCart from the basket to the more standard shopping-cart icon?

I already had a couple of comments indicating, folks couldn’t find the shopping-cart button on my site. Below is the default basket image, which I think is a bit confusing.


(Tony) #2

Doing some research (please note I am not web programmer), it seems like RapidCart uses UIkit framework.

It would seem like I’d have to search and replace all instances of “.uk-icon-shopping-basket” to “.uk-icon-shopping-cart” in the published files on the server. This would be painful as each time I update the site, I’d have to manually redo this. Any simpler way?

from UIkit web site: https://getuikit.com/docs/icon


(scott williams) #3

I would be willing to bet you could just add a little CSS to your page or sitewide CSS area. Give a url and you will get some help.


(Tony) #4

Hi Scott,

The URL of the site I’m working on is the “Online Store” page of http://polymerracingproducts.com/

I actually went into the server and manually did a search and replace of the.uk-icon.shopping.basket to .uk-icon.shopping.cart on couple of PHP files where I found this and site now shows the cart instead of the basket.

I suspect next upload I make it will wipe this out, so if a simple CSS could permanently fix this that would be much better solution.

Thanks,

Tony


(Tony) #5

Folks,

I forwarded the question to Will from https://themeflood.com/boutique/ (“Boutique” theme I use for the site) and he quickly came back with the following CSS code to make the icon change. I tested it out and it works!

Hi Tony,

I have checked the RCP settings and I cannot see anywhere to change the icon design.

You are correct in that RCP is using the UI-Kit front-end framework and this in-turn appears to be using Font Awesome icons.

Because the theme already includes Font Awesome 5.5, you could try a crude CSS modification like this added to your RCP page:

.uk-icon-shopping-basket::before {
content: “\f07a” !important;
}

That will change whatever icon was used before to the FA shopping-cart:

https://fontawesome.com/icons/shopping-cart?style=solid


(system) #6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.