Woocommerce изменить значок корзины покупок

Как я могу изменить значок корзины покупок Woocommerce? Я использую тему Элли, и их значок корзины покупок сбивает с толку, только кружок. Так как я мог это изменить?

Любая помощь высоко ценится!

Значок корзины

https://senjacosmetics.com/shop/

1
0
7 607
3

Ответы 3

Вы можете изменить значок корзины с помощью CSS, используя приведенный ниже код в CSS,

.site-header-cart .cart-toggler .cart-contents {
	content: '';
	background: url('URL_TO_YOUR_CART_IMAGE') no-repeat center center;
	background-size: contain;
	width: 20px;
	height: 20px;
	margin: -2px -4px;
	display: inline-block;
}

Замените URL_TO_YOUR_CART_IMAGE URL-адресом значка корзины.

Сделайте это проще без использования изображений. Добавьте псевдокласс: до этого:

Удалить границу:

.site-header-cart .cart-toggler .cart-contents {border:0px;}    

затем добавьте:

.site-header-cart .cart-toggler .cart-contents:before { 
content: "\f07a";
font-family: FontAwesome!important;
}

Добавьте это в свою дочернюю тему или перейдите в свой настройщик и добавьте его в раздел Extra CSS.

Замечательно, я попробовал последнее предложение, и оно сработало. :) Может позже попробую поменять иконку.

Senja 31.10.2018 15:18

С удовольствием помогу, но разве вопрос не меняет значок?

Solomax 31.10.2018 15:30

Надеюсь, следующий код поможет: проверьте скриншот enter image description here

.site-header-cart .cart-toggler .cart-contents:after {
    content: "";
    font-family: FontAwesome;
    margin-left: 14px;
}

.site-header-cart .cart-toggler .cart-contents .count {
    line-height: 15px;
    text-align: center;
    font-size: 12px;
    display: block;
    width: 100%;
    height: 100%;
    font-weight: normal;
    position: absolute;

Зачем использовать псевдо: после? а потом добавить дополнительную маржу?

Solomax 31.10.2018 15:27

@Solomax, использование ранее не приведет к достижению точного дизайна, показанного на скриншоте. Вы можете использовать мой код в Stylebot, чтобы понять. Сообщите мне о любых проблемах.

Tristup 01.11.2018 05:43

Другие вопросы по теме