Templates kachalova 2014_new
description
Transcript of Templates kachalova 2014_new
• GET-запрос на URL /collection/any_collection
• Наличие collection в URL? Значит используем шаблон «категория»
• Берем из базы данные о категории any_collection
• Расставляем данные по шаблону, как нам сказал разработчик шаблона
• Отдаем то, что получилось
• Кешируем!
• Используйте клиентские языки + liquid
• Используйте шаблоны по назначению
• Не используйте в качестве счетчика цикла и не переопределяйте переменную, уже определенную в текущем шаблоне (collection в шаблоне Категория)
• Используйте набор переменных и объектов. Редактор не позволит сохранить шаблон, если нарушен порядок тегов liquid’а
• Загрузка темы
• Сохранение темы
• Копирование (с предпросмотром)
• Редактирование
• Бекапы
Скрипты, стили, файлы
Settings.html – настройки
Сниппеты
Шаблоны
1. Объект settings – методы определяются атрибутами name формы из settings.html.
2. Объект можно использовать в любом шаблоне, а также в файлах *.js.liquid, *.css.liquid
3. Пример использования –
{% if settings.show_text %}{{ blocks.smth.content }}{% endif %}
http://wiki.insales.ru/wiki/Liquid
• {% теги – логика построения страницы на основе значений переменных %}
• {{ вывод данных в код страницы }}
• product.title | фильтр – преобразование данных из product.title (можно использовать несколько фильтров)
Теги:
• For ({% for col in collections %})
• If ({% if characteristic.handle == ‘new’ %})
• Tablerow ({% tablerow products by 3 %})
• Assign ({% assign curr_prod = product %}, можно использовать фильтры)
• Capture ({% capture im_title%}img_{{product.title}}.jpg{% endcapture %})
• Comment
• Описывает все, что находится на всех страницах (подвал, шапка, сайдбары, head, …)
• Контент страниц содержится в строковой переменной content_for_layout
• Самые полезные переменные:• template• keywords• description• title• cart_url
• Объекты• block_lists• linklists• collections• cart• blog• account• client
• Полная иерархия объектов и связи между ними:
http://wiki.insales.ru/wiki/Variables
http://wiki.insales.ru/wiki/Objects
• Описывает страницы, содержащие в URL ‘/collection/’
• Объект collection определен!
• Методы:• properties• options• products• subcollections• meta_description• meta_description• page_title
• Специальный тег paginate ({% paginate products by 21 %})
• Полезное свойство внутри paginate – current_page ({% if paginate['current_page'] == 1 %})
• Возможные параметры GET-запросов:• ?order={price, descending_price, title, age}• ?page_size={num до 100!}• ?characteristics[]={{characteristic.id}} (можно несколько, в т.ч. от одного property)• ?options[{{option.id}}][] ={{value.id}} (можно несколько, в т.ч. от одного option)• ?price_min={num}, ?price_max={num}• ?q={string} (поисковый запрос)
• Есть JSON, при наличии callback-функции поддерживает кроссдоменные запросы (полезно для создания виджетов для вставки на внешние сайты)
• Описывает страницы, содержащие в URL ‘/product/’
• Объект product определен!
• Если в URL также содержится ‘/collection/’, то и объект collection определен
• Методы:• available• images
• small_url (48Х48)• thumb_url (100x100) • compact_url (160x160) • medium_url (240x240) • large_url (480x480) • original_url - оригинальное
• variants• price• sku• quantity• option_values
• Тоже есть JSON (не кешируется, в отличие от страницы)
• Описывает страницу /cart_items
• Методы• items (item == variant!)
• coupon
• discounts
• Есть JSON, на который можно отправлять GET и POST-запросы
• Шаблоны ЛК и чекаута не редактируются (пока)
• НО! Можно менять css - custom_checkout.css
• Есть поле для вставки любого кода на все страницы (в т.ч. js), в т.ч.
действует на страницы ЛК и чекаута, код вставляется перед закрывающим
body (требуются права администратора)
• Есть поле для кода на странице «Спасибо за заказ!», можно использовать
все методы объекта order (наследует все методы объекта cart + имеет
несколько своих, в т.ч. number, pay_url, fulfillment_status, client и т.д.),
вставляется после открывающего body (требуются права администратора)
• Письмо покупателю о заказе
• Письмо владельцу магазина о новом заказе
• Печатная форма заказа
• Уведомление покупателю о регистрации
• Можно использовать объект order и все его методы
• Требуется доступ к разделу Заказы (редактирование)