Огромный сборник статей от WPTec для начинающих

Начинающим

Как использовать WordPress Theme Customizer как профессионал (полное руководство)

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

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

В этой статье мы рассмотрим панели по умолчанию и покажем, как использовать настройщик тем WordPress в качестве профессионала.^

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

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

Вы можете получить к нему доступ, войдя в свою админ-панель WordPress, а затем перейдя в Внешний вид »Настроить на левой боковой панели вашей админ-панели WordPress. Это откроет интерфейс Customizer с вашей текущей темой.^

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

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

Для этого вам нужно перейти на страницу «Внешний вид» Темы.

Затем наведите курсор мыши на любую установленную тему и нажмите кнопку «Просмотр в реальном времени», чтобы открыть страницу настройщика темы WordPress.^

Как использовать WordPress Theme Customizer

После открытия настройщика тем WordPress вы увидите все параметры настройки в левой части экрана и предварительный просмотр вашего веб-сайта в правой части.^

Настройщик тем WordPress поставляется с набором панелей по умолчанию, независимо от используемой темы.

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

Примечание: расширенные темы WordPress добавят дополнительные панели настроек для дополнительных настроек (подробнее об этом позже).

Давайте рассмотрим параметры по умолчанию, доступные в настройщике тем WordPress.

Панель идентификации сайта: добавление заголовка, логотипа и Favicon

Панель «Идентификация сайта» в настройщике тем WordPress позволяет добавлять или изменять заголовок и слоган вашего сайта.

По умолчанию WordPress добавляет «просто еще один сайт WordPress» в качестве лозунга сайта.

Рекомендуется изменить его после установки WordPress на свой сайт. Вы также можете оставить его пустым, если хотите.^

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

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

WordPress Theme Customizer: меняйте цвета на своем сайте

Элементы управления на панели «Цвета» будут в основном различаться в зависимости от используемой темы WordPress.

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

Другие темы WordPress могут предлагать различные варианты цвета для элементов сайта, таких как: заголовки, ссылки, основной текст, фон вашего сайта и т. д.

Добавление навигационных меню в настройщик тем

Панель «Меню» позволяет создавать навигационные меню и контролировать их местоположение на вашем веб-сайте.

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

Чтобы создать новое меню, вам нужно нажать на кнопку «Создать новое меню».

После этого вам нужно будет дать название вашему меню, чтобы вы могли легко управлять им позже. Вы также можете выбрать местоположение в меню и затем нажать «Далее» для продолжения.^

Чтобы добавить элементы в это меню, вам нужно нажать на кнопку «Добавить элементы», чтобы открыть новую панель. Теперь вы можете добавлять пользовательские ссылки, страницы, сообщения, категории и теги в качестве пунктов меню.^

Чтобы изменить порядок элементов, вы можете щелкнуть ссылку «Изменить порядок», а затем с помощью значков стрелок настроить элементы меню.

Контроль виджетов на вашем сайте в Theme Customizer

Панель «Виджеты» позволяет добавлять и управлять виджетами на вашем сайте.

Нажав на нее, вы увидите различные места, где вы можете добавить виджеты. Это будет зависеть от используемой вами темы.

Например, тема «Двадцать семнадцать» предлагает 3 местоположения виджетов, тогда как тема «Двадцать девятнадцать» содержит только одно местоположение.^

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

Чтобы добавить новый виджет, вам нужно нажать на кнопку «Добавить виджет». Откроется новая панель, где вы увидите список всех доступных виджетов.^

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

Панель настроек домашней страницы в Theme Customizer

По умолчанию WordPress отображает последние сообщения блога на вашей домашней странице.

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

Чтобы использовать пользовательскую домашнюю страницу, необходимо выбрать переключатель «Статическая страница» на панели «Параметры домашней страницы».^

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

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

Дополнительная панель CSS для добавления пользовательских CSS

Хотите добавить собственный CSS-код для стилизации своего сайта? Вы можете сделать это на дополнительной панели CSS.

Опытные и продвинутые пользователи WordPress часто настраивают свой сайт, добавляя код CSS непосредственно в файл style.css своей темы. Это добавляет дополнительные шаги, такие как FTP-доступ к вашему хостингу WordPress, изменение файлов тем и т. Д.

Более простое решение для начинающих – добавить свой собственный код CSS на панель «Дополнительные CSS» в настройщике тем WordPress. Это позволит вам вносить изменения в свой сайт и видеть их вживую в правой части экрана.^

