Templates kachalova 2014_new

13

description

Работа с шаблонами на InSales

Transcript of Templates kachalova 2014_new

Page 1: Templates kachalova 2014_new
Page 2: Templates kachalova 2014_new

• GET-запрос на URL /collection/any_collection

• Наличие collection в URL? Значит используем шаблон «категория»

• Берем из базы данные о категории any_collection

• Расставляем данные по шаблону, как нам сказал разработчик шаблона

• Отдаем то, что получилось

• Кешируем!

Page 3: Templates kachalova 2014_new

• Используйте клиентские языки + liquid

• Используйте шаблоны по назначению

• Не используйте в качестве счетчика цикла и не переопределяйте переменную, уже определенную в текущем шаблоне (collection в шаблоне Категория)

• Используйте набор переменных и объектов. Редактор не позволит сохранить шаблон, если нарушен порядок тегов liquid’а

Page 4: Templates kachalova 2014_new

• Загрузка темы

• Сохранение темы

• Копирование (с предпросмотром)

• Редактирование

• Бекапы

Page 5: Templates kachalova 2014_new

Скрипты, стили, файлы

Settings.html – настройки

Сниппеты

Шаблоны

Page 6: Templates kachalova 2014_new

1. Объект settings – методы определяются атрибутами name формы из settings.html.

2. Объект можно использовать в любом шаблоне, а также в файлах *.js.liquid, *.css.liquid

3. Пример использования –

{% if settings.show_text %}{{ blocks.smth.content }}{% endif %}

Page 7: Templates kachalova 2014_new

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

Page 8: Templates kachalova 2014_new

• Описывает все, что находится на всех страницах (подвал, шапка, сайдбары, 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

Page 9: Templates kachalova 2014_new

• Описывает страницы, содержащие в 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-функции поддерживает кроссдоменные запросы (полезно для создания виджетов для вставки на внешние сайты)

Page 10: Templates kachalova 2014_new

• Описывает страницы, содержащие в 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 (не кешируется, в отличие от страницы)

Page 11: Templates kachalova 2014_new

• Описывает страницу /cart_items

• Методы• items (item == variant!)

• coupon

• discounts

• Есть JSON, на который можно отправлять GET и POST-запросы

Page 12: Templates kachalova 2014_new

• Шаблоны ЛК и чекаута не редактируются (пока)

• НО! Можно менять css - custom_checkout.css

• Есть поле для вставки любого кода на все страницы (в т.ч. js), в т.ч.

действует на страницы ЛК и чекаута, код вставляется перед закрывающим

body (требуются права администратора)

• Есть поле для кода на странице «Спасибо за заказ!», можно использовать

все методы объекта order (наследует все методы объекта cart + имеет

несколько своих, в т.ч. number, pay_url, fulfillment_status, client и т.д.),

вставляется после открывающего body (требуются права администратора)

Page 13: Templates kachalova 2014_new

• Письмо покупателю о заказе

• Письмо владельцу магазина о новом заказе

• Печатная форма заказа

• Уведомление покупателю о регистрации

• Можно использовать объект order и все его методы

• Требуется доступ к разделу Заказы (редактирование)