Секции и блоки

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

Секции и блоки обеспечивают гибкость в расположении контента и позволяют управлять стилем и внешним видом вашего интернет-магазина без необходимости редактировать код. В их число входят следующие возможности настройки:

Вы можете изменять порядок секций в шаблонах и порядок блоков в секциях.
Секции и блоки могут иметь особые параметры настройки.
Вы можете подключать совместимые секции и блоки для отображения в интернет-магазине динамической информации из пользовательских данных, например инструкций по уходу за товарами. Подробнее о подключении динамических источников.

Доступные в редакторе тем секции и блоки зависят от вашей темы и её версии. Например, в вашей теме может быть блок «Слайд», который можно добавить только в секцию «Слайд-шоу», и текстовый блок «Заголовок», который можно добавить во все секции темы. Для получения дополнительной информации о доступных вам опциях обратитесь к документации вашей темы.

Ограничения на количество секций и блоков

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

Каждый шаблон может содержать до 25 секций.
Каждый шаблон может содержать до 1250 блоков во всех секциях. Точное количество блоков, а также число блоков каждого типа, которое можно добавить в каждую секцию, зависят от источников секций и блоков и определяются разработчиком вашей темы. Например, если в вашей теме есть секция «Подписка на рассылку», то вы, возможно, сможете добавить только один блок «Форма для ввода электронной почты».
Блоки, поддерживающие вложенность, могут иметь до восьми уровней вложенных блоков.

На этой странице

Источники блоков

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

Блоки приложений — это блоки, которые добавляют функциональность в вашу тему. С помощью блока приложения можно переместить области темы, добавленные установленными приложениями, в определённое место на странице.
Блоки секций — это блоки, которые определены в рамках конкретной секции.
Блоки темы — это блоки, которые определены в вашей теме и могут иметь динамическую функциональность, например вложенность.

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

Доступность блоков приложений в секциях зависит от функциональности приложения и от того, может ли секция принимать блоки приложений.

Блоки секций

Блоки секций — это блоки, разработанные для конкретной секции. В секции могут быть ограничения на типы блоков секций и на количество добавляемых блоков определённого типа.

Пример секции с блоками секций

Например, в вашей теме есть секция «Подписка на рассылку». С помощью этой секции можно добавить форму подписки на новости, чтобы клиенты могли подписаться на вашу рассылку новостей. После добавления секции «Подписка на рассылку» вы можете добавить по одному из следующих блоков:

блок «Форма для ввода электронной почты»
блок «Заголовок»
блок «Подзаголовок»

Если вы добавите блок «Форма для ввода электронной почты» и нажмёте «Добавить блок», чтобы добавить ещё один блок, то блок «Форма для ввода электронной почты» больше не будет отображаться как вариант в средстве выбора блоков. Это ограничение помогает предотвратить любые проблемы со сбором адресов электронной почты клиентов и гарантирует, что клиент сможет легко ввести свой адрес.

Если вы добавили все три доступных блока для секции «Подписка на рассылку», в средстве выбора блоков отобразится сообщение о том, что все доступные блоки уже использованы.

Блоки темы

Блоки темы — это блоки, которые определены в вашей теме и могут иметь динамическую функциональность, например вложенность. Секции, которые принимают блоки темы, могут принимать множество различных блоков в зависимости от структуры секции. Секция, принимающая блоки темы, может принимать все доступные блоки темы, определённый их набор или блоки, уникальные для этой секции. Блоки темы также могут иметь следующие особенности поведения:

Некоторые блоки поддерживают вложенность, поэтому вы можете вкладывать блоки в другие блоки (до восьми уровней).
Некоторые секции содержат обязательные блоки. Вы можете настроить или скрыть эти блоки, но не можете изменить их порядок или удалить.
Некоторые блоки отображаются в секции автоматически при выполнении определённых условий.

Пример секции с блоками темы

Например, в вашей теме есть секция «Слайд-шоу» с блоками темы.

В секции «Слайд-шоу» вашей темы при нажатии «Добавить блок» вы можете выбрать блок «Слайд» в средстве выбора блоков. Другие типы блоков недоступны. Если вы попытаетесь добавить блок «Слайд» в другую секцию вашей темы, например в секцию «Баннер с изображением», то блок «Слайд» будет недоступен. Это пример блока с ограниченным использованием.

