Перейти к содержимому


Помогите Поменять Цвет Кнопок В Корзину И Быстрый Заказ

кнопка купить корзина цвет

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 25

#1 Leonid2016

Leonid2016

    Пользователь

  • Пользователи
  • PipPip
  • 18 сообщений

Отправлено 14 Июнь 2015 - 06:00

Здравствуйте! помогите изменить цвет кнопок в корзину и быстрый заказ в карточке товара шаблон лазурь Аккаунт SL-256229

#2 Danil

Danil

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 4 645 сообщений

Отправлено 14 Июнь 2015 - 09:41

Просмотр сообщенияLeonid2016 (14 Июнь 2015 - 06:00) писал:

Здравствуйте! помогите изменить цвет кнопок в корзину и быстрый заказ в карточке товара шаблон лазурь Аккаунт SL-256229
Здравствуйте.
В main.css найдите код
.product-shop .add-to-cart .btn-cart {position: relative;padding: 12px 24px 12px 53px;margin: 0 0;font-size: 116.7%;background: #c0c0c0;color: #FFF;border-color: #c0c0c0;-webkit-border-radius: 24px;-moz-border-radius: 24px;border-radius: 24px;background-image: url("{ASSETS_IMAGES_PATH}action-llist.png");background-repeat: no-repeat;background-position: 9px -346px;}
изменяйте цвет #c0c0c0 на свой

#3 Leonid2016

Leonid2016

    Пользователь

  • Пользователи
  • PipPip
  • 18 сообщений

Отправлено 14 Июнь 2015 - 11:40

Просмотр сообщенияDanil (14 Июнь 2015 - 09:41) писал:

Здравствуйте.
В main.css найдите код
.product-shop .add-to-cart .btn-cart {position: relative;padding: 12px 24px 12px 53px;margin: 0 0;font-size: 116.7%;background: #c0c0c0;color: #FFF;border-color: #c0c0c0;-webkit-border-radius: 24px;-moz-border-radius: 24px;border-radius: 24px;background-image: url("{ASSETS_IMAGES_PATH}action-llist.png");background-repeat: no-repeat;background-position: 9px -346px;}
изменяйте цвет #c0c0c0 на свой

Спасибо за помощь, удачи и хорошего дня!

#4 orionych

orionych

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 59 сообщений

Отправлено 08 Август 2015 - 09:13

Здравствуйте, а можно ли сделать, чтобы при наведении эти кнопки подсвечивались каждая СВОИМ цветом?


И вопрос посложнее:
Сейчас товар, которого нет в наличии, можно так же, как и любой другой, положить в корзину и оформить заказ.

Это хорошо, только хотелось бы как-то всё же разграничить оба вида наличия.

Как можно сделать, чтобы в карточке отсутствующего товара (или при выборе отсутствующей модификации) кнопка "В корзину" меняла название на "Предзаказ" и при наведении подсвечивалась отдельным цветом (сохраняя стиль, конечно, и сначала чтобы тоже была серой)?

Плюс можно ли как-нибудь сделать, чтобы в Корзине фон строки отсутствующего товара отличался от остальных и под количеством указывалось, что "предзаказ", а у остальных товаров еще и отображалось "В наличии"?

Заранее спасибо.

Прикрепленные изображения

  • 2015-08-08_08-43.jpg
  • 2015-08-08_09-04.jpg
  • 2015-08-08_09-11.jpg


#5 RayLi

RayLi

    Активный участник

  • Модераторы
  • 2 864 сообщений

Отправлено 09 Август 2015 - 11:27

Просмотр сообщенияblacksun92 (08 Август 2015 - 09:13) писал:

Здравствуйте, а можно ли сделать, чтобы при наведении эти кнопки подсвечивались каждая СВОИМ цветом?


И вопрос посложнее:
Сейчас товар, которого нет в наличии, можно так же, как и любой другой, положить в корзину и оформить заказ.

Это хорошо, только хотелось бы как-то всё же разграничить оба вида наличия.

Как можно сделать, чтобы в карточке отсутствующего товара (или при выборе отсутствующей модификации) кнопка "В корзину" меняла название на "Предзаказ" и при наведении подсвечивалась отдельным цветом (сохраняя стиль, конечно, и сначала чтобы тоже была серой)?

Плюс можно ли как-нибудь сделать, чтобы в Корзине фон строки отсутствующего товара отличался от остальных и под количеством указывалось, что "предзаказ", а у остальных товаров еще и отображалось "В наличии"?

Заранее спасибо.

Здравствуйте.
Если я вас правильно понял, то сделайте, пожалуйста, следующее:
В шаблоне Товар найдите данный код:

		 <div class="add-to-cart clear">
		 <input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
		 <input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 <input type="button" value="Быстрый заказ" class="add-cart quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 <input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 </div>
	 </div>
	 <!-- Добавление товара в Избранное, Сравнение -->

И замените его этим вот кодом:

		 <div class="add-to-cart clear">
		 <input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
		 <input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 <input type="button" value="Быстрый заказ" class="add-cart2 quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 <input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 </div>
	 </div>
	 <!-- Добавление товара в Избранное, Сравнение -->


#6 orionych

orionych

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 59 сообщений

Отправлено 10 Август 2015 - 13:29

Просмотр сообщенияRayLi (09 Август 2015 - 11:27) писал:

Здравствуйте.
Если я вас правильно понял, то сделайте, пожалуйста, следующее:
В шаблоне Товар найдите данный код:

		 <div class="add-to-cart clear">
		 <input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
		 <input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 <input type="button" value="Быстрый заказ" class="add-cart quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 <input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 </div>
	 </div>
	 <!-- Добавление товара в Избранное, Сравнение -->

И замените его этим вот кодом:

		 <div class="add-to-cart clear">
		 <input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
		 <input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 <input type="button" value="Быстрый заказ" class="add-cart2 quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 <input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
		 </div>
	 </div>
	 <!-- Добавление товара в Избранное, Сравнение -->

У меня такого нет в коде...

#7 RayLi

RayLi

    Активный участник

  • Модераторы
  • 2 864 сообщений

Отправлено 10 Август 2015 - 13:40

Просмотр сообщенияblacksun92 (10 Август 2015 - 13:29) писал:

У меня такого нет в коде...

Здравствуйте.
Нужный вам код находится на 141-й строке в шаблоне Товар .
Проверьте, пожалуйста.

#8 orionych

orionych

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 59 сообщений

Отправлено 10 Август 2015 - 14:50

Просмотр сообщенияRayLi (10 Август 2015 - 13:40) писал:

Здравствуйте.
Нужный вам код находится на 141-й строке в шаблоне Товар .
Проверьте, пожалуйста.

Странно, я вполне уверена, что сначала в вашем сообщении было написано: в шаблоне main.css найдите данный код. Но да ладно.

Я не очень поняла, на какой из двух моих вопросов это ответ, но так или иначе, ни кнопки не стали разных цветов, ни отсутствующие товары не отображаются по-другому, более того, теперь в принципе не работает кнопка "Быстрый заказ".

Помогите, пожалуйста.((

#9 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 11 Август 2015 - 04:06

1. В шаблоне Товар найдите:
   <div class="add-to-cart clear">
				 <input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
				 <input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 <input type="button" value="Быстрый заказ" class="add-cart quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 <input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 </div>
		 </div>
		 <!-- Добавление товара в Избранное, Сравнение -->
замените на:
   <div class="add-to-cart clear">
				 <input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
				 <input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 <input type="button" value="Быстрый заказ" class="add-cart add-cart2 quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 <input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 </div>
		 </div>
		 <!-- Добавление товара в Избранное, Сравнение -->

В main.css найдите:
.product-shop .add-to-cart .btn-cart:hover {
background-color: #3CABDA;
border-color: #3CABDA;
}

после него пропишите:
.product-shop .add-to-cart2 .btn-cart:hover {
background-color: #DE44C3;
border-color: #DE44C3;
}

2. В шаблоне Товар найдите:
<input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				
замените на:
<input type="button" value="{% IF GOODS_MOD_REST_VALUE>0 %}В корзину{% ELSE %}Предзаказ{% ENDIF %}" class="add-cart button btn-cart {% IF GOODS_MOD_REST_VALUE=0 %}btn_av_f{% ENDIF %}" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				

в main.css после
.product-shop .add-to-cart2 .btn-cart:hover {
background-color: #DE44C3;
border-color: #DE44C3;
}

пропишите:
.product-shop .add-to-cart .btn_av_f:hover {
background-color: #F74444;
border-color: #F74444;
}


#10 orionych

orionych

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 59 сообщений

Отправлено 15 Август 2015 - 05:00

Просмотр сообщенияVaccina (11 Август 2015 - 04:06) писал:

1. В шаблоне Товар найдите:
<div class="add-to-cart clear">
				 <input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
				 <input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 <input type="button" value="Быстрый заказ" class="add-cart quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 <input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 </div>
		 </div>
		 <!-- Добавление товара в Избранное, Сравнение -->
замените на:
<div class="add-to-cart clear">
				 <input type="hidden" name="form[goods_mod_id]" value="{GOODS_MOD_ID}" class="goodsDataMainModificationId" />
				 <input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 <input type="button" value="Быстрый заказ" class="add-cart add-cart2 quick button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 <input type="button" value="Купить" class="button btn-cart quickview" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				 </div>
		 </div>
		 <!-- Добавление товара в Избранное, Сравнение -->

В main.css найдите:
.product-shop .add-to-cart .btn-cart:hover {
background-color: #3CABDA;
border-color: #3CABDA;
}

после него пропишите:
.product-shop .add-to-cart2 .btn-cart:hover {
background-color: #DE44C3;
border-color: #DE44C3;
}

2. В шаблоне Товар найдите:
<input type="button" value="В корзину" class="add-cart button btn-cart" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				
замените на:
<input type="button" value="{% IF GOODS_MOD_REST_VALUE>0 %}В корзину{% ELSE %}Предзаказ{% ENDIF %}" class="add-cart button btn-cart {% IF GOODS_MOD_REST_VALUE=0 %}btn_av_f{% ENDIF %}" title="Положить &laquo;{GOODS_NAME}&raquo; в корзину"/>
				

в main.css после
.product-shop .add-to-cart2 .btn-cart:hover {
background-color: #DE44C3;
border-color: #DE44C3;
}

пропишите:
.product-shop .add-to-cart .btn_av_f:hover {
background-color: #F74444;
border-color: #F74444;
}


Простите, всё вроде сделала по этой инструкции, но не сработало... Теперь, правда, кнопки совсем не подсвечиваются при наведении (на 1м скрине курсор стоит на "В корзину", просто он не виден).
Эх эх((

Прикрепленные изображения

  • 2015-08-15_04-57.jpg
  • 2015-08-15_04-58.jpg


#11 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 15 Август 2015 - 05:55

В main.css найдите:
.product-shop .add-to-cart2 .btn-cart:hover {
background-color: #DE44C3;
border-color: #DE44C3;
}
.product-shop .add-to-cart .btn_av_f:hover {
background-color: #F74444;
border-color: #F74444;
}.product-shop .add-to-cart .btn-cart.quick {margin-left:10px;}

замените на:
.product-shop .add-to-cart .btn-cart:hover {background-color: #3cabda;border-color: #3cabda;}
.product-shop .add-to-cart .add-cart2:hover {
background-color: #DE44C3;
border-color: #DE44C3;
}
.product-shop .add-to-cart .btn_av_f:hover {
background-color: #F74444;
border-color: #F74444;
}
.product-shop .add-to-cart .btn-cart.quick {margin-left:10px;}


#12 orionych

orionych

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 59 сообщений

Отправлено 16 Август 2015 - 00:59

Просмотр сообщенияVaccina (15 Август 2015 - 05:55) писал:

В main.css найдите:
.product-shop .add-to-cart2 .btn-cart:hover {
background-color: #DE44C3;
border-color: #DE44C3;
}
.product-shop .add-to-cart .btn_av_f:hover {
background-color: #F74444;
border-color: #F74444;
}.product-shop .add-to-cart .btn-cart.quick {margin-left:10px;}

замените на:
.product-shop .add-to-cart .btn-cart:hover {background-color: #3cabda;border-color: #3cabda;}
.product-shop .add-to-cart .add-cart2:hover {
background-color: #DE44C3;
border-color: #DE44C3;
}
.product-shop .add-to-cart .btn_av_f:hover {
background-color: #F74444;
border-color: #F74444;
}
.product-shop .add-to-cart .btn-cart.quick {margin-left:10px;}


Ага, спасибо, теперь Корзина и Быстрый заказ разных цветов, это очень удобно.)

А вот различия кнопки "В корзину" для товаров в наличии и по предзаказу (цвет и текст на кнопке)? И хотя бы такую маленькую подпись для товаров, которых не было в наличии непосредственно в корзине?

Чтобы долго не искать, вот примерно как мне надо сделать на скринах)

Прикрепленные изображения

  • 2015-08-16_00-51.jpg
  • 2015-08-16_00-54.jpg
  • 2015-08-16_00-57.jpg


#13 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 18 Август 2015 - 03:33

В шаблоне main.js найдите:
// Есть ли товар есть в наличии
		 if(modificationRestValue>0) {
		   goodsAvailableTrue.show();
		   goodsAvailableFalse.hide();
		   goodsAvailableAddCart.show();
		 // Если товара нет в наличии
		 } else {
		   goodsAvailableTrue.hide();
		   goodsAvailableFalse.show();
		   goodsAvailableAddCart.hide();
		 }

замените на:
// Есть ли товар есть в наличии
		 if(modificationRestValue>0) {
		   goodsAvailableTrue.show();
		   goodsAvailableFalse.hide();
		   goodsAvailableAddCart.show();
	  $('.add-cart').val('В корзину');
	$('.add-cart').removeClass('btn_av_f');
		 // Если товара нет в наличии
		 } else {
		   goodsAvailableTrue.hide();
		   goodsAvailableFalse.show();
		   goodsAvailableAddCart.hide();
	 $('.add-cart').val('Предзаказ');
	 $('.add-cart').addClass('btn_av_f');
		 }


#14 yan_komlev

yan_komlev

    Пользователь

  • Пользователи
  • PipPip
  • 12 сообщений
  • ГородСанкт-Петербург

Отправлено 18 Август 2015 - 13:24

не работает

#15 orionych

orionych

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 59 сообщений

Отправлено 18 Август 2015 - 17:45

Просмотр сообщенияVaccina (18 Август 2015 - 03:33) писал:

В шаблоне main.js найдите:
// Есть ли товар есть в наличии
		 if(modificationRestValue>0) {
		 goodsAvailableTrue.show();
		 goodsAvailableFalse.hide();
		 goodsAvailableAddCart.show();
		 // Если товара нет в наличии
		 } else {
		 goodsAvailableTrue.hide();
		 goodsAvailableFalse.show();
		 goodsAvailableAddCart.hide();
		 }

замените на:
// Есть ли товар есть в наличии
		 if(modificationRestValue>0) {
		 goodsAvailableTrue.show();
		 goodsAvailableFalse.hide();
		 goodsAvailableAddCart.show();
	 $('.add-cart').val('В корзину');
$('.add-cart').removeClass('btn_av_f');
		 // Если товара нет в наличии
		 } else {
		 goodsAvailableTrue.hide();
		 goodsAvailableFalse.show();
		 goodsAvailableAddCart.hide();
	 $('.add-cart').val('Предзаказ');
	 $('.add-cart').addClass('btn_av_f');
		 }


Спасибо-спасибо, это именно то, что мне было нужно, кнопки великолепны!

Осталась только маленькая пометочка в корзине о том, что этот товар по "предзаказу".

Vaccina, честное слово, после этого я довольно надолго от вас отстану, обещаю!) Уже достала вас со своими выдумками, должно быть, но вы так здорово в этом разибраетесь, а сама я никак.  :(

Прикрепленные изображения

  • 2015-08-16_00-57.jpg


#16 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 19 Август 2015 - 01:47

В шаблоне Корзина найдите:
<td>
			  <input name="form[quantity][{cart_items.GOODS_MOD_ID}]" value="{cart_items.ORDER_LINE_QUANTITY}" title="Количество, {cart_items.GOODS_MOD_MEASURE_NAME}" class="inputText cartqty qty" type="number" size="4" maxlength="12" min="0" />
			</td>
замените на:
<td>
			  <input name="form[quantity][{cart_items.GOODS_MOD_ID}]" value="{cart_items.ORDER_LINE_QUANTITY}" title="Количество, {cart_items.GOODS_MOD_MEASURE_NAME}" class="inputText cartqty qty" type="number" size="4" maxlength="12" min="0" />
			 {% IF cart_items.MAX_REST_VALUE=0 %}<div>Предзаказ</div>{% ENDIF %}
</td>


#17 orionych

orionych

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 59 сообщений

Отправлено 19 Август 2015 - 11:20

Просмотр сообщенияVaccina (19 Август 2015 - 01:47) писал:

В шаблоне Корзина найдите:
<td>
			 <input name="form[quantity][{cart_items.GOODS_MOD_ID}]" value="{cart_items.ORDER_LINE_QUANTITY}" title="Количество, {cart_items.GOODS_MOD_MEASURE_NAME}" class="inputText cartqty qty" type="number" size="4" maxlength="12" min="0" />
		 </td>
замените на:
<td>
			 <input name="form[quantity][{cart_items.GOODS_MOD_ID}]" value="{cart_items.ORDER_LINE_QUANTITY}" title="Количество, {cart_items.GOODS_MOD_MEASURE_NAME}" class="inputText cartqty qty" type="number" size="4" maxlength="12" min="0" />
			 {% IF cart_items.MAX_REST_VALUE=0 %}<div>Предзаказ</div>{% ENDIF %}
</td>


Здорово, спасибо! Только теперь эта надпись появилась у всех товаров, даже которые в наличии...(

#18 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 20 Август 2015 - 02:17

В шаблоне Корзина найдите:
{% IF cart_items.MAX_REST_VALUE=0 %}<div>Предзаказ</div>{% ENDIF %}

замените на:
{% IF cart_items.GOODS_MOD_REST_VALUE=0 %}<div>Предзаказ</div>{% ENDIF %}


#19 orionych

orionych

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 59 сообщений

Отправлено 21 Август 2015 - 03:50

Просмотр сообщенияVaccina (20 Август 2015 - 02:17) писал:

В шаблоне Корзина найдите:
{% IF cart_items.MAX_REST_VALUE=0 %}<div>Предзаказ</div>{% ENDIF %}

замените на:
{% IF cart_items.GOODS_MOD_REST_VALUE=0 %}<div>Предзаказ</div>{% ENDIF %}


Спасибо вам огромное! Именно то, что я хотела!

#20 Андрей Кольченко

Андрей Кольченко

    Пользователь

  • Пользователи
  • PipPip
  • 19 сообщений
  • ГородСанкт-Петербург

Отправлено 03 Сентябрь 2015 - 17:22

Добрый день!

Тоже вопрос с кнопками

1. Как сделать так, чтобы кнопка "быстрый заказ" была слева, "в корзину" справа?
2. Как сделать так, чтобы кнопка "быстрый заказ" уже была выделена цветом (цвет будем тестить), т.е. выделялась на фоне серой кнопки "в корзину"?
    При этом необходимо сохранить опцию смены цвета на стандартный голубой при наведении курсором.




Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных