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



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

#1 support

support

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

  • Модераторы
  • 3 686 сообщений
  • ГородМосква

Отправлено 26 Февраль 2014 - 03:32

Сегодня появился новый адаптивный шаблон - «Весна». В нём реализованы некоторые особенности, не встречающиеся в других шаблонах, например добавлен модуль избранных товаров. Он позволяет клиенту магазина добавлять товары в особый список, который будет отображаться в его личном кабинете покупателя.
Ещё одной интересной особенностью можно считать добавление товара на сравнение/избранное через ajax запрос, без перезагрузки страницы. Это особенно полезно, когда находишься внизу страницы, добавляешь товар на сравнение и тебя не перебрасывает в начало страницы.
В новом шаблоне необычный дизайн и интересные визуальные эффекты.
Пример можно посмотреть по адресу:
http://spring-demo.storeland.ru/

#2 velena168

velena168

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

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

Отправлено 26 Февраль 2014 - 03:54

Ого! Интересно, сложно будет на Осень перенести интересные фишки? Коды шаблонов чем-то похожи. Будем пробовать.

Посмотрела все, отметила, что хотелось бы перенести:

1. Модуль избранных товаров

2. Добавление товара в сравнение/избранное через ajax запрос в Товаре (Самое главное)

С интерактивными элементами.


Очень буду разочарована, если невозможно будет перенести, т. к. Осень с октября, т. е. 4 месяца доводила до ума и опять переходить на новый шаблон с внесенными изменениями будет нереально, тем более нужно добавить гораздо меньше, чем при переходе на новый шаблон.

Еще, из плюсов, картинки в каталогах не надо выравнивать, подвал приличный.
А, минус - нет каруселей Новинки, Хиты, Сопутствующие товары.

Хороший шаблон.

#3 koloskov

koloskov

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

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

Отправлено 26 Февраль 2014 - 08:49

Все таки умеют на SL подарки делать. В предверьи новых тарифов - это суперход. Я всяко дорожаю, поэтому компенсируюсь переходом на этот шаблон.
"Доставкой" занимаетесь? О как нужна индивидуальная привязка к товарам...

#4 sibulba

sibulba

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

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

Отправлено 26 Февраль 2014 - 09:07

отлично) думаю шаблонов хватит)

#5 desbest

desbest

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

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

Отправлено 26 Февраль 2014 - 09:40

Хороший шаблон!
Как сделать возможность добавления товара в избранное?

#6 Castiel

Castiel

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

  • Модераторы
  • 3 519 сообщений
  • ГородНижний Новгород

Отправлено 26 Февраль 2014 - 09:41

Просмотр сообщенияdesbest (26 Февраль 2014 - 09:40) писал:

Хороший шаблон!
Как сделать возможность добавления товара в избранное?

Необходимо авторизоваться (предварительно зарегистрироваться)

#7 desbest

desbest

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

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

Отправлено 26 Февраль 2014 - 10:02

Я имею ввиду у себя на сайте...

#8 sibulba

sibulba

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

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

Отправлено 26 Февраль 2014 - 11:24

когда ждать упомянутый ранее API

#9 xloops

xloops

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

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

Отправлено 26 Февраль 2014 - 13:33

Да когда Апи ждать?

#10 support 2.0

support 2.0

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

  • Модераторы
  • 4 950 сообщений

Отправлено 26 Февраль 2014 - 15:59

Просмотр сообщенияxloops (26 Февраль 2014 - 13:33) писал:

Да когда Апи ждать?

Просмотр сообщенияsibulba (26 Февраль 2014 - 11:24) писал:

когда ждать упомянутый ранее API

Просмотр сообщенияkoloskov (26 Февраль 2014 - 08:49) писал:


"Доставкой" занимаетесь? О как нужна индивидуальная привязка к товарам...
В данной теме форума просьба обсуждать шаблон весна, а не предложения по улучшению. На практике уже было замечено, что начиная обсуждать другую тему, к теме самого раздела не возвращалось, поэтому все подобные вопросы задайте, пожалуйста, в соответствующих разделах. Разработкой API занят определённый человек, пока он ещё в работе. Привязка доставки к индивидуальному товару пока отсутствует в планах разработки на ближайший месяц.

#11 support

support

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

  • Модераторы
  • 3 686 сообщений
  • ГородМосква

Отправлено 26 Февраль 2014 - 18:44

Просмотр сообщенияvelena168 (26 Февраль 2014 - 03:54) писал:

Ого! Интересно, сложно будет на Осень перенести интересные фишки? Коды шаблонов чем-то похожи. Будем пробовать.

Посмотрела все, отметила, что хотелось бы перенести:

1. Модуль избранных товаров
Для этого достаточно вставить ссылки на добавление товара в избранное из нового шаблона, в ваш. Для шаблонов "Товары", "Поиск" и "просмотр акции" код в новом шаблоне выглядит так:
<!-- Если есть возможность добавить товар в избранное -->
{% IF goods.IS_HAS_IN_FAVORITES_LIST %}
  <a class="add_to_wishlist_small add_to_wishlist_small_text added"
	title="Убрать «{goods.NAME}» из избранного"
	href="{FAVORITES_DELETE_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
  >Удалить из избранного</a>
{% ELSE %}
  <a class="add_to_wishlist_small add_to_wishlist_small_text"
	title="Добавить «{goods.NAME}» в избранное"
	href="{FAVORITES_ADD_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
  >Добавить в избранное</a>
{% ENDIF %}
<!-- END Если есть возможность добавить товар в избранное -->
Для вставки кода в других массивах нужно будет изменить в вышеуказанном коде массив
{goods.
на соответствующий тому массиву, в котором отображается код. Например для вставки кода на главной в новинках, нужно будет заменить его на
{index_page_new_goods.
В данном примере код получится таким:
<!-- Если есть возможность добавить товар в избранное -->
{% IF index_page_new_goods.IS_HAS_IN_FAVORITES_LIST %}
  <a class="add_to_wishlist_small add_to_wishlist_small_text added"
	title="Убрать «{index_page_new_goods.NAME}» из избранного"
	href="{FAVORITES_DELETE_URL}?id={index_page_new_goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
  >Удалить из избранного</a>
{% ELSE %}
  <a class="add_to_wishlist_small add_to_wishlist_small_text"
	title="Добавить «{index_page_new_goods.NAME}» в избранное"
	href="{FAVORITES_ADD_URL}?id={index_page_new_goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
  >Добавить в избранное</a>
{% ENDIF %}
<!-- END Если есть возможность добавить товар в избранное -->


Просмотр сообщенияvelena168 (26 Февраль 2014 - 03:54) писал:

2. Добавление товара в сравнение/избранное через ajax запрос в Товаре (Самое главное)
Если нужно будет вставить код, который добавляет товар в избранное через ajax, то в ссылках добавляется некоторая информация, позволяющая удобнее работать с этими ссылками добавления товара в избранное. Для этого мы копируем полный код из нового шаблона в свой. На вышеуказанном примере это код для шаблонов "Товары", "Поиск", "Просмотр акции":
<!-- Если есть возможность добавить товар в избранное -->
{% IF goods.IS_HAS_IN_FAVORITES_LIST %}
  <a class="add_to_wishlist_small add_to_wishlist_small_text added"
	data-action-is-add="0"
	data-action-add-url="{FAVORITES_ADD_URL}"
	data-action-delete-url="{FAVORITES_DELETE_URL}"
	data-action-add-title="Добавить «{goods.NAME}» в избранное"
	data-action-delete-title="Убрать «{goods.NAME}» из избранного"
	data-action-text-add="Добавить в избранное"
	data-action-text-delete="Удалить из избранного"
	title="Убрать «{goods.NAME}» из избранного"
	href="{FAVORITES_DELETE_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
  >Удалить из избранного</a>
{% ELSE %}
  <a class="add_to_wishlist_small add_to_wishlist_small_text"
	data-action-is-add="1"
	data-action-add-url="{FAVORITES_ADD_URL}"
	data-action-delete-url="{FAVORITES_DELETE_URL}"
	data-action-add-title="Добавить «{goods.NAME}» в избранное"
	data-action-delete-title="Убрать «{goods.NAME}» из избранного"
	data-action-text-add="Добавить в избранное"
	data-action-text-delete="Удалить из избранного"
	title="Добавить «{goods.NAME}» в избранное" href="{FAVORITES_ADD_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;return_to={CURRENT_URL | urlencode}"
  >Добавить в избранное</a>
{% ENDIF %}
<!-- END Если есть возможность добавить товар в избранное -->

Единственное нововведение, которое здесь сделал, относительно оригинального кода шаблона - дописал стиль
add_to_wishlist_small_text
и добавил  2 атрибута, на которые нужно менять текст ссылки:
data-action-text-add="Добавить в избранное"
data-action-text-delete="Удалить из избранного"

и в файле main.js, в самый конец файла добавить JS код из нового шаблона:
$(document).ready(function(){
  // Добавление/удаление товара на сравнение/избранное через ajax
  $('.add_to_compare_small, .add_to_wishlist_small').click(function(){
	// Объект ссылки, по которой кликнули
	var
	  a = $(this)
	  ,addUrl = a.attr('data-action-add-url')
	  ,delUrl = a.attr('data-action-delete-url')
	  ,addTitle = a.attr('data-action-add-title')
	  ,delTitle = a.attr('data-action-delete-title')
	  ,isAdd = a.attr('data-action-is-add')
	  requestUrl = a.attr('href')
	;

	if(a.hasClass('add_to_wishlist_small_text') || a.hasClass('add_to_compare_small_text')) {
	  var aText = a;
	} else {
	  var aText = a.parent().find('.add_to_wishlist_small_text, .add_to_compare_small_text')
	}

	// Если в ссылке присутствует идентификатор, который мы можем узнать только вытащив его с текущей страницы
	if( /GET_GOODS_MOD_ID_FROM_PAGE/.test(requestUrl)) {
	  requestUrl = requestUrl.replace(new RegExp('GET_GOODS_MOD_ID_FROM_PAGE'), $('.goodsDataMainModificationId').val());
	}

	// Если есть информация о том какие URL адреса будут изменены, то можено не перегружать страницу и сделать запрос через ajax
	if(addUrl && delUrl) {
	  $.ajax({
		type : "POST",
		dataType: 'json',
		cache : false,
		url : requestUrl,
		data : {
		  'ajax_q': 1
		},
		success: function(data) {
		  if('ok' == data.status) {
			if(isAdd == 1) {
			  var
				from = addUrl
				,to = delUrl
				,newIsAddStatus = 0
				,newTitle = delTitle ? delTitle : ''
			  ;
			  a.addClass('added');
			} else {
			  var
				from = delUrl
				,to = addUrl
				,newIsAddStatus = 1
				,newTitle = addTitle ? addTitle : ''
			  ;
			  a.removeClass('added');
			}

			// Обновляем ссылку, на которую будет уходить запрос и информацию о ней
			a.attr('href', a.attr('href').replace(new RegExp(from), to))
			 .attr('title', newTitle)
			 .attr('data-action-is-add', newIsAddStatus);

			// Если рядом с ссылкой в виде круга есть текстовая надпись с описанием действия
			if(aText.length) {
			  aText.text(aText.attr(isAdd == 1 ? 'data-action-text-delete' : 'data-action-text-add'));
			}

			// Если есть функция, которая отображает сообщения пользователю
			if(typeof(noty) == "function") {
			  noty({
				text:data.message,
				layout:"center",
				type:"success",
				textAlign:"center",
				easing:"swing",
				animateOpen:{"height":"toggle"},
				animateClose:{"opacity":"hide"},
				speed:"500",
				timeout:"3000",
				closable: false,
				modal: false,
				dismissQueue: true,
				onClose: true,
				killer: true});
			}

		  } else if('error' == data.status) {
			// Если есть функция, которая отображает сообщения пользователю
			if(typeof(noty) == "function") {
			  noty({
			  text:data.message,
			  layout:"center",
			  type:"error",
			  textAlign:"center",
			  easing:"swing",
			  animateOpen:{"height":"toggle"},
			  animateClose:{"opacity":"hide"},
			  speed:"500",
			  timeout:"3000",
			  closable: false,
			  modal: false,
			  dismissQueue: true,
			  onClose: true,
			  killer: true});
			}
		  }
		}
	  });

	  return false;
	}
  });
});

Далее, чтобы начали появляться уведомления через фукнцию noty нужно добавить её код, если он не загружен в вашем шаблоне, сделать это не сложно, для удобства использования проще всего будет закачать файл с jquery notification plugin-ом в редактор тем, получив его по ссылке:
http://storeland.ru/js/noty_2_2_2/jquery.noty.packaged.min.js
Если не менять название, то после закачки в редактор тем, останется лишь добавить загрузку файла в шаблоне "HTML", после загрузки остальных скриптов, добавив строчку:
<script type="text/javascript" src="{ASSETS_JS_PATH}jquery.noty.packaged.min.js"></script>
После этого скрипт добавление начнёт работать, вместе со всплывающим окном.

Несколько скриншотов с описанием внедрения этого кода:
favorites_code_1.png
favorites_code_2.jpg
favorites_code_3.jpg
favorites_result.png
favorites_result2.png

Для внедрения сравнения, чтобы работал подобным образом аналогично копируется код из шаблона (в нём я уже добавил новый стиль и 2 атрибута):
<!-- Если в тарифном плане подключен модуль сравнения товаров и он не выключен в настройках магазина -->
{% IF TARIFF_FEATURE_GOODS_COMPARE && SETTINGS_COMPARE_DISABLE=0 %}
  {% IF goods.IS_HAS_IN_COMPARE_LIST %}
	<a class="add_to_compare_small add_to_compare_small_text added" 
	  data-action-is-add="0" 
	  data-action-add-url="{COMPARE_ADD_URL}"
	  data-action-delete-url="{COMPARE_DELETE_URL}"
	  data-action-add-title="Добавить «{goods.NAME}» в список сравнения с другими товарами"
	  data-action-delete-title="Убрать «{goods.NAME}» из списка сравнения с другими товарами"
	  data-action-text-add="Сравнить"
	  data-action-text-delete="Не сравнивать"
	  title="Убрать «{goods.NAME}» из списка сравнения с другими товарами"
	  href="{COMPARE_DELETE_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;from={goods.GOODS_FROM}&amp;return_to={CURRENT_URL | urlencode}"
	>Не сравнивать</a>
  {% ELSE %}
	<a class="add_to_compare_small add_to_compare_small_text" 
	  data-action-is-add="1" 
	  data-action-add-url="{COMPARE_ADD_URL}" 
	  data-action-delete-url="{COMPARE_DELETE_URL}" 
	  data-action-add-title="Добавить «{goods.NAME}» в список сравнения с другими товарами" 
	  data-action-delete-title="Убрать «{goods.NAME}» из списка сравнения с другими товарами" 
	  data-action-text-add="Сравнить"
	  data-action-text-delete="Не сравнивать"
	  title="Добавить «{goods.NAME}» в список сравнения с другими товарами" 
	  href="{COMPARE_ADD_URL}?id={goods.MIN_PRICE_NOW_ID}&amp;from={goods.GOODS_FROM}&amp;return_to={CURRENT_URL | urlencode}"
	>Сравнить</a>
  {% ENDIF %}
{% ENDIF %}
<!-- END Если в тарифном плане подключен модуль сравнения товаров и он не выключен в настройках магазина -->
Остальные действия аналогичный предыдущим. Если Вы уже добавили код избранных товаров, то добавление и изменение javascript кода делать второй раз не потребуется.

Пара скриншотов:
compare_code.png
compare_result.png

Финальной частью добавление модуля будет добавление шаблона со списком избранных товаров покупателя в личный кабинет из нового шаблона в старый. Для этого достаточно скачать архив с шаблоном:
Прикрепленный файл  client_favorites_list.zip   1,88К   585 Количество загрузок:
Распаковать его у себя на компьютере и закачать его в редактор шаблонов. После этого в блоке "Шаблоны" появится новый файл "ЛК  Избранные товары", в котором будут отображаться избранные товары покупателя.

Скриншоты:
favorites_lk_code.png
favorites_lk_result.png

Стили понятное дело не соответствуют текущему шаблону, в которой производится перенос, но выглядит достойно, по крайней мере в текущем формате без изменений. При желании можно стилизовать эту страницу глубже, чтобы она ещё больше подходила для вашей дизайн темы.

#12 velena168

velena168

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

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

Отправлено 26 Февраль 2014 - 18:48

Вот, спасибо большое. С удовольствием, буду пробовать.

#13 velena168

velena168

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

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

Отправлено 26 Февраль 2014 - 19:28

Просмотр сообщенияsupport (26 Февраль 2014 - 18:44) писал:

Далее, чтобы начали появляться уведомления через фукнцию noty нужно добавить её код, если он не загружен в вашем шаблоне, сделать это не сложно, для удобства использования проще всего будет закачать файл с jquery notification plugin-ом в редактор тем, получив его по ссылке:
http://storeland.ru/js/noty_2_2_2/jquery.noty.packaged.min.js
Что-то мне по этой ссылке ничего не получить...

#14 support

support

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

  • Модераторы
  • 3 686 сообщений
  • ГородМосква

Отправлено 26 Февраль 2014 - 21:15

Просмотр сообщенияvelena168 (26 Февраль 2014 - 19:28) писал:

Что-то мне по этой ссылке ничего не получить...
Пропустил один символ, правильный адрес такой:
http://storeland.ru/js/noty_2_2_2/jquery.noty.packaged.min.js


#15 velena168

velena168

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

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

Отправлено 26 Февраль 2014 - 21:55

Просмотр сообщенияsupport (26 Февраль 2014 - 21:15) писал:

Пропустил один символ, правильный адрес такой:
http://storeland.ru/js/noty_2_2_2/jquery.noty.packaged.min.js
В каталоге почти получилось, но всплывающего окна нет, что товар успешно добавлен в избранное и, если не авторизирован, то тоже нет окна предупреждения, что добавлять в избранное могут только авторизированные пользователи, т. е. ничего не происходит.

Страница избранного появилась, но без названия почему-то.

А вот в карточке Товара, совсем ничего не получилось, только ссылка недействующая появилась.

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

  • Снимок.PNG
  • Снимок1.PNG
  • Снимок2.PNG


#16 support

support

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

  • Модераторы
  • 3 686 сообщений
  • ГородМосква

Отправлено 26 Февраль 2014 - 23:23

Просмотр сообщенияvelena168 (26 Февраль 2014 - 21:55) писал:

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

Просмотр сообщенияvelena168 (26 Февраль 2014 - 21:55) писал:

Страница избранного появилась, но без названия почему-то.
В новом шаблоне похоже, что нет названия для этой страницы в виде стандартного H1 блока. В вашем же шаблоне такая надпись в других разделах присутствует. Для того чтобы дописать заголовок, думаю будет достаточно вставить в шаблоне "ЛК Избранные товары" в самом начале файла код отображения навигации и заголовка, например так:
<div class="breadcrumb">
  <a href="http://{NET_DOMAIN}/" title="Перейти на главную">Главная</a>
  <span class="navigation-pipe"></span>
  <a href="{USER_SETTINGS_URL}" title="Личный кабинет">Личный кабинет</a>
  <span class="navigation-pipe"></span>
  Избранные товары
</div>
<div class="page-title">
  <h1>Избранные товары</h1>
</div>


Просмотр сообщенияvelena168 (26 Февраль 2014 - 21:55) писал:

А вот в карточке Товара, совсем ничего не получилось, только ссылка недействующая появилась.
Думаю всё дело в том, что Вы вставляете в карточке товара код, предназначенный для списка товаров. В вашем случае его лучше всего копировать целиком из нового шаблона, чтобы всё работало как надо. Пример такого кода для шаблона "Товар" следующий:
<!-- Если есть возможность добавить товар в избранное -->
{% IF GOODS_MOD_IS_HAS_IN_FAVORITES_LIST %}
  <a class="add_to_wishlist_small add_to_wishlist_small_text added"
	data-action-is-add="0"
	data-action-add-url="{FAVORITES_ADD_URL}"
	data-action-delete-url="{FAVORITES_DELETE_URL}"
	data-action-add-title="Добавить &laquo;{GOODS_NAME}&raquo; в избранное"
	data-action-delete-title="Убрать &laquo;{GOODS_NAME}&raquo; из избранного"
	data-action-text-add="Добавить в избранное"
	data-action-text-delete="Удалить из избранного"
	title="Убрать &laquo;{GOODS_NAME}&raquo; из избранного"
	href="{FAVORITES_DELETE_URL}?id={GOODS_MOD_ID}&amp;return_to={CURRENT_URL | urlencode}"
  >Удалить из избранного</a>
{% ELSE %}
  <a class="add_to_wishlist_small add_to_wishlist_small_text"
	data-action-is-add="1"
	data-action-add-url="{FAVORITES_ADD_URL}"
	data-action-delete-url="{FAVORITES_DELETE_URL}"
	data-action-add-title="Добавить &laquo;{GOODS_NAME}&raquo; в избранное"
	data-action-delete-title="Убрать &laquo;{GOODS_NAME}&raquo; из избранного"
	data-action-text-add="Добавить в избранное"
	data-action-text-delete="Удалить из избранного"
	title="Добавить &laquo;{GOODS_NAME}&raquo; в избранное" href="{FAVORITES_ADD_URL}?id={GOODS_MOD_ID}&amp;return_to={CURRENT_URL | urlencode}"
  >Добавить в избранное</a>
{% ENDIF %}
<!-- END Если есть возможность добавить товар в избранное -->


#17 velena168

velena168

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

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

Отправлено 27 Февраль 2014 - 00:00

Просмотр сообщенияsupport (26 Февраль 2014 - 23:23) писал:

Поправил код вашего шаблона, там был пропуск буквы, видимо скопировали код до того момента, как я изменил сообщение выше.


В новом шаблоне похоже, что нет названия для этой страницы в виде стандартного H1 блока. В вашем же шаблоне такая надпись в других разделах присутствует. Для того чтобы дописать заголовок, думаю будет достаточно вставить в шаблоне "ЛК Избранные товары" в самом начале файла код отображения навигации и заголовка, например так:
<div class="breadcrumb">
<a href="http://{NET_DOMAIN}/" title="Перейти на главную">Главная</a>
<span class="navigation-pipe"></span>
<a href="{USER_SETTINGS_URL}" title="Личный кабинет">Личный кабинет</a>
<span class="navigation-pipe"></span>
Избранные товары
</div>
<div class="page-title">
<h1>Избранные товары</h1>
</div>



Думаю всё дело в том, что Вы вставляете в карточке товара код, предназначенный для списка товаров. В вашем случае его лучше всего копировать целиком из нового шаблона, чтобы всё работало как надо. Пример такого кода для шаблона "Товар" следующий:
<!-- Если есть возможность добавить товар в избранное -->
{% IF GOODS_MOD_IS_HAS_IN_FAVORITES_LIST %}
<a class="add_to_wishlist_small add_to_wishlist_small_text added"
data-action-is-add="0"
data-action-add-url="{FAVORITES_ADD_URL}"
data-action-delete-url="{FAVORITES_DELETE_URL}"
data-action-add-title="Добавить &laquo;{GOODS_NAME}&raquo; в избранное"
data-action-delete-title="Убрать &laquo;{GOODS_NAME}&raquo; из избранного"
data-action-text-add="Добавить в избранное"
data-action-text-delete="Удалить из избранного"
title="Убрать &laquo;{GOODS_NAME}&raquo; из избранного"
href="{FAVORITES_DELETE_URL}?id={GOODS_MOD_ID}&amp;return_to={CURRENT_URL | urlencode}"
>Удалить из избранного</a>
{% ELSE %}
<a class="add_to_wishlist_small add_to_wishlist_small_text"
data-action-is-add="1"
data-action-add-url="{FAVORITES_ADD_URL}"
data-action-delete-url="{FAVORITES_DELETE_URL}"
data-action-add-title="Добавить &laquo;{GOODS_NAME}&raquo; в избранное"
data-action-delete-title="Убрать &laquo;{GOODS_NAME}&raquo; из избранного"
data-action-text-add="Добавить в избранное"
data-action-text-delete="Удалить из избранного"
title="Добавить &laquo;{GOODS_NAME}&raquo; в избранное" href="{FAVORITES_ADD_URL}?id={GOODS_MOD_ID}&amp;return_to={CURRENT_URL | urlencode}"
>Добавить в избранное</a>
{% ENDIF %}
<!-- END Если есть возможность добавить товар в избранное -->
Спасибо, большое. Окно зелененькое появилось. Ой, красное тоже. Спасибо. Буду ТОВАР исправлять.

#18 velena168

velena168

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

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

Отправлено 27 Февраль 2014 - 00:19

Ура, спасибо, все получилось.

А, может быть, можно такую красивую крутящуюся корзинку на кнопку КУПИТЬ в ТОВАРЕ прикрутить?
Уж, очень она симпатичная.

P. S.  Кнопки в Избранное и Сравнить ПОЛУЧИЛИСЬ, а КУПИТЬ и В КОРЗИНУ - нет.

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

  • Снимок5.PNG
  • Снимок.PNG


#19 sengun

sengun

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

  • Модератоpы
  • 1 139 сообщений
  • ГородНижний Новгород

Отправлено 27 Февраль 2014 - 14:50

Просмотр сообщенияvelena168 (27 Февраль 2014 - 00:19) писал:

Ура, спасибо, все получилось.

А, может быть, можно такую красивую крутящуюся корзинку на кнопку КУПИТЬ в ТОВАРЕ прикрутить?
Уж, очень она симпатичная.

P. S.  Кнопки в Избранное и Сравнить ПОЛУЧИЛИСЬ, а КУПИТЬ и В КОРЗИНУ - нет.
Здравствуйте.
Кручение этих кнопок основано на стилях, которые поворачивают элемент при наведении на него мышкой. Поэтому картинку корзины фоновой для кнопки(как это есть сейчас) делать не стоит, но надо вставить эту картинку рядом и подвинуть правее, чтобы она была как раз над кнопкой "купить".
В шаблоне "Товар" замените
<p id="add_to_cart"> <input type="submit" name="Submit" value="{% IF GOODS_MOD_REST_VALUE=300 || GOODS_MOD_REST_VALUE=100 %}Заказать{% ELSEIF GOODS_MOD_REST_VALUE=0 %}Невозможно заказать{% ELSE %}Купить{% ENDIF%}" class="add_to_cart" onclick="$('.goodsDataForm').submit()"></p>
на такой код
						 <p id="add_to_cart">
						 <img src="{ASSETS_IMAGES_PATH}cart_white.png"/>
						 <input type="submit" name="Submit" value="{% IF GOODS_MOD_REST_VALUE=300 || GOODS_MOD_REST_VALUE=100 %}Заказать{% ELSEIF GOODS_MOD_REST_VALUE=0 %}Невозможно заказать{% ELSE %}Купить{% ENDIF%}" class="add_to_cart" onclick="$('.goodsDataForm').submit()">
						 </p>
вместо cart_white.png вставьте имя другой картинки, которую надо загрузить в разделе "Редактор шаблонов", если требуется.
В style.css найдите код
.add_to_cart{display:block;background-color:#da3b44;background-image:url('{ASSETS_IMAGES_PATH}cart_white.png');background-repeat:no-repeat;background-position:13px 50%;
color:#fafafa!important;height:35px;padding:0 16px 0 46px;*padding:0 6px 0 36px;border:1px solid #a40f18;*border: none;cursor:pointer;font-weight:700;line-height:30px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;border-radius:2px;
-moz-border-radius:2px;-webkit-border-radius:16px;box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2);-moz-box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2);
-webkit-box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2)}
замените на такой
.add_to_cart{display:inline-block;background-color:#da3b44; color:#fafafa!important;height:35px;padding:0 16px 0 46px;*padding:0 6px 0 36px;
border:1px solid #a40f18;*border: none;cursor:pointer;font-weight:700;line-height:30px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;border-radius:2px;
-moz-border-radius:2px;-webkit-border-radius:16px;box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2);-moz-box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2);
-webkit-box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2)}
в конец style.css добавьте код
#add_to_cart img {
display: inline;
margin-right: -32px;
margin-bottom: -3px;
position: relative;
transition: all 0.5s ease 0s;
z-index: 2;
cursor: pointer;
}
#add_to_cart img:hover {
transform: rotate(360deg);
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
}
Также следует добавить скрипт, чтобы при нажатии на эту картинку, товар добавлялся в корзину. В main.js добавьте в конец
$(document).ready(function(){
$('#add_to_cart img').click(function(){
	 $('input.add_to_cart').click();
});
});


