В этой статье вы увидите, что можно сделать в WordPress с помощью Elementor Pro и темы Ocean WP. Ниже приводится краткий обзор того, что вы прочтете в тексте.
Мы создадим заголовок с помощью Elementor Pro, настроим его, и вы увидите, насколько он может быть липким. То же самое мы сделаем с нижним колонтитулом.
Вы узнаете, как работать с условиями отображения. Они помогают отображать верхний колонтитул, нижний колонтитул и другие шаблоны в определенных разделах вашего сайта на основе условий, заданных вами в шаблоне.
В нем речь пойдет о динамическом контенте и о том, как создать с его помощью шаблон, который будет отображать название блога, дату, автора или что-то еще.
Мы также создадим и настроим шаблон записи в блоге, а также шаблон страницы блога, чтобы весь ваш сайт был создан с помощью версии Elementor Pro.
Элементор Про
Раньше Elementor был только конструктором страниц, а теперь он является и конструктором страниц, и конструктором тем. С помощью Elementor вы можете заменить практически все элементы используемой вами темы. Заходим в панель управления нашего сайта и под опцией Шаблоны вы сохранили шаблоны, страницы, разделы и глобальные плагины, как вы можете видеть на изображении ниже. Здесь вы можете использовать уже созданные шаблоны, создать новый или импортировать уже созданный.
Вы выбираете создание нового шаблона, и у вас есть несколько вариантов. Для начала мы выберем создание заголовка. Появится библиотека различных шаблонов заголовков, и когда вы увидите тот, который вам нравится, вы выбираете его и нажимаете кнопку. Вставлять и после этого вы сможете адаптировать его под свои нужды.
Что касается изменений шаблона, то вы можете изменить цвет иконок, цвет фона, информацию о номере телефона, электронной почте, времени работы. Затем вы можете изменить иконки социальных сетей, сделать пробелы между ними, пробелы между верхом и низом раздела, изменить цвет иконок или текста при наведении на него мыши, добавить анимацию при загрузке сайта и так далее. Вариантов много, вам просто нужно поиграть и выбрать то, что вам нравится и что визуально вам красивее. Все эти изменения можно внести, нажав на определенный раздел и выбрав параметры. Стиль и Передовой есть возможности изменить все вышеперечисленное.
Выше приведен пример того, как был изменен логотип: чтобы изменить фон, вы также можете сделать меню горизонтальным, вертикальным или выпадающим, под каждым пунктом меню может находиться указатель, оно может менять цвет при наведении на него мыши. После настройки шаблона нажмите Публиковать и затем появляются условия отображения, которые необходимо задать. Где вы хотите, чтобы отображался заголовок: на всем сайте, на определенных страницах или, например, Если вы хотите, чтобы он отображался на всем сайте, а не только на определенных страницах, то задайте 2 условия. Вы сохраняете условия и шаблон размещается на сайте.
Для того чтобы ваш заголовок был липким, т.е. не двигался при прокрутке страницы, выберите раздел, выберите опцию Эффекты движения и около поля Липкий укажите, где должен располагаться заголовок. Для того, чтобы меню в заголовке выглядело красиво даже при прокрутке страницы, нужно в опции Пользовательский CSS добавить одну строку кода селектор{фон: #fff}. Вы можете выбрать любой цвет фона, здесь приведен только пример белого цвета.
Аналогичным образом оформляется нижний колонтитул страницы, а также создается шаблон путем выбора его на панели управления. Вы выбираете понравившийся вариант из библиотеки, настраиваете его под свои нужды, как и при создании заголовка, задаете условия отображения и публикуете на сайте.
После того, как мы создали верхний и нижний колонтитулы, следующим элементом на очереди будет страница блога. Мы создаем его, выбрав новый шаблон и указав его как тип шаблона. Архив и давайте назовем его Blogpage или как хотите. Из предложенных в библиотеке дизайнов мы выбираем подходящий нам, затем настраиваем его так, как хотим, задаем количество статей в одной строке, количество столбцов, размер изображения статьи, где она будет располагаться над или под кратким тестом и т.п.
После этого задаем условия отображения и шаблон страницы блога готов, осталось только опубликовать его.
Шаблон готов, и теперь мы можем добавить динамический контент. На страницу блога можно добавить заголовок, затем описание страницы, автора текста, все это над статьями на странице блога, чтобы страница выглядела лучше. Отрегулируйте интервалы и поля между динамическим контентом и статьями так, чтобы все выглядело визуально хорошо, чтобы ничего не вытекало и не выглядело странно.
Следующий шаблон, который мы создадим, — это шаблон статьи. Для этого снова заходим на панель инструментов в шаблоны, выбираем «Создать новый» и выбираем Отдельный пост и давайте назовем это Блогом.
Мы выбираем нужный нам шаблон статьи из библиотеки, а затем адаптируем его под наши нужды.
На изображении выше представлен базовый шаблон статьи, который мы решили дополнительно стилизовать. Можно задать стиль текста, выравнивание, заголовки, цвет и размер шрифта, а также отображать ли метаданные, такие как автор, дата и время, комментарии и то, как они будут выглядеть, например: с иконками и т.п. или без них. В самой статье блога мы можем настроить Выдержка из поста - который представляет собой сокращенный текст, который будет отображаться на странице блога с отдельным изображением, затем Главное изображение - как выбранное изображение будет выглядеть на странице блога и в самой статье, затем Опубликовать контент - содержание статьи и изменение цвета и размера шрифта, затем Авторский ящик - информация об авторе, будут ли имя и фамилия, фотография, биография, ссылки на другие тексты и т. д., все это вы можете оформить, нажав на этот раздел. Есть еще разделы. Навигация по записям - в нем мы настраиваем, как будут выглядеть ссылки на предыдущую и следующую статью, а также раздел Опубликовать комментарии - комментарии к статье, задаем расстояние, на котором они будут располагаться от статьи, фон и т.п. После всего этого необходимо задать условия отображения и опубликовать шаблон блога на кнопку Публиковать.
Источник: ютуб
