Конструктор главной страницы — Документация — 4eo.ru

Документация по шаблону Fabrica

Конструктор главной страницы

Каждый виджет содержит в себе настройки – ключи, внимательно изучите их в соответствующем разделе документации, мы подробно описали каждый из них

Чтобы посмотреть процесс настройки главной страницы и адаптивности наглядно, мы рекомендуем следующие видео:


В сетку конструктора главной страницы вы можете поставить только один виджет по горизонтали и вертикали. Обратите внимание, что отображение всех элементов главной страницы происходит до ширины 2000 пикселей, это сделано для того, чтобы на больших мониторах все картинки, которые вы загрузите на сайт, оставались на своих местах и отображались корректно. Почти никто из посетителей вашего сайта не заметит это, потому что у большинства мониторы не более 1920 пикселей в ширину

Вы можете комбинировать несколько виджетов, чтобы на сайте они выглядели как единое целое

Мы будем приводить для примера некоторые заполненные ключи, но ключи, присущие любому виджету на главной странице (content_width_100, background_color, box_shadow, margin, padding) мы описывать не будем


Баннеры

Три горизонтальных баннера, два из которых занимают четверть экрана, а один – половину. На момент обновления 1.2.09 их взаимное расположение поменять нельзя. Поверх баннеров вы можете вывести текст и назначить им ссылку, которая будет открываться по нажатию на них

КлючЗначение
cat_id4
height250
color_contentrgba(var(--color_white), 1)
img_size_name1000x250


Бренды

Список всех брендов, то есть производителей, которые существуют у вас на сайте. Отображаются в виде плиток с логотипами, можно поменять их количество как суммарное, так и в одной строке, а также включить/выключить черно-белое отображение с помощью ключа grayscale

КлючЗначение
count20
count_horizontal10
grayscaleда


Дизайнерское меню

Меню с фотографиями и надписями, расположенными в определенном порядке, их взаимное расположение на момент обновления 1.2.06 менять нельзя

Спецификой загрузки изображений в данный видджет является то, что вы загружаете квадратные изображения (например, 740х740) для всех частей виджета, а отображаются они 1 к 1, то есть для вертикальной от исходной "обрежутся" поля слева и справа, а для квадратной картинки будет вырезана центральная часть, покажем наглядно, как выглядит меню на сайте и как выглядят картинки для этого меню при загрузке

КлючЗначение
menu_id9
height650
color_titleда
font_size_title
img_size_name

Вид изображений в виджете на сайте

Светло-серым фоном обозначены загружаемые картинки


Дизайнерское меню 2

КлючЗначение
menu_id9
height650
color_titleда
font_size_title
img_size_name

Заголовок

Надпись, выравнивание которой можно менять по горизонтали, по умолчанию заголовок имеет разоре заголовка H2

КлючЗначение
name
color
h_size
align_horizontal

Заголовок с кнопкой

Надпись, рядом с которой располагается кнопка, для которой вы можете назначить ссылку

КлючЗначение
align_horizontal
h_size
name
link
name_link
btn_type
two_rows


[Группа] - Бренды + Новости

Блок, где слева находится список брендов, а справа – список новостей

КлючЗначение
count
count_horizontal
img_size_name
widget_style

Категории

Вывод категорий первого уровня вашего интернет-магазина


Меню с заголовками

Информация пока не заполнена

КлючЗначение
menu_id
count_horizontal
grid-gap
img_size_name
widget_style

Меню с каруселью

Информация пока не заполнена

КлючЗначение
menu_id
count_horizontal
color_title
color_description
font_size_title
font_size_description
img_size_name
title_strong

Меню с табами

Меню, переключение между которыми можно осуществить через "табы", то есть кнопки. Выводятся как меню, при наведении появляются подпункты меню, если они есть

КлючЗначение
padding_inner20px
menu_id12
color_titlergba(var(--color_white), 1)
font_size_title1.25rem
color_textrgba(var(--color_white), 1)
color_hoverrgba(var(--color_white), .5)
font_size_text
count_horizontal4
btn_type
btn_active_type
img_size_namesmall
height250px


Меню с фоном

КлючЗначение
padding_inner0px
menu_id13
name_link
text_align_horizontalleft
count3
count_horizontal3
border_radius5px
img_size_namemenu_250
block_type
title_strongДа

Информация пока не заполнена


Настраиваемый блок с картинкой и кнопками

