Элемент Таблица цен
Описание
Это элемент для компонента Zbuilder от автора Zau4man. Компонент представляет собой визуальный редактор блоков с помощью которого вы можете красиво оформить любую страницу сайта, сделанного на InstantCMS.
Версия: 1.0.0
ZBuiler: 1.0.2 и выше
InstantCMS: 2.16.3 и выше
Дополнительно: начальные знания HTML и CSS
Идеально подходит для сайта с услугами или подписками. Элемент представляет из себя форматированый список. В зависимости от стиля шаблона и содержания можно выводить разное количество блоков. Для шаблона Modern (по-умолчанию) идеально 3-4 блока. Элемент адаптирован под мобильные устройства, блоки отображаются друг под другом.
Все части блока настраиваются: заголовок, цена, префикс, описание и тд. Настройки цветов и отступов элемент берет из темы.
Если у вас есть идеи как улучшить этот элемент, пишите в комментариях.
Установка и Обновление
Установка производится стандартным для компонента ZBuilder способом. В архиве 4 файла.
1. Зайдте в файловый менеджер вашего хостинга или подключитесь к каталогу с файлами вашего сайта по ftp.
2. Скопируйте файл form_pricetable.php и form_pricetable_items.php в папку /system/controlers/zbuilder/forms/elements_forms/.
3. Скопируйте файл pricetable.tpl.php в папку /templates/ваша_тема*/controllers/zbuilder/elements/.
4. Скопируйте файл pricetable.css в папку /templates/ваша_тема*/controllers/zbuilder/css/elements/.
5. Авторизуйтесь на вашем сайте с правами Администратора. Перейдите на вкладку Компоненты, затем выберите компонент Конструктор блоков Zbuilder.
6. В открывшемся окне выберите вкладку Элементы и нажмите +Добавить.
7. Название элемента можно любое (предлагаю Таблица цен), Тип элемента обязательно pricetable.
Обновление элемента производится простым копированием новых файлов на хостинг с заменой. Либо удалите старые файлы и скопируйте новые. Важно! Не меняйте названия файлов, это нужно для правильной работы компонента.
Настройка
Чтобы добавить элемент на страницу:
1. Перейдите в Админ панель вашего сайта на вкладку Виджеты и страницы. Выберите страницу на которую хотите добавить элемент Прайс-лист.
2. Добавьте виджет Бинд-блоков из раздела Конструктор блоков.
3. Перейдите на фронтэнд страницы на которой хотите добавить элемент Прайс-лист. Включите Редактор областей.
4. Добавьте нужный вам блок (рекомендую одну колонку), нажав на + и выбрав нужный в раскрывающемся списке.
5. Добавьте элемент Таблица цен, нажав на + в нужном блоке и выбрав элемент из раскрывающегося списка.
6. Кликните по ссылке добавить, чтобы добавить элемент списка.
7. В открывшемся окне заполните нужные поля:
- Название — будет выделено цветным жирным и более крупным текстом.
- Подзаголовок — отображается под названием обычным текстом.
- Цена — отображается крупным шрифтом по центру блока.
- Префикс цены — символ или надпись перед ценой. На Демо это символ рубля (₽). Вы можете использовать любой символ (например % для обозначения скидки) или надпись, которые не нарушают отображение.
- Описание цены — отображается непосредственно под ценой слегка приглушенного цвета.
- Особенности — блок в котором вы можете описать особенности услуги или подписки.
- Текст кнопки — текст, который отображается на кнопке.
- Ссылка — в обычном формате для внешних страниц (https://webassemble.ru) и в сокращённом для внутренних (/internal-page.html). Куда перейдет пользователь при клике по кнопке.
- Иконка кнопки — добавляет иконку на кнопку после Текста кнопки.
Обязательных полей нет, вы заполняете только нужные вам. Если поле не заполнено, то в шаблоне значение поля не рендерится и, соответственно, не выводится.
8. Кликните по кнопке Сохранить. Элемент списка добавлен.
Вы можете добавить неограниченное количество элементов и каждый со своими настройками полей. После добавления всех элементов списка, нажмите кнопку Сохранить. Готово! Таблица цен отображается на сайте. Можно выключить Редактор блоков.