После добавления блока «Слайд» в раздел «Слайд-шоу» можно нажать «Добавить блок», чтобы добавить дополнительные блоки в любой блок «Слайд» в разделе «Слайд-шоу», например «Заголовок», «Изображение» или «Кнопку». Эти блоки вкладываются в блок «Слайд». Это пример вложенного блока.

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

Совместимость блоков темы

Чтобы получить доступ к блокам темы, в вашей теме должны быть разделы, которые их поддерживают. Проверить, поддерживает ли ваша тема блоки, можно в её коде. Если на боковой панели редактора Liquid есть каталог blocks, значит, ваша тема поддерживает блоки. Вы также можете обратиться к документации по теме.

Инструкции:

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Рядом с темой, которую вы хотите проверить, нажмите кнопку , а затем — «Редактировать код».
На боковой панели найдите папку blocks.

Настройка шаблонов темы с помощью разделов и блоков

Когда вы открываете редактор тем, по умолчанию загружается главная страница вашего магазина. В выпадающем меню можно выбрать другой шаблон, например для товаров, коллекций, страниц или блогов, или найти конкретный шаблон с помощью строки поиска в выпадающем меню шаблонов. Когда вы выбираете шаблон, он загружается в редактор тем, и все внесённые вами изменения отображаются для предварительного просмотра в редакторе.

Добавить раздел

Добавьте новый раздел на любую страницу вашего интернет-магазина.

Инструкции:

Компьютер

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Настройте главную страницу или нажмите на выпадающее меню «Главная страница», а затем выберите шаблон, в который хотите добавить раздел.
На боковой панели нажмите «Добавить раздел» и выполните одно из следующих действий:
- Выберите раздел из списка.
- Используйте поле «Поиск разделов», чтобы найти конкретный раздел, а затем выберите его.
Настройте новый раздел, выполнив одно из следующих действий:
- Отредактируйте настройки и контент нового раздела.
- Отредактируйте настройки и контент блоков по умолчанию, которые загружаются вместе с разделом.
- Нажмите «Добавить блок», чтобы добавить новый блок.
Дополнительно: чтобы изменить порядок разделов на странице, наведите курсор на название раздела, а затем нажмите и перетащите кнопку .
Нажмите «Сохранить».

Мобильное устройство

В приложении Shopify нажмите на значок .
В разделе «Каналы продаж» нажмите «Интернет-магазин».
Нажмите «Управление всеми темами».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Настройте главную страницу или нажмите на выпадающее меню «Главная страница», а затем выберите шаблон, в который хотите добавить раздел.
Нажмите «Разделы», затем «Добавить раздел» и выполните одно из следующих действий:
- Выберите раздел из списка, а затем нажмите «Добавить».
- Нажмите кнопку , чтобы найти конкретный раздел, выберите его, а затем нажмите «Добавить».
Настройте новый раздел, выполнив одно из следующих действий:
- Отредактируйте настройки и контент нового раздела.
- Отредактируйте настройки и контент блоков по умолчанию, которые загружаются вместе с разделом.
- Нажмите «Добавить блок», чтобы добавить новый блок.
Дополнительно: чтобы изменить порядок разделов на странице, нажмите и перетащите раздел.
Нажмите «Сохранить» или ✓.

Редактировать раздел

Компьютер

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Отредактируйте раздел на главной странице или нажмите на выпадающее меню «Главная страница», а затем выберите шаблон с разделом, который хотите отредактировать.
На боковой панели нажмите на название раздела, чтобы загрузить контент в окно предварительного просмотра и получить доступ к доступным для редактирования настройкам и параметрам.
Дополнительно: нажимайте на отдельные блоки, чтобы редактировать их в рамках раздела.
Нажмите «Сохранить».

Мобильное устройство

