Урок 8: Настройка внешнего вида сайта
В этом уроке вы узнаете об основных областях на сайте, познакомитесь с настройкой внешнего вида. В теме Phlox хватает параметров, чтобы настроить всё, начиная от логотипа в хедере и заканчивая копирайтом внизу сайта. Кроме того, мы познакомимся чуть ближе с плагином Elementor, который облегчает вёрстку страниц.
Что потребуется для работы?
Смартфон
Все изменения лучше дополнительно проверять на мобильнике
Внимание
Следите за тем какие изменения вы вносите на сайт
Основные области сайта
Header – это верхняя часть сайта, в этой области всегда размещается основное меню, логотип, социальные сети и телефон для оперативной связи. В хедере часто размещают скрипты и пиксели с фэйсбука, яндекса или вконтакте.
Body – основная видимая часть сайта, которая на каждой странице может быть разной. На главной это может быть несколько блоков, связанных между собой, на другой странице это может быть текст с банером.
Footer – нижняя часть сайта. Здесь как правило размещают информацию связанную с разработчиком сайта, копирайт, ссылки на раздел конфиденциальности, второстепенное меню, водные знаки и ссылки на скачивание приложений.
Header и Footer как правило одинаковы для всех страниц сайта.
Как настроить внешний вид?
Зайдите в Консоль > Внешний вид > Настроить
Здесь нужно внимательно ознакомиться с колонкой слева. Здесь вы можете загрузить логотип, задать шрифты для каждого блока, вывести меню, которое хотите. Сейчас нас интересуют больше всего настройки главной страницы. Необходимо сделать ту страницу, которую хотите главной при загрузке сайта.
Вы можете выбрать то, что отображается на главной странице вашего сайта. Это могут быть записи в обратном хронологическом порядке (классический блог) или постоянная/статическая страница. Чтобы установить статическую главную страницу, вам нужно создать две страницы. Одна станет главной страницей, на второй будут показываться ваши записи.
Как сверстать главную страницу?
Здесь вам на помощь придет плагин Elementor. Для начала перейдите в Консоль > Страницы > Добавить новую
Придумайте название странице, например, «Моя главная страница», опубликуйте страницу с помощью кнопки справа вверху. После публикации в правой колонке, которая отвечает за внешний вид страницы, найдите «Атрибуты страницы» и в поле «шаблон» поставьте «Elementor полная ширина». Теперь обновите страницу, после этого нажмите «Редактировать в Elementor». Перед вами появится пространство для редактирования. Прежде чем приступить к вёрстке, приготовьте листик с вашими набросками по структуре сайта. Это вам сильно упростит жизнь.
Полезные ссылки
Elementor - конструктор страниц
Это время для «живого» конструктора, не имеющего никаких ограничений