#20 velena168

velena168

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

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

Отправлено 27 Февраль 2014 - 15:48

Просмотр сообщенияsengun (27 Февраль 2014 - 14:50) писал:

Здравствуйте.
Кручение этих кнопок основано на стилях, которые поворачивают элемент при наведении на него мышкой. Поэтому картинку корзины фоновой для кнопки(как это есть сейчас) делать не стоит, но надо вставить эту картинку рядом и подвинуть правее, чтобы она была как раз над кнопкой "купить".
В шаблоне "Товар" замените
<p id="add_to_cart"> <input type="submit" name="Submit" value="{% IF GOODS_MOD_REST_VALUE=300 || GOODS_MOD_REST_VALUE=100 %}Заказать{% ELSEIF GOODS_MOD_REST_VALUE=0 %}Невозможно заказать{% ELSE %}Купить{% ENDIF%}" class="add_to_cart" onclick="$('.goodsDataForm').submit()"></p>
на такой код
						 <p id="add_to_cart">
						 <img src="{ASSETS_IMAGES_PATH}cart_white.png"/>
						 <input type="submit" name="Submit" value="{% IF GOODS_MOD_REST_VALUE=300 || GOODS_MOD_REST_VALUE=100 %}Заказать{% ELSEIF GOODS_MOD_REST_VALUE=0 %}Невозможно заказать{% ELSE %}Купить{% ENDIF%}" class="add_to_cart" onclick="$('.goodsDataForm').submit()">
						 </p>
