Как использовать страницу настройки для редактирования темы WordPress

Как использовать страницу настройки для редактирования темы WordPress

Одна из удивительных особенностей WordPress, сделавшая его настолько популярным среди блоггеров, — это возможность использовать темы. Без каких-либо технических знаний каждый может теперь иметь красиво оформленный веб-сайт, который понравится многим.

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

Конечно, можно сделать гораздо больше, если Вы знаете, как писать программы, но будем считать, что это сейчас не для нас. Поскольку WordPress позволяет изменять темы с помощью удобного для начинающих Настройщика (Customizer), мы покажем Вам, как получить к нему доступ и как персонализировать тему по Вашему желанию. Поскольку каждая тема имеет различные опции настройки, мы для целей данного руководства будем использовать в качестве примера тему Twenty Seventeen.

Как получить доступ к странице настройки WordPress

Страница Настройки WordPress также известна как «Настройщик (Customizer) WordPress». Она была введена в версии 3.4, и с тех пор позволяет пользователям предварительно просматривать сайт, пока с ним производятся изменения. Какой лучший способ настроить Ваш сайт, но чтобы его версия реального времени сохранялась? Главное заключается в том, что эти текущие временные изменения не влияют на сайт в реальном времени, так что Ваши посетители не смогут видеть, что Вы делаете, пока не сохраните изменения.

Чтобы получить доступ к Настройщику WordPress, перейдите к Внешний вид (Appearance) -> Настроить (Customize).

Страница Настройщик WordPress

Это страница Настройщика. WordPress открыл домашнюю страницу Вашего блога и включил Настройщик в левой части экрана. Теперь Вы готовы начать вносить изменения в свой сайт.

Как настроить сайт WordPress

Для начала давайте сосредоточимся на опциях в левой части экрана.

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

Свойства сайта (Site Identity)

Во-первых, Вы можете изменить несколько параметров, которые имеют решающее значение для идентификации Вашего сайта. Если у Вас имеется логотип или если захотите его добавить, нажмите кнопку «Выбрать логотип (Select Logo)». Выберите любое изображение из медиа-библиотеки или загрузите новое. Обычно логотип — это квадратная картинка, которая представляет Вас или Вашу компанию. Если выбрать логотип для Twenty Seventeen, то он появится справа рядом с названием сайта. Это может быть выглядеть по другому, если Вы используете какую-либо другую тему WordPress.

Настройщик – Свойства сайта

Название сайта (Site Title) и Краткое описание (Tagline) должны быть уникальными для каждого веб-сайта. Они не только будут выводиться на главной странице, но и будут напрямую влиять на то, как Ваш блог отображается на страницах результатов поиска. Поэтому крайне важно, чтобы Вы дали имя своему сайту и не забыли про краткое, состоящее из одного предложения, его описание.

Не забудьте добавить Иконку сайта (Site Icon). Эта небольшая картинка отображается в браузере пользователей в верхней части окон и вкладок. Она также отмечает для пользователя любую из Ваших страниц и участвуют при создании любых ярлыков. Иконка сайта может помочь пользователям легче узнать Ваш блог. Обычно люди выбирают свои логотипы в качестве иконки сайта. Она должна быть квадратной и не менее 512 × 512 пикселей в ширину и высоту.

Цвета (Colors)

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

Цвета в Настройщике темы

Что касается темы Twenty Seventeen, то Вы можете выбирать между тремя цветовыми схемами, а также можно персонализировать цвет текста заголовка.

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

Медиафайл заголовка (Header Media)

Медиафайл заголовка в Настройщике темы

Заголовки стали одним из самых важных элементов дизайна веб-сайта. В современных темах заголовки обычно содержат изображения и видеоролики, поэтому вполне естественно, что Вы можете выбрать материал самостоятельно. Более подробно тема «Медиафайл заголовка» рассматривается в статье «Как настроить заголовок веб-сайта WordPress».

Меню (Menus)

Меню в Настройщике темы

Поскольку важно, чтобы на каждом сайте было хотя бы одно меню навигации, Вам просто нужно узнать, как добавлять меню в WordPress. Более подробно это рассмотрено в статье «Как добавить меню навигации в WordPress». А эта вкладка Настройщика также позволяет Вам добавлять и редактировать навигационные меню в WordPress, но с функцией Live Preview, чтобы можно было сразу увидеть и проверить результаты.

Виджеты (Widgets)

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

Обычно, есть, по крайней мере, несколько областей, которые Вы можете использовать. Если применяется тема Twenty Seventeen, то можно увидеть варианты добавления виджетов к Боковой панели (Sidebar), Нижнему колонтитулу 1 (Footer 1) и нижнему колонтитулу 2 (Footer 2).

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

Настройки главной страницы (Static Front Page)

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

Настройки главной страницы в Настройщике темы

В случае выбора статической страницы WordPress откроет еще один набор параметров, позволяющий Вам выбрать домашнюю страницу и страницу записей. Если Вам не нравится какая-либо из уже имеющихся, нажмите ссылку «Добавить страницу (Add New Page)», чтобы создать новую.

Параметры темы (Theme Options)

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

Параметры темы в Настройщике темы

Дополнительные стили (Additional CSS)

Каскадные таблицы стилей (Cascading Style Sheets — CSS) — это язык, используемый для описания стиля любого документа, написанного на HTML. Сайты WordPress используют CSS для определения цветов, полей, шрифтов и многих других аспектов дизайна. До версии WordPress 4.7 пользователям приходилось напрямую изменять файлы таблиц стилей или использовать редактор внешнего вида (Appearance Editor) для изменения отдельных стилей сайта.

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

Но теперь достаточно открыть дополнительную панель стилей в Настройщике. Здесь Вы можете написать свой собственный CSS-код, который сразу же повлияет на сайт.

Редактирование по клику

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

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

Редактирование по клику в Настройщике темы

Предварительный просмотр различных размеров экрана

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

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

Заключение

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

Оставьте комментарий