Changing Shopping Cart Icon

[Kyle – SUPPORT]

Hi

Open up sf-header.php and find line 714:

$cart_output .= '<li class="parent shopping-bag-item"><a class="cart-contents" href="'.$woocommerce->cart->get_cart_url().'" title="'.__("View your shopping cart", "swiftframework").'"><i class="sf-cart"></i>'.$cart_total.'</a>';

You will need to replace sf-cart

– Kyle

[charnold]

Thanks, Kyle!

[Kyle – SUPPORT]

No problem 🙂

[Sand]

hi kyle – i tried to use css but can’t seem to get it to work – shows up blank

.menu > li.shopping-bag-item a > i.sf-cart, .mobile-cart-link i.sf-cart {
background: url(“uploads/2014/07/picnic2_32x32.png”) no-repeat scroll left top rgba(0, 0, 0, 0);
nav .menu li {
margin: 0;
}
http://digitaldevotee.com/dinosauro/wp-content/uploads/2014/07/picnic2_32x32.png

any tips on icon size of icon etc?

[Kyle – SUPPORT]

Add this to your custom css:

.menu > li.shopping-bag-item a > i.sf-cart, .mobile-cart-link i.sf-cart {
  background: url("http://digitaldevotee.com/dinosauro/wp-content/uploads/2014/07/picnic2_32x32.png") no-repeat scroll left top transparent;
  display: inline-block;
  height: 32px;
  margin-right: 6px;
  vertical-align: -7px;
  width: 32px;
}
.cart-contents {
  padding-top: 0!important;
}

– Kyle

[Sand]

This reply has been marked as private.

[Kyle – SUPPORT]

Try this:

nav .menu li {
  margin: 0;
}
.shopping-bag-item .cart-contents {
  padding: 10px 0!important;
}

– Kyle

[Sand]

This reply has been marked as private.

[Kyle – SUPPORT]

Finally add:

.mini-menu .shopping-bag-item .cart-contents {
  padding: 0!important;
}

– Kyle

[Sand]

perfect!

[Kyle – SUPPORT]

Great! 🙂