Changing Shopping Cart Icon

[MonteCristo]

Hi, I’ve searched the forum and can’t locate a response.

How to I change the shopping cart icon from the ‘fa-lock’ to ‘fa-shopping-cart’icon.

fa-lock: http://fortawesome.github.io/Font-Awesome/icon/lock

fa-shopping-cart: http://fortawesome.github.io/Font-Awesome/icon/shopping-cart

Is there a file that contains the class ID I can update?

Thanks
M

[Melanie – SUPPORT]

Hey, a search for “change cart icon” brings up a few threads, have you checked them out?

http://support.swiftideas.net/search/?q=change+cart+icon

[MonteCristo]

Thanks, I was searching for shopping cart icon but for some odd reason couldn’t locate.

Thank you for the link, one question which I couldn’t see in previous was how do I add a space as it appears very tight – between icon and $ symbol. Picture attached.

I changed ‘sf-cart’ to ‘fa fa-shopping-cart’

Would   help or ruin the code?

Thanks
M

[Kyle – SUPPORT]

Hi

Try adding this css to your custom css:

.shopping-bag-item .fa-shopping-cart {
  margin-right: 6px;
}

– Kyle

[MonteCristo]

Hi Kyle, thanks for the custom css, I tried but unfortunately that but didn’t create the 6px gap.

[Kyle – SUPPORT]

Please can you provide me with a link so that I can check the css for you

– Kyle

[MonteCristo]

Hi Kyle,

Thanks for your help, since last update it has resolved the issue with your custom CSS.

Thanks for your help again.

Monte

[Kyle – SUPPORT]

Great! 🙂

– Kyle

[sparkone]

I’m trying the same thing but I can’t find the custon css to change the icon. Please help me?

[Kyle – SUPPORT]

Hi @sparkone

For Dante or Neighborhood?

– Kyle

[sparkone]

For Neighborhood

[Kyle – SUPPORT]

Open up neighborhood/includes/swift-framework/sf-woocommerce.php and go to line 111 and change this:

<a class="cart-contents" href="<?php echo $woocommerce->cart->get_cart_url(); ?>" title="<?php _e('View your shopping cart', 'swiftframework'); ?>"><i class="sf-cart"></i><?php echo $woocommerce->cart->get_cart_total(); ?></a>

for this:

<a class="cart-contents" href="<?php echo $woocommerce->cart->get_cart_url(); ?>" title="<?php _e('View your shopping cart', 'swiftframework'); ?>"><i class="fa fa-shopping-cart"></i><?php echo $woocommerce->cart->get_cart_total(); ?></a>

– Kyle

[sparkone]

Ok Thanks!
but will this not be changed at the next update?

[Kyle – SUPPORT]

It will yes, to change it with css you will need to replace the background image, which means you will have to get the cart icon as an image and upload it. Then replace this css:

.menu > li.shopping-bag-item a > i.sf-cart, .mobile-cart-link i.sf-cart {
  background: url("images/shopping_bag_icon.png") no-repeat scroll left top rgba(0, 0, 0, 0);
}

– Kyle

[charnold]

Hey Kyle,

I changed the code in neighborhood/includes/swift-framework/sf-woocommerce.php line 111 and the cart icon is working great when viewed on a desktop. On mobile, however, it is still showing the shopping bag. Is there another line of code to change in sf-woocommerce.php for mobile?

Thanks!