Элемент Прайслист

Элемент Прайслист

Описание

Это элемент для компонента  Zbuilder от автора Zau4man . Компонент представляет собой визуальный редактор блоков с помощью которого вы можете красиво оформить любую страницу сайта, сделанного на InstantCMS.

Версия: 1.0.0
ZBuiler: 1.0.2 и выше
InstantCMS: 2.16.3 и выше
Дополнительно: начальные знания HTML и CSS

Элемент сделан по принципу списка и состоит из нескольких блоков: Название, Описание и Цена. К Заголовку можно добавить иконку из набора вашей темы или темы Modern. Минималистичный и в тоже время симпатичный дизайн позволяет посетителям сайта сосредоточиться на главном. Имеет адаптивный дизайн, что позволяет выглядеть одинаково привлекательно как на больших экранах, так и на экранах смартфонов.

Если у вас есть идеи как улучшить этот элемент, пишите в комментариях.

Установка и Обновление

Установка производится стандартным для компонента ZBuilder способом. В архиве 4 файла.

1. Зайдте в файловый менеджер вашего хостинга или подключитесь к каталогу с файлами вашего сайта по ftp.
2. Скопируйте файл  form_price.php и form_price_items.php в папку /system/controlers/zbuilder/forms/elements_forms/ .
3. Скопируйте файл  price.tpl.php в папку /templates/ваша_тема*/controllers/zbuilder/elements/ .
4. Скопируйте файл  price.css в папку /templates/ваша_тема*/controllers/zbuilder/css/elements/ .
5. Авторизуйтесь на вашем сайте с правами  Администратора . Перейдите на вкладку Компоненты , затем выберите компонент Конструктор блоков Zbuilder .
6. В открывшемся окне выберите вкладку  Элементы и нажмите +Добавить .
7. Название элемента можно любое (предлагаю Прайс-лист), Тип элемента обязательно price .

Обновление элемента производится простым копированием новых файлов на хостинг с заменой. Либо удалите старые файлы и скопируйте новые. Важно! Не меняйте названия файлов, это нужно для правильной работы компонента. 

Настройка

Чтобы добавить элемент на страницу:

1. Перейдите в Админ панель вашего сайта на вкладку  Виджеты и страницы . Выберите страницу на которую хотите добавить элемент Прайс-лист.
2. Добавьте виджет  Бинд-блоков из раздела Конструктор блоков.
3. Перейдите на фронтэнд страницы на которой хотите добавить элемент Прайс-лист. Включите Редактор областей .

Изображение

4. Добавьте нужный вам блок (одна колонка или две колонки), нажав на + и выбрав нужный в раскрывающемся списке.
5. Добавьте элемент Прайс-лист , нажав на + в нужном блоке и выбрав элемент из раскрывающегося списка.
6. Кликните по ссылке добавить , чтобы добавить элемент списка.

Изображение

7. В открывшемся окне заполните нужные поля:

  • Иконка — выберите иконку из набора темы. Кликните по кнопке выбрать, в открывшемся окне выберите иконку и кликните по ней (код будет скопирован), вставьте скопированное значение в поле.
  • Название — будет выделено жирным и более крупным текстом.
  • Ссылка — в обычном формате для внешних страниц (https://webassemble.ru) и в сокращённом для внутренних (/internal-page.html). Если это поле заполнено, то Название будет ссылкой.
  • Описание — текст под Названием.
  • Цена — соответственно отображает цену.

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

Изображение

8. Кликните по кнопке Сохранить . Элемент списка добавлен.

Вы можете добавить неограниченное количество элементов и каждый со своими настройками полей. После добавления всех элементов списка, нажмите кнопку Сохранить . Готово! Прайс-лист отображается на сайте. Можно выключить Редактор блоков .

Изображение


Не забудьте оценить дополнение!
Если вам нравится моя работа, вы можете поддержать меня. Я буду вам благодарен!
Нет комментариев. Ваш будет первым!