Когда вы начнете писать CSS-код, WordPress автоматически предложит вам атрибуты на основе введенных вами букв. Он также будет отображать сообщения об ошибках, если вы не написали правильную инструкцию CSS.

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

Другие параметры настройки темы

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

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

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

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

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

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

Внизу панели Theme Customizer вы найдете три значка и ссылку «Скрыть элементы управления».^

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

Ссылка «Скрыть элементы управления» полезна для скрытия панели WordPress Customizer, чтобы вы могли правильно просматривать свой сайт в режиме рабочего стола.

Опубликовать, сохранить или запланировать настройки настройщика

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

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

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

Для этого нужно нажать на значок шестеренки прямо рядом с кнопкой «Опубликовать». Это откроет панель действий.^

Здесь вы найдете три варианта: «Опубликовать», «Сохранить черновик» и «Расписание».

Вам нужно выбрать переключатель «Сохранить черновик» на панели «Действие», а затем нажать кнопку «Сохранить черновик», чтобы сохранить изменения.

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

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

Наконец, если вы хотите сбросить неопубликованные изменения, вы можете нажать на ссылку «Отменить изменения» на панели «Действие».

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

Есть моменты, когда вы хотите проверить, как новая тема будет выглядеть на вашем сайте. Однако вы не хотите активировать их на своем веб-сайте.

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

На панели настройщика вы найдете название вашей активной темы и кнопку «Изменить».^

Если вы нажмете на эту кнопку, WordPress отобразит все установленные вами темы в правой части страницы.

Чтобы проверить конкретную тему, вам нужно нажать на кнопку Live Preview.^

Вы также можете просмотреть темы из репозитория тем WordPress. Для этого нужно установить флажок «Темы WordPress.org» на левой панели.

Это покажет темы из каталога WordPress.org. Вы можете нажать кнопку «Установить и просмотреть», чтобы выбрать понравившуюся тему.^

Вы также можете отфильтровать темы, нажав кнопку «Фильтровать темы» в правом верхнем углу экрана.

Примечание: мы рекомендуем использовать промежуточный веб-сайт WordPress для тестирования новых тем вместо использования настройщика на живом сайте.

Импорт или экспорт настроек настройщика тем

Знаете ли вы, что вы можете импортировать и экспортировать настройки настройщика темы?

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

Для получения подробных инструкций вы можете следовать нашему руководству по импорту и экспорту настроек настройщика темы в WordPress.

WordPress Theme Customizer Альтернативы

Хотя WordPress Customizer позволяет вам вносить изменения в свой сайт, количество элементов управления будет зависеть от используемой темы.

Что, если вам нравится ваша тема, но вы хотите, чтобы в ней были дополнительные настройки?

В этом случае лучшее решение – использовать один из двух плагинов настройки, который работает вместе с настройщиком тем WordPress.

CSS Hero^

CSS Hero – это плагин WordPress, который позволяет настраивать ваш сайт без написания ни одной строки кода. У вас есть свобода стилизовать каждый элемент вашего сайта без каких-либо хлопот.

Хотите настроить страницу входа на свой сайт WordPress? CSS Hero позволяет сделать это в течение нескольких минут.

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

Конструктор страниц(это видео)

Beaver Builder – один из лучших плагинов WordPress для создания страниц на рынке. Это позволяет создавать потрясающие страницы для вашего сайта, используя интерфейс перетаскивания.

Самое приятное, что Beaver Builder работает практически со всеми темами WordPress. Это позволяет вам использовать его с вашей текущей темой.

Beaver Builder поддерживает использование шорткодов и виджетов. Он также предлагает различные типы модулей, которые вы можете использовать для легкого стиля вашего сайта. См. Наше руководство о том, как создавать собственные макеты в WordPress для получения подробных инструкций.

Вы также можете использовать Beaver Builder для создания полностью настраиваемой темы WordPress без написания кода.

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

Если вам понравилась эта статья, пожалуйста, подпишитесь на наш канал на YouTube, чтобы получить больше видеоруководств по WordPress. Вы также можете подписаться на нас в Twitter и Facebook.

 

 

Рекомендуем прочитать
Начинающим

Как удалить панель приветствия в панели управления WordPress

Начинающим

Как правильно перейти от Squarespace к WordPress

Начинающим

55 самых полезных советов, хитростей и хаков для WordPress

Начинающим

Как настроить отслеживание конверсий WooCommerce (пошаговая инструкция)

Подпишитесь на рассылку
и будьте в курсе новостей Wordpress

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *