Документация
В разработке...
Блоки
Блоки используются для хранения информации, которую можно вывести в определенном месте шаблона. При обновлении шаблона вам не придется восстанавливать ключевую информацию повторно.
В шаблоне «Дизайн со вкусом PRO» определены следующие блоки:
- site.contacts - блок телефонов в шапке сайта (столбец 1)
- site.contacts2 - блок телефонов в шапке сайта (столбец 2)
- site.footer - блок контактной информации в подвале сайта
- site.copyright - блок копирайта
- shop.about - блок текст «О компании» на главной странице магазина
- head - блок для вывода кода в разделе <head></head>
- body_after - блок для вывода кода перед закрывающим </body>
Добавление блока
Для добавление блока необходимо выполнить следующие действия (см. рисунок):
- Перейти в приложение «Сайт»
- Раздел «Блоки»
- Жмем на Новый блок
- Вводим ID блока
- Вводим текст блока

site.contacts
site.contacts выводит телефоны в шапке сайта. Пример стандартного кода блока site.contacts приведен ниже:
{* КОД ДЛЯ ШАПКИ 1 *}
{* произвольный текст *}
<li>24/7 Поддержка</li>
{if $wa->shop}
{* телефон из настроек *}
<li><a href="tel:+79999999">{$wa->shop->settings("phone")}</a></li>
{/if}
{* КОД ДЛЯ ШАПОК 2-4 *}
{if $wh = $wa->shop->settings("workhours")}
<li class="fs-13em">
<span class="fw-7">{$wh.days_from_to}</span>{if $wh.hours_from && $wh.hours_to} {$wh.hours_from}—{$wh.hours_to}{/if}
</li>
{/if}
<li class="fs-13em"><a href="mailto:{$wa->shop->settings('email')}">{$wa->shop->settings('email')}</a></li>
site.contacts2
site.contacts2 выводит телефоны в шапке 2,3,4 сайта во втором столбце. Пример стандартного кода блока site.contacts2 приведен ниже:
{* ТЕЛЕФОН ИЗ НАСТРОЕК *}
{if $wa->shop}
<li class="fs-20em fw-7"><a href="tel:{$wa->shop->settings('phone')|regex_replace:'/[^0-9\+]/':''}">{$wa->shop->settings("phone")}</a></li>
{/if}
<li class="fs-12em">Бесплатный звонок с 8:00 до 22:00</li>
site.footer
site.footer выводит контактную информацию в подвале сайта. Пример стандартного кода блока site.footer приведен ниже.
{if $wa->shop}
<li class="text-nowrap"><i class="mi mi-phone"></i> {$wa->shop->settings("phone")}</li>
<li class="text-nowrap"><i class="mi mi-email"></i> <a href="mailto:{$wa->shop->settings('email')}">{$wa->shop->settings("email")}</a></li>
{if $wh = $wa->shop->settings("workhours")}
<li>
<i class="mi mi-access-time"></i>
{$wh.days_from_to}{if $wh.hours_from && $wh.hours_to} {$wh.hours_from}—{$wh.hours_to}{/if}
</li>
{/if}
{/if}
<li><br>Москва, ТРЦ Парк хаус,</li>
<li>Автозаводское шоссе, 6</li>
site.copyright
site.copyright выводит текст копирайта в подвале магазина. Пример стандартного кода блока site.copyright приведен ниже:
© {$wa->accountName()}, {time()|wa_datetime:"Y"}. Все права защищены. <a href="#">Политика конфиденциальности</a>
shop.about
shop.about выводит текст о компании на главной странице магазина. Пример стандартного кода блока shop.about приведен ниже:
<h1>{$wa->shop->settings('name')}</h1>
<div class="xAboutTag gray">Слоган</div>
<hr>
<p>{$wa->shop->settings('name')} - это креативное агенство, которая давно зарекомендовала себя как надежного разработчика тем дизайна. Мы обладаем большим количеством опыта в создании интернет-магазинов на базе PHP-фреймворка Webasyst. Мы разрабатываем только качественные продукты.</p>
<p>Спасибо что выбрали нас!</p>
<a href="#">Далее</a>
shop.primary_nav
shop.primary_nav выводит код в навигации шапок 2, 4 рядом с категориями с параметром primary=1. Пример кода блока shop.primary_nav приведен ниже:
<li>
<a href="#ссылка">Пункт меню</a>
</li>
<li class="dropdown">
<a href="#ссылка">Выпадающий список</a>
<ul class="dropdown-menu">
<li><a href="#ссылка">Пукнт 1</a></li>
<li><a href="#ссылка">Пукнт 2</a></li>
<li><a href="#ссылка">Пукнт 3</a></li>
<li class="dropdown-submenu">
<a href="#ссылка">Пукнт 4</a>
<ul class="dropdown-menu">
<li><a href="#ссылка">Пукнт 4_1</a></li>
<li><a href="#ссылка">Пукнт 4_2</a></li>
<li><a href="#ссылка">Пукнт 4_3</a></li>
<li><a href="#ссылка">Пукнт 4_4</a></li>
</ul>
</li>
</ul>
</li>
head
head выводит код в разделе <head></head>. Блок можно использовать для вывода своих стилей и скриптов. Пример кода блока head приведен ниже:
<style>
/* свои CSS стили */
</style>
<script>
/* свой javascript */
</script>
body_after
body_after выводит код перед закрывающим тегом </body>. Блок можно использовать для вывода счетчиков. Пример кода блока body_after приведен ниже:
{literal}код счетчика{/literal}
body_before
body_after выводит код после открывающего тега <body>. Блок можно использовать для вывода информации до вывода остального макета. Пример кода блока body_before приведен ниже:
<div class="container-fluid text-center">Текст блока</div>
Общие настройки
Структура сайта
Структуру сайта можно изменить в «Сайт» → Структура. Примерную структуру сайта можно посмотреть на следующем рисунке:.