вместо cart_white.png вставьте имя другой картинки, которую надо загрузить в разделе "Редактор шаблонов", если требуется.
В style.css найдите код
.add_to_cart{display:block;background-color:#da3b44;background-image:url('{ASSETS_IMAGES_PATH}cart_white.png');background-repeat:no-repeat;background-position:13px 50%;
color:#fafafa!important;height:35px;padding:0 16px 0 46px;*padding:0 6px 0 36px;border:1px solid #a40f18;*border: none;cursor:pointer;font-weight:700;line-height:30px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;border-radius:2px;
-moz-border-radius:2px;-webkit-border-radius:16px;box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2);-moz-box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2);
-webkit-box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2)}
замените на такой
.add_to_cart{display:inline-block;background-color:#da3b44; color:#fafafa!important;height:35px;padding:0 16px 0 46px;*padding:0 6px 0 36px;
border:1px solid #a40f18;*border: none;cursor:pointer;font-weight:700;line-height:30px;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;border-radius:2px;
-moz-border-radius:2px;-webkit-border-radius:16px;box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2);-moz-box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2);
-webkit-box-shadow:inset 0 1px 0 0 rgba(255,255,255,0.15),0 1px 1px 0 rgba(0,0,0,0.2)}
в конец style.css добавьте код
#add_to_cart img {
display: inline;
margin-right: -32px;
margin-bottom: -3px;
position: relative;
transition: all 0.5s ease 0s;
z-index: 2;
cursor: pointer;
}
#add_to_cart img:hover {
transform: rotate(360deg);
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
}
Также следует добавить скрипт, чтобы при нажатии на эту картинку, товар добавлялся в корзину. В main.js добавьте в конец
$(document).ready(function(){
$('#add_to_cart img').click(function(){
	 $('input.add_to_cart').click();
});
});
Большое спасибо, sengun, все легко и отлично получилось.
Теперь моя Осень стала немного весенней. Пока, наверное, моему сайту хватит наворотов... Хотя, кто знает, может нам еще чего-нибудь интересного предложат. Спасибо, всем.





Темы с аналогичным тегами обновления, шаблоны, бесконечный скороллинг, быстрый заказ, избранные товары

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

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