Как добавить тёмный режим на ваш веб-сайт WordPress

Вы желаете добавить черный режим на собственный веб-сайт WordPress?

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

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

Добавление темного режима на ваш сайт WordPress (легко)

Что такое черный режим и для чего его добавлять на собственный веб-сайт?

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

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

Если у вас есть устройство iPhone либо Android, вы сможете переключиться в черный режим, просто используя переключатель.

Не считая того, на собственном компе вы сможете просматривать сайты в черном режиме при помощи расширения Chrome, такового как Night Eye. Ах так смотрится сайт WPBeginner с внедрением этого расширения:

Веб-сайт WordPress, просмотренный с помощью расширения Chrome Night Eye

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

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

Просмотр YouTube с включенной опцией темной темы

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

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

Краешек: Для вас нужен сайт с черной цветовой схемой, даже если устройство юзера находится в обыкновенном либо дневном режиме? Тогда ознакомьтесь с нашим перечнем наилучших черных тем для WordPress.

Добавление темного режима на ваш веб-сайт WordPress

Во-1-х, для вас нужно установить и активировать плагин WP Dark Mode. Для получения дополнительной инфы см. Наше пошаговое управление по установке плагина WordPress.

Опосля активации перейдите в Опции »WP Dark Mode в админке WordPress и перейдите на вкладку Общие опции. Вы должны быть перенаправлены туда автоматом.

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

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

Страница общих настроек для плагина WP Dark Mode

Просто посетите собственный сайт, и вы увидите переключатель в правом нижнем углу. Нажмите на нее, чтоб одномоментно переключить ваш веб-сайт в черный режим на вашем устройстве:

Переключатель темного режима теперь отображается на сайте для посетителей.

На Опции »WP Dark Mode страничка. Но в бесплатном плагине они достаточно ограничены.

К примеру, для вас просто необходимо щелкнуть вкладку Display Settings, чтоб поменять стиль плавающего переключателя:

Выбор типа переключателя ночного режима в настройках дисплея

Вы также сможете настроить цвета темного режима при помощи вкладки Style Settings:

Выбор цветовой схемы темного режима в настройках стиля

Не забудьте надавить клавишу «Сохранить опции» после внесения всех конфигураций.

Примечание: В бесплатной версии WP Dark Mode вы получаете лишь 1-ые 2 стиля плавающего переключателя и 1-ые 2 предустановки цвета на выбор.

Проф версия WP Dark Mode дает еще больше вариантов дизайна, также возможность включать черный режим в определенное время и возможность добавлять свой код CSS.

Добавление темного режима в админку WordPress

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

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

Просто зайдите в Опции »WP Dark Mode страничку и щелкните вкладку Общие опции. Потом переведите переключатель «Enable Backend Darkmode» в положение «включено». Не забудьте надавить клавишу «Сохранить опции» понизу странички:

Включите переключатель Enable Backend Dark Mode, чтобы вы могли использовать темный режим в админке WordPress.

Сейчас вы увидите новейший переключатель в верхней панели вашей админки:

Переключатель в админке WordPress для переключения между светлым (нормальным) и темным для вашего интерфейса администратора.

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

Краешек: Если на вашем веб-сайте несколько юзеров WordPress, любой может включать и выключать черный режим по собственному усмотрению.

Так как «Черный режим» не является цветовой схемой админа, вы сможете просто применять его вкупе с имеющейся цветовой схемой админа WordPress. Чтоб установить это, просто перейдите в Юзеры »Профиль и изберите вариант в разделе «Цветовая схема администратора».

Направьте внимание, что для вас необходимо будет отключить черный режим, чтоб узреть характеристики цветовой схемы админа:

Выбор цветовой схемы администратора в WordPress на странице вашего профиля пользователя

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

Включение темного режима в редакторе блоков WordPress

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

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


Поделись с друзьями:

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