Авторизация
Для включение авторизации выполните следующую последовательность действий:
- Перейти в приложение «Сайт»
- Личный кабинет
- Настройки авторизации
- Включить
Меню страниц
По умолчанию меню страниц формируется из страниц приложения «Магазин». Для добавления пунктов меню выполните последовательность действий:
- Перейти в приложение «Магазин» или «Сайт» в зависимости от настроек темы
- Страницы
- Жмем на Сохранить рядом с необходимым поселением, заполняем форму и жмем
Для скрытия страницы из меню, необходимо добавить дополнительный параметр в настройках страницы:
- Выбираем необходимую страницу
- Жмем «Настройки страницы»
- В поле Дополнительные параметры страницы
hidden=1
- Жмем Сохранить
Для вывода страниц из другого приложения, необходимо изменить значение настройки Ссылки в верхнем меню в разделе 1. Сайт - Ссылки в верхнем меню
Меню приложений
Для редактирования меню приложений выполните последовательность действий:
- Перейдите в приложение «Сайт»
- Настройки
- Настроить
- Редактируем
- Жмем Сохранить
Меню категорий
Каталог формируется из категорий приложения «Магазин». Чтобы добавить категорию, выполните следующие действия:
- Перейдите в приложение «Магазин»
- Вкладка «Товары»
- Жмем на Сохранить , заполняем форму и нажимаем
Параметры категории для навигации
Параметр | Описание и возможные значения | Пример |
col Мегаменю |
Параметр необходим для оформления «Мегаменю». Для категории 1 уровня создает «Мегаменю» из дочерних элементов. Достаточно указать col=1, на ширину это не повлияет.
Для категории 2 уровня задает ширину блока. Параметр меняет свое значение от 1 до 12. Значение по умолчанию 3.
Рекомендуемые значение:
3 - 25% 4 - 33% 6 - 50% 12 - 100% |
col=3 |
split Мегаменю |
Для категории 2 уровня, разбивает дочерние элементы на несколько колонок.
К примеру, есть категори 2 уровня Марка авто, у нее 12 подкатегорий с марками авто(Лада, Тойота, БМВ...) 3 уровня. Задача: вывести категорию Марка авто в 3 колонки, т.е. по 4 подкатегории в каждой |
col=4 split=3 |
primary Шапка 2, 4 |
Для категории 1 уровня выводит их дополнительно рядом с каталогом товара в навигации. Параметр может быть использован для того, чтобы выделить определенные категории. |
primary=1 |
multicolumn Шапка 2, 4 |
Указывается для категории первого уровня. Изменяет колиство колонок в выпадающем меню. Принимает значения от 2 до 4. По умолчанию: 2 |
multicolumn=3 пример использования |
endcol Шапка 2, 4 |
Указывается для категории второго уровня. Определяет после какой категории, будет перенос на следующую колонку. |
endcol=1 |
Загрузка файлов
Некоторые настройки темы дизайна требуют указание ссылок на картинку. Для загрузки файлов выполните следующие действия:
- Перейдите в приложение «Сайт»
- Файл-менеджер
- Нажмите на загрузить файлы
Обратная связь
Для работы формы обратной связи необходимо в приложении с адресом /*(В большинстве случаев это Магазин) создать страницу с адресом feedback и содержимым блока, который у вас есть по умолчанию в приложении Сайт {$wa->block("site.send_email_form")}
- Перейдите к страницам корневого приложения Сайт → Страницы или Магазин → Витрина → Страницы
- Создайте страницу с адресом feedback и содержимым {$wa->block("site.send_email_form")}
Социальные сети
Вконтакте
Для вывода виджета требуется указать идентификатор сообщества в настройках темы раздел 1.5
Для того чтобы узнать идентификатор, необходимо перейти на страницу группы и нажать на количество сообщений на стене группы.
Далее скопируйте идентификатор группы из адресной строки браузера
Одноклассники
Для вывода виджета требуется указать идентификатор сообщества в настройках темы раздел 1.7
- Зайдите на свою группу в одноклассниках
- В меню слева выберите пункт "Изменить настройки"
- Далее увидите текст "ID этой группы в одноклассниках" и номер ID группы
Для вывода виджета требуется указать ссылку на страницу (не группу) сообщества в настройках темы раздел 1.6
Для вывода виджета требуется указать Имя пользователя и Идентификатор виджета Twitter в разделе 1.8
Чтобы узнать Идентификатор виджета необходимо:
- Перейти в настройки twitter'а
- Виджеты
- Создать
После создания виджета, перейдите на страницу виджета и в адресной строке браузера скопируйте идентификатор после widgets/.
Для вывода виджета требуется указать идентификатор пользователя, CLIENT ID и access token в настройках темы раздел 1.9
Для того чтобы узнать идентификатор пользователя необходимо пройти по ссылке https://smashballoon.com/instagram-feed/find-instagram-user-id/, заполнить форму и нажать get instagram user id.
Чтобы получить access token перейдите по ссылке http://instagram.pixelunion.net/ и нажмите Generate Access Token.
Далее перейдите по ссылке http://instagram.com/developer/, чтобы зарегистрировать плагин в инстаграме как приложение и предоставить ему доступ к вашим фотографиям. Нажмите на кнопку «Register Your Application».
Поле «Application Name» нужно только для вашего удобства, поэтому вы можете ввести туда адрес сайта, на который собираетесь выгружать фотографии вашего аккаунта. Например, materialdesign.pro .
В поле «Description» можете ввести любой текст.
В поле «Website» введите адрес вашего сайта. В поле «Valid redirect URIs» вставьте строку http://instagram.com/ваш_логин?modal=true, где вместо ваш_логин вам, соответственно, нужно ввести ваш логин в инстаграме.
Далее жмём на кнопку «Register» и, если всё правильно сделали, получаем сообщение об успешной регистрации, из которого берем CLIENT ID
Магазин
Слайдер
В настройках темы раздел 2.4. доступны следующие слайдеры:
- Слайдер баннеров
- Слайдер продуктов
- Слайдер продуктов (Видео)
- Слайдер продуктов 3
- Слайдер продуктов 4
Слайдер баннеров
Слайдер выводит изображения из альбома приложения «Фото». В настройках темы раздел 2.4 необходимо указать Идентификатор альбома (Как узнать?). Также в «Фото» → Настройки необходимо изменить значение Максимальный размер эскиза, в соответствии с следующими требованиями:
- Боковая панель отключена - изменить на значение 1400
- Боковая панель включена - изменить на значение 1050
Слайдер продуктов
Слайдер продуктов выводит товары из списка товаров (Как добавить?). В настройках темы раздел 2.4 необходимо указать Выборка продуктов.
У слайдеров продуктов используются различные изображения (фон, картинка товара, дополнительная картинка). Для того чтобы слайдер определял данные изображения от прочих изображений товара необходимо в описании картинок товара указывать описание. В таблице указаны, какие описания необходимы:
Описание изображения | Назначение | Типы слайдеров |
---|---|---|
image | Необходим для вывода изображения товара |
Слайдер продуктов Слайдер продуктов 3 Слайдер продуктов 4 |
bg | Необходим для заливки фона |
Слайдер продуктов Слайдер продуктов (Видео) Слайдер продуктов 4 |
video | Необходим для превью видео | Слайдер продуктов (Видео) |
Для того чтобы указать описание у изображения, необходимо выполнить следующие действия:
- Перейти в приложение «Магазин»
- На вкладке «Товары» найти необходимый товар
- У товара выбрать вкладку «Изображения»
- Загрузить изображение
- Указать соответствующее описание (image, video, bg)

Списки товаров
Список товаров используется для группировки и вывода товаров в определенных местах:
- слайдер продуктов
- слайдер списков товаров
- информационная страница (Как вывести?)
Добавления списка
Для создания списка выполните:
- Перейти в приложение «Магазин»
- Вкладка «Товары»
- Нажимаем на Сохранить рядом с заголовком «Списки», заполняем форму и жмем

Как добавить товары в список
Если Тип выбран Список, то в список товаров необходимо вручную добавить товары. Для это выполните следующие действия:
- Перейдите в приложение «Магазин»
- Вкладка «Товары»
- Выберите необходимые товары, проставьте
- Справа выберите действие «Добавить в список»

Категория
Настройки страницы категорий находятся в разделе раздел 2.6 и раздел 2.7.
Сортировка товаров
Для отображения сортировки необходимо выполнить следующие действия:
- Перейдите в приложение «Магазин»
- Вкладка «Товары»
- Выбираем необходимую категорию
- Жмем Настройка категории
- Посетители сайта могу выбирать порядок

Фильтрация товаров
Для отображения фильтра необходимо выполнить следующие действия:
- Перейдите в приложение «Магазин»
- Вкладка «Товары»
- Выбираем необходимую категорию
- Жмем Настройка категории
- Разрешить фильтрацию товаров

Параметры категории
Параметр | Описание и возможные значения | Пример |
---|---|---|
image |
Изображение категории, выводится у подкатегорий на странице категории (Куда загрузить изображение?) |
image=/wa-data/public/site/cat_icons/1.png |
Страница заказа
На странице заказа выводится текущий статус заказа в виде шагов. Данный код работает для стандартного набора статусов. Чтобы добавить или удалить статус необходимо в шаблоне order/status.html изменить массив {$states}
Пример с 4 статусам Новый, Обработан, Оплачен, Доставлен:
{$states = [
[ order => 0, id => "new", title => "Новый" ],
[ order => 1, id => "processing", title => "Обработан" ],
[ order => 2, id => "paid", title => "Оплачен" ],
[ order => 3, id => "shipped", title => "Доставлен" ]
]}
Добавить статусы можно в Магазин - Настройки - Статусы заказов
Фото
Создание альбома
Для создания альбома необходимо выполнить следующие действи:
- Перейти в приложение «Фото»
- Нажимаем на рядом с заголовком "АЛЬБОМЫ"
- Вводим название альбома
- Нажимаем Создать альбом

Идентификатор альбома
После того как мы создадим альбом в приложении «Фото» и загрузим фотографии, нам необходимо узнать идентификатор. Для этого выполним следующие действия:
- Перейдите в приложение «Фото»
- Выбираем необходимый альбом
- Копируем идентификатор альбома из адресной строки браузера

Загрузка фотография
Для загрузки фотографий необходимо выполнить следующие действия:
- Перейти в приложение «Фото»
- Выбираем необходимый альбом
- Нажимаем на "Загрузить фотографии"
- Нажимаем Выбрать фотографии

Блог
Создание блогов
Для создания блогов выполните следующие действия:
- Перейдите в приложение «Блог»;
- Жмем на рядом с заголовком "Блоги";
- Жмем на Новый блог;
- Вводим название блога и заполняем необязательные параматры, если это необходимо;
- Нажимаем Сохранить.

Зачем создавать блоги?
Блоги необходимы для тематического разделения новостей. К примеру, можно разделить новости и статьи, а затем вывести их отдельно в определенном месте магазина.
Создание поста
Для создания записи в блоге выполните следующие действия
- Перейдите в приложение «Блог»;
- Выбираем необходимый блог;
- Жмем на Новая запись;
- Вводим название записи;
- Заполняем текст;
- В необходимом месте, после которого будет выводиться кнопка "читать далее", вставляем разрыв;
- Переходим в метаданные;
- В поле Дополнительные параметры указываем изображение поста(Куда загрузить изображение?);
preview=/wa-data/public/site/Blog/1.jpg
- Жмем сохранить и опубликовываем запись.

Вспомогательные шаблоны
layout/footerlist.html
layout/footerlist.html - вывод списков ссылок в подвале. Шаблон выводится в index.html
Таблица «Доступные параметры шаблона layout/footerlist.html
Параметр | Назначение |
array | Массив, содержащий элементы с полями url и name. Возможные значения:
|
mytitle | Заголовок списка. По умолчанию пусто. |
hide | Параметр элемента для скрытия его из списка. Пример: "hide=nofooter", у страниц, в которых прописан дополнительный параметр nofooter=1 , будут скрыты. |
sm | Ширина списка на маленьких и средних экранах. Принимает значения от 1 до 12. По умолчанию 6 (половина пространства). |
xs | Ширина списка на телефоне(портретное положение). Принимает значения от 1 до 12. По умолчанию 6 (половина пространства). |
Пример использования
Вывести страницы приложения Сайт и скрыть страницы с доп. параметром nofooter.
{include file="layout/footerlist.html" array=$wa->site->pages() mytitle="Страницы приложения сайт" hide="nofooter"}
Пример с выводом своего массива
{$myarray = [
0 => [ "name" => "Элемент 1", "url" => "Ссылка 1" ],
1 => [ "name" => "Элемент 2", "url" => "Ссылка 2" ]
]}
{include file="layout/footerlist.html" array=$myarray mytitle="Мои ссылки"}
home/productset.html
home/productset.html - вывод списка товаров.
Таблица «Доступные параметры шаблона home/productset.html
Параметр | Назначение |
condition | Условие выбора товаров. Например: tag/new - Товары с тегом new category/12 - Товары категории с id=12 id/1,5,7 - Товары с идентификаторами 1, 5, 7 set/promo - Товары из списка promo |
mytitle | Заголовок списка. По умолчанию Промо. |
auto | Автоматическое перелистывание (значение true = включено). Если указать число, то изменится интервал(1000 = 1сек). Значение по умолчанию берется из настроек темы. |
interval | Интервал смены слайдов. Значение по умолчанию null. |
limit | Количество товаров в списке. Значение по умолчанию null (без ограничения). |
noscript | Отключает слайдер и просто выводит список. |
Пример использования
Вывести 10 товаров из списка с идентификатором sale2017 и заголовком "Распродажа 2017".
{include file="home/productset.html" condition="set/sale2017" mytitle="Распродажа 2017" limit=10 inline}
home/productmini.html
home/productmini.html - вывод списка товаров.
Таблица «Доступные параметры шаблона home/productmini.html
Параметр | Назначение |
condition | Условие выбора товаров. Например: tag/new - Товары с тегом new category/12 - Товары категории с id=12 id/1,5,7 - Товары с идентификаторами 1, 5, 7 set/promo - Товары из списка promo |
mytitle | Заголовок списка. По умолчанию Промо. |
auto | Автоматическое перелистывание (значение true = включено). Если указать число, то изменится интервал(1000 = 1сек). Значение по умолчанию берется из настроек темы. |
interval | Интервал смены слайдов. Значение по умолчанию null. |
limit | Количество товаров в списке. Значение по умолчанию null (без ограничения). |
noscript | Отключает слайдер и просто выводит список. |
bg | Фоновый цвет. Пример bg="#f2f8fd" |
image | Фоновое изображение. Пример image="Путь к картинке" |
Пример использования
Вывести 15 товаров из списка с идентификатором sales и заголовком "Распродажа" с фоновым цветом #df3a42.
{include file="home/productmini.html" condition="set/sales" mytitle="Распродажа" limit=15 bg="#df3a42" inline}
home/categories.html
home/categories.html - вывод списка категорий.
Таблица «Доступные параметры шаблона home/categories.html
Параметр | Назначение |
id | Идентификатор родительской категории. По умолчанию 0. |
auto | Автоматическое перелистывание (значение true = включено). Если указать число, то изменится интервал(1000 = 1сек). Значение по умолчанию берется из настроек темы. |
interval | Интервал смены слайдов. Значение по умолчанию null. |
limit | Количество товаров в списке. Значение по умолчанию null (без ограничения). |
noscript | Отключает слайдер и просто выводит список. |
bg | Фоновый цвет. Пример bg="#f2f8fd" |
image | Фоновое изображение. Пример image="Путь к картинке" |
color | Цвет наименования списка. Пример color="#fff" (белый цвет) |
Пример использования
Вывести 8 подкатегорий из категории Марки авто (предположим id=10) с фоновым изображением (/wa-data/public/shop/themes/dsvpro/img/catsbg.jpg) и желтым цветом наименования (#ffe93b).
{include file="home/categories.html" id="10" limit=8 color="#ffe93b" image="/wa-data/public/shop/themes/dsvpro/img/catsbg.jpg" inline}