В приложении Shopify нажмите на значок .
В разделе «Каналы продаж» нажмите «Интернет-магазин».
Нажмите «Управление всеми темами».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Отредактируйте раздел на главной странице или нажмите на выпадающее меню «Главная страница», а затем выберите шаблон с разделом, который хотите отредактировать.
Нажмите «Разделы», а затем на название раздела, чтобы загрузить контент в окно предварительного просмотра и получить доступ к доступным для редактирования настройкам и параметрам.
Дополнительно: нажимайте на отдельные блоки, чтобы редактировать их в рамках раздела.
Нажмите «Сохранить» или ✓.

Изменение порядка разделов или блоков

Вы можете изменять порядок разделов в шаблонах страниц и порядок блоков в этих разделах. Кроме того, вы можете перемещать совместимые блоки между разными разделами. Например, если на вашей главной странице есть два раздела «Слайд-шоу», вы можете перетащить блок «Слайд» из одного слайд-шоу в другое.

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

Вы также можете использовать инспектор предварительного просмотра, чтобы изменять порядок разделов. Подробнее об использовании инспектора предварительного просмотра в редакторе тем.

Инструкции:

Компьютер

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Чтобы отредактировать раздел или блок на главной странице, выберите его напрямую или в выпадающем меню «Главная страница» выберите шаблон, содержащий нужный раздел или блок.
Нажмите и удерживайте значок , а затем перетащите блок или раздел на новое место.
Нажмите «Сохранить».

Мобильное устройство

В приложении Shopify нажмите на значок .
В разделе «Каналы продаж» нажмите «Интернет-магазин».
Нажмите «Управление всеми темами».
Рядом с темой, которую вы хотите редактировать, нажмите «Редактировать тему».
Чтобы отредактировать раздел или блок на главной странице, выберите его напрямую или в выпадающем меню «Главная страница» выберите шаблон, содержащий нужный раздел или блок.
Нажмите «Разделы» > «Редактировать».
Нажмите и удерживайте значок , а затем перетащите блок или раздел на новое место.
Нажмите «Готово».
Нажмите «Сохранить» или ✓.

Дублирование раздела или блока

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

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

Компьютер

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Чтобы дублировать раздел или блок на главной странице, выберите его или в выпадающем меню «Главная страница» выберите шаблон, содержащий раздел или блок, который вы хотите дублировать.
Нажмите правой кнопкой мыши на раздел или блок, который вы хотите дублировать, а затем нажмите «Дублировать».
Нажмите «Сохранить».

Мобильное устройство

В приложении Shopify нажмите на значок .
В разделе «Каналы продаж» нажмите «Интернет-магазин».
Нажмите «Управление всеми темами».
Рядом с темой, которую вы хотите редактировать, нажмите «Редактировать тему».
Чтобы дублировать раздел или блок на главной странице, выберите его или нажмите на выпадающее меню «Главная страница» и выберите шаблон с разделом или блоком, который вы хотите дублировать.
Нажмите «Разделы» > «Редактировать».
Нажмите > «Дублировать».
Нажмите «Сохранить» или ✓.

Копирование и вставка блоков

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

Инструкции:

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Рядом с темой, которую вы хотите редактировать, нажмите «Редактировать тему».
Чтобы скопировать и вставить блок на главной странице, выберите его напрямую или в выпадающем меню «Главная страница» выберите шаблон, содержащий блок, который вы хотите скопировать.
Нажмите правой кнопкой мыши на блок, который вы хотите скопировать, а затем нажмите «Копировать».
В том же или в другом разделе нажмите правой кнопкой мыши в области раздела, а затем нажмите «Вставить».
Нажмите «Сохранить».

Скрытие или удаление раздела или блока

Компьютер

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Чтобы скрыть или удалить раздел или блок на главной странице, выберите его напрямую или в выпадающем меню «Главная страница» выберите шаблон, содержащий раздел или блок, который вы хотите скрыть или удалить.
Необязательно: чтобы скрыть раздел или блок в вашем интернет-магазине, наведите указатель мыши на его название, а затем нажмите кнопку .
Необязательно: чтобы удалить раздел или блок из вашего интернет-магазина, наведите указатель мыши на его название, а затем нажмите кнопку .
Нажмите «Сохранить».

Мобильное устройство

В приложении Shopify нажмите на значок .
В разделе «Каналы продаж» нажмите «Интернет-магазин».
Нажмите «Управление всеми темами».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Чтобы скрыть или удалить раздел или блок на главной странице, выберите его напрямую или нажмите на выпадающее меню «Главная страница» и выберите шаблон с разделом или блоком, который вы хотите скрыть или удалить.
Нажмите «Разделы», а затем — на раздел или блок, который вы хотите скрыть или удалить.
Необязательно: чтобы скрыть раздел или блок в вашем интернет-магазине, нажмите > «Скрыть».
Необязательно: чтобы удалить раздел или блок из вашего интернет-магазина, нажмите > «Удалить».
Нажмите «Сохранить» или ✓.

Переименование раздела или блока

По умолчанию в качестве названия раздела или блока в боковом меню редактора тем и в его настройках используется тип этого элемента, например «Коллекция» или «Текст».

Что касается блоков, то если в их настройках есть текстовое поле (например, заголовок или описание), этот текст также добавляется к названию в боковом меню. Если текстовых полей несколько, добавляется содержимое первого заполненного поля. Когда вы меняете текст в текстовом поле, название блока обновляется и включает в себя измененный текст. Название раздела или блока не может быть пустым.

Например, вы добавляете в шаблон страницы раздел «Несколько столбцов» с блоками «Столбец». Блок столбца содержит настройку «Заголовок» с текстом по умолчанию Столбец и настройку «Описание» с текстом по умолчанию Сопроводите текст изображением, чтобы привлечь внимание к выбранному товару, коллекции или записи в блоге. Название раздела по умолчанию — Несколько столбцов. Название блока «Столбец» по умолчанию — Столбец - Столбец. Если удалить текст из поля «Заголовок», название блока обновится и станет Столбец - Сопроводите текст изоб....

Вы можете переименовать любой раздел или блок, задав ему собственное название в его настройках в боковом меню редактора тем.

Инструкции:

Компьютер

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Нажмите на раздел или блок, который вы хотите переименовать.
Обновите название одним из следующих способов:

Нажмите на название, а затем отредактируйте его или введите новое.
Нажмите > «Переименовать», а затем введите новое название.

Нажмите «Сохранить».

Мобильное устройство

В приложении Shopify нажмите на значок .
В разделе «Каналы продаж» нажмите «Интернет-магазин».
Нажмите «Управление всеми темами».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Нажмите или проведите пальцем, чтобы открыть меню раздела.
Нажмите на раздел или блок, который вы хотите переименовать, чтобы открыть его настройки.
Нажмите > «Переименовать», а затем введите новое название.
Нажмите «Сохранить» или ✓.

Работа с блоками

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

Темы Shopify содержат разделы и блоки, которые можно настраивать. В некоторых разделах используются фиксированные типы блоков. Это означает, что вы можете выбирать только те блоки, которые предусмотрены для этого раздела дизайнером темы.

Другие разделы позволяют выбрать любой блок, но общее количество блоков, которое можно добавить в раздел, ограничено. Если в вашем разделе достигнуто максимальное количество доступных блоков, опция «Добавить блок» станет неактивной, и вы не сможете ее нажать.

Вы можете найти блок по названию с помощью поиска или выбрать его из выпадающего меню выбора блоков. Блоки вашей темы могут быть отсортированы по категориям в меню выбора блоков, например «Коллекция» для блоков со средством выбора коллекций или «Медиафайлы» для блоков с изображениями и видео.

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

Добавление блока

Компьютер

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Вы можете добавить блок в раздел на главной странице или нажать на выпадающее меню «Главная страница», а затем выбрать шаблон, в который хотите добавить блок.
Наведите курсор на раздел, в который вы хотите добавить блок, нажмите «Добавить блок», а затем выполните одно из следующих действий:
- Выберите блок из списка.
- Воспользуйтесь полем «Поиск блоков», чтобы найти нужный блок, а затем выберите его.
Нажмите «Сохранить».

Мобильное устройство

