Добро пожаловать на шестой урок. Сегодня мы узнаем, что такое шаблоны в Elementor и как они используются для ускорения процесса разработки. Шаблоны в Elementor — это готовые макеты, которые ускоряют процесс разработки веб-сайта. С ними не надо создавать каждый элемент с нуля.

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

В библиотеке Elementor предоставлено множество готовых шаблонов. Чтобы импортировать шаблон, перейдите в библиотеку и выберите нужный вариант из списка. Затем нажмите кнопку «Вставить», чтобы загрузить выбранный шаблон на ваш сайт.

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

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

Давайте выберем какой-нибудь шаблон. Самый первый: About. Вот этот, например. Он похож на секцию, которую создал дизайнер. Вот эту. Можно вернуться в библиотеку и вставить отсюда или вставить отсюда. Вставляем… Вот секция вставилась. Теперь можно поменять заголовок, текст, картинку. Давайте сделаем, как сделал дизайнер. Для начала ширину макетов сделаем ограниченной. Про эти настройки я буду говорить, когда будем разбирать контейнеры. Пока просто смотрите.

Теперь мы поменяем заголовок. Меняем стиль, цвет текста. Выберем белый, глобальный. Типографику — на наш глобальный H2. Только наш Pomidorko не поддерживает латиницу. Нужно поменять на кириллицу. Давайте возьмём этот текст: Ctrl+C, Ctrl+V. Видите? Поменялся.

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

Также можно заменить картинку. Я уже подготовил заранее нужную.

Можно вставить кнопку. Другими словами, выбрав из библиотеки какой-нибудь шаблон, вы можете его настроить под свои нужды: поменять текст, картинки, добавить какие-то элементы или, наоборот, удалить. Чтобы создать пользовательский (собственный) шаблон, можете начать с чистого листа или использовать уже существующую страницу в качестве основы.

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

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

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

А сейчас создадим новую секцию. Добавим эту секцию. «Применить» — вот она.

Ещё одна секция поставилась, точно такая же. Её тоже можно подредактировать: поставить какой-нибудь другой заголовок и/или текст, поменять картинку и/или цвет. Другими словами, это очень удобно, когда много контента на сайте. Давайте удалим, пока не нужно.

Давайте выйдем в консоль WordPress. Здесь также можно работать с шаблонами. Обновим сначала страницу.

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

Давайте посмотрим, что у нас ещё есть. Попапы. Попап — это всплывающее окно, которое отображается поверх страницы. Например, при клике на кнопку всплывает форма обратной связи.

«Конструктор темы». Я уже показывал, но повторюсь. Здесь мы будем создавать хедер, футер, одиночную запись, одиночную страницу и архив.

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

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

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

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

Этот шаблон сохраняется в формате json. Так создаётся файл, который можно загрузить на другой сайт или сохранить для будущего использования. Сохраняем в нужную папку.

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

На шестом уроке мы рассмотрели работу с шаблонами в Elementor. Шаблоны — это предварительно созданные макеты страниц, которые помогают ускорить процесс разработки сайта. Мы узнали, как импортировать готовые шаблоны из библиотеки Elementor и настроить их под свои нужды. Также мы научились создавать и редактировать собственные шаблоны, экспортировать и переносить их на другие сайты или для резервного копирования.

На сегодня у меня всё. Увидимся на следующих уроках. Пока!