Как использовать редактор внешнего вида в WordPress

WordPress-внешний вид-editor.png


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

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

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

Как редактировать темы с помощью редактора внешнего вида

Когда вы будете готовы узнать больше о WordPress и запачкать руки, набрав какой-то пользовательский код, перейдите к Внешний вид -> Редактор. Этот встроенный редактор позволяет изменять код, хранящийся в шаблонах тем и файлах стилей. Как только вы откроете его, файл style.css, который использует ваша текущая тема, будет автоматически отображаться перед вами.

Редактор внешнего вида WordPress

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

Как выбрать файлы для редактирования

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

Шаблоны

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

Быть осторожен

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

Пример: как изменить размер шрифта с помощью редактора внешнего вида

Чтобы показать вам, как работает редактор, мы собираемся изменить размер шрифта текста в сообщениях в теме «Двадцать семнадцать»..

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

Осмотреть элементы

Проверять элементы в Google Chrome

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

  1. Откройте любой пост из вашего блога
  2. Выберите текст сообщения
  3. Щелкните правой кнопкой мыши на выбранном элементе и выберите «Проверить» или «Проверить элемент» (в зависимости от используемого браузера).
  4. В новом открывшемся разделе или окне найдите выделенный

    элемент

Осмотреть элементы абзаца

Класс также должен быть виден на вкладке «Стили». Если вы щелкнете по стилю, ваш браузер должен открыть таблицу стилей и позволить вам редактировать CSS прямо из браузера. Вы можете использовать эту функцию для тестирования пользовательского кода CSS перед тем, как вносить изменения на свой сайт. Так как мы хотели изменить размер шрифта текста в постах, следующий CSS-код отвечает нашим интересам:

п {
размер шрифта: 50 пикселей;
}

Применять изменения

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

  1. Перейдите к Внешний вид -> Редактор
  2. Если еще не выбран, выберите Таблица стилей (style.css) файл из списка на правой стороне
  3. Найти класс «р»
  4. Добавьте «font-size: 50px;» (весь код должен выглядеть так, как мы написали выше)
  5. Нажмите кнопку «Обновить файл»

Изменить размер шрифта абзаца

Новый стиль сохранен, и вы готовы перезагрузить сайт. Откройте любой пост, чтобы увидеть изменение размера текста. Если вы не видите разницу и уверены, что правильно настроили код, убедитесь, что вы очистить кеш браузера или нажать CTRL + F5 обновить страницу.

Будьте осторожны при работе с редактором внешнего вида

Редактор внешнего вида – это замечательный инструмент для быстрого изменения файлов шаблонов и таблиц стилей. Но чтобы извлечь из этого максимум пользы, важно, чтобы вы были полностью уверены в изменениях, которые вы делаете. Любые изменения в файлах PHP могут заблокировать ваш сайт, пока вы не исправите их через FTP. Поэтому при работе с файлами PHP мы рекомендуем вам работать с локальным файлом, который вы можете передавать по FTP, сохраняя при этом исходную резервную копию. Если вы вносите изменения в таблицы стилей, не забывайте о дополнительных функциях CSS, которые были представлены несколько месяцев назад.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Liked Liked