В приложении Shopify нажмите на значок .
В разделе «Каналы продаж» нажмите «Интернет-магазин».
Нажмите «Управление всеми темами».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Вы можете добавить блок в раздел на главной странице или коснуться выпадающего меню «Главная страница», а затем выбрать шаблон, в который хотите добавить блок.
Коснитесь «Разделы», затем для раздела, в который хотите добавить блок, коснитесь «Блок» и выполните одно из следующих действий:
- Выберите блок из списка.
- Коснитесь кнопки , чтобы найти нужный блок, а затем выберите его.
Нажмите «Сохранить» или ✓.

Использование метаполей и метаобъектов с динамическими источниками

Вы можете использовать метаполя и метаобъекты для отображения динамической информации в своем интернет-магазине. Если у вас есть тема, поддерживающая метаполя, вы можете подключить метаполе к совместимым настройкам раздела или блока в редакторе тем.

Например, если вы продаете свечи, вам может понадобиться отображать время горения для каждой свечи, доступной в вашем магазине. После того как вы настроите метаполе товара для времени горения в разделе «Пользовательские данные» в настройках панели администратора Shopify, вы сможете добавить текстовый блок в главный раздел вашего шаблона товара. В текстовом блоке вы можете нажать кнопку в настройках текста и выбрать метаполе «Время горения». Теперь информация о времени горения будет отображаться для ваших товаров.

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

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

Вы можете отображать динамическую информацию в своем интернет-магазине, добавляя разделы или блоки, которые могут использовать динамические источники. Динамические источники можно использовать в любом шаблоне, разделе или блоке, который отображает совместимые ресурсы (товар, коллекция, страница, блог и запись в блоге). Перед подключением метаполя в шаблонах его необходимо добавить. Дополнительную информацию об использовании метаполей и метаобъектов с динамическими источниками в вашей теме см. в разделе «Динамические источники».

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

Инструкции:

Компьютер

В панели администратора Shopify перейдите в раздел «Интернет-магазин» > «Темы».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Отредактируйте секцию или блок на главной странице либо нажмите на выпадающее меню «Главная страница», а затем выберите шаблон, в котором находится нужная вам секция или блок.
На боковой панели нажмите на название раздела или блока, чтобы загрузить его контент в окно предпросмотра и получить доступ к доступным для редактирования настройкам и параметрам.
Нажмите кнопку для соответствующего типа контента, который вы хотите отредактировать, а затем подключите свой динамический источник.
Нажмите «Сохранить».

Мобильное устройство

В приложении Shopify нажмите на значок .
В разделе «Каналы продаж» нажмите «Интернет-магазин».
Нажмите «Управление всеми темами».
Найдите тему, которую хотите отредактировать, и нажмите «Редактировать тему».
Отредактируйте раздел или блок на главной странице или коснитесь выпадающего меню «Главная страница» и выберите шаблон, содержащий раздел или блок, который вы хотите отредактировать.
Коснитесь «Разделы», а затем коснитесь названия раздела или блока, чтобы загрузить контент в окно предпросмотра и получить доступ к доступным для редактирования настройкам и параметрам.
Коснитесь кнопки для соответствующего типа контента, который вы хотите отредактировать, а затем подключите свой динамический источник.
Нажмите «Сохранить» или ✓.

Подробнее о том, как отображать метаполя в интернет-магазине, и о том, как отображать метаобъекты в интернет-магазине.

Селектор динамических источников

С помощью селектора динамических источников можно подключить нужный динамический источник непосредственно в редакторе тем. Ниже приведены основные функции селектора динамических источников:

Вы можете ссылаться на динамические источники из разных ресурсов, если это возможно. Например, если вы подключаете настройку к блоку, который связан и с ресурсом товара, и с ресурсом страницы, то с помощью выпадающего меню в селекторе динамических источников можно указать, метаполя какого из этих ресурсов вы хотите найти: товара или страницы.
В селекторе динамических источников есть функции поиска и фильтрации, которые помогут вам найти нужное метаполе.
Селектор динамических источников позволяет выбирать метаполя категорий. Это дополнительные атрибуты, которые становятся доступными, когда вы присваиваете товару категорию товара. Доступ к этим метаполям позволяет подключать динамические источники к любым релевантным полям базового метаобъекта атрибута.