КлючЗначение
block_id0px
btn_type [_2]
btn_name [_2]
btn_link [_2]
btn_font_size [_2]
btn_line_height [_2]
btn_color [_2]
btn_new_tab [_2]
albom_id
text_align_vertical
text_align_horizontal
img_align_horizontal
img_size_name
video_url
reverse
img_width_100
btn_two_rows

Информация пока не заполнена


Новости

Список блоков новостей, располагающихся по горизонтали, можно поменять выводимое количество, а также изменить стиль отображения

КлючЗначение
count
count_horizontal
content_alignHorizontal
img_size_name
widget_style
site_id
title_strong


Отзывы

Информация пока не заполнена

КлючЗначение
count
count_horizontal

Преимущества

Список преимущетсв вашего магазина, можно использовать в другом назначении. Например, как этапы вашей работы или просто как несколько баннеров, расположенных по горизонтали, а если поставить два аналогичных блока друг дно другом, то можно получить баннеры в несколько строк

КлючЗначение
padding_inner
align_horizontal
cat_id
count
count_horizontal
color_title
color_description
font_size_title
line_height_title
font_size_description
img_size_name
title_strong
block_type


Стандартное меню

Список всех категорий вашего интернет-магазина в виде сплошного списка в несколько столбцов

КлючЗначение
menu_id
count_horizontal
block_type
grid-gap


Статьи

Список статей, располагающихся по горизонтали. Выглядит аналогично новостям

КлючЗначение
count
count_horizontal
img_size_name
widget_style

Своя кнопка

Вывод кнопки, по которой можно перейти

КлючЗначение
title
btn_style
link
align_horizontal
target_blank

Собственный блок с картинкой слева

Информационный блок для заголовка и текста, можно выводить с картинкой слева. На момент обновления 1.2.06 вывод картинки в левой части не предусмотрен

КлючЗначение
block_id16


Слайдер с текстом

Выглядит как текст и изображение, размер которого соответствует выбранному в ключе img_size_name параметру. Если ключ count имеет значение больше 1, то автоматически появляются стрелки для переключения между несколькими табами. Можно использовать в качестве демонстрации своих работ

КлючЗначение
padding_inner
cat_id
font_size_title
color_title
count
border_radius
align_horizontal
align_vertical
img_size_name
reverse
two_rows


Слайдер

Основной баннер на главной странице. В шаблоне его можно сделать как на всю ширину окна браузера, так и на ширину сайта. Для мобильной адаптации рекомендуется ставить более высокую картинку (ключ img_size_name)

КлючЗначение
cat_id
count
border_radius
img_size_name


Слайдер с баннерами 1

Информация пока не заполнена

КлючЗначение
cat_id
cat_id_2
img_size_name
img_size_name_2

Двойной слайдер 1

Информация пока не заполнена

КлючЗначение
border_radius
cat_id
cat_id_2
img_size_name
img_size_name_2
width_img

Слайдер с формой обратной связи

Информация пока не заполнена

КлючЗначение
site_id
opacity
btn_name
block_id
cat_id
count
top
left
width
img_size_name

Собственный блок

Информация пока не заполнена

КлючЗначение
align_horizontal
h_size
neme
link
name_link
btn_type
btn_two_rows

Товары

Виджет с выводом товаров, если их больше, чем 4, то автоматически создастся слайдер с кнопками влево-вправо. Если вы хотите располагать ряды товаров друг под другом, можно этот виджет. Также, с помощью 

КлючЗначение
count6
product_ids_or_typeскидка
good_template2


Товары с баннером

Информация пока не заполнена

КлючЗначение
count6
product_ids_or_typeскидка
product_cat_id
cat_id
img_size_name
border_radius
good_template
font_size_title
color_title
font_size_description
color_description
title_strong

Форма обратной связи

Форма обратной связи. Например, для получения заявок

КлючЗначение
align_horizontal6
site_idскидка
block_id
width
btn_type
name_link


Форма обратной связи с текстовыми блоками

Информация пока не заполнена

КлючЗначение
align_horizontal6
site_idскидка
block_id
cat_id
count
count_horizontal
title_font_size
title_line_height
title_color
title_strong
btn_stylebtn-1
btn_name
btn_font_size
btn_line_height
btn_color
img_size_name
block_type
two_rows

Яндекс карта

Вывод карты, подробнее о ее настройке смотрите в документации


Этот сайт использует cookie для хранения данных. Продолжая работу с сайтом, вы даете свое согласие на работу с этими файлами.

Согласен