Как редактировать HTML в редакторе кода WordPress (руководство для начинающих)

Вы ищете простой способ редактирования HTML на вашем сайте WordPress?? Язык гипертекстовой разметки или HTML - это код, который указывает веб-браузеру,...

Вы ищете простой способ редактирования HTML на вашем сайте WordPress??

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

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

Почему вы должны редактировать HTML в WordPress?

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

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

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

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

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

Примечание: Если вы не хотите редактировать HTML, но при этом хотите получить все возможности настройки, то мы рекомендуем использовать конструктор страниц WordPress, например, SeedProd.

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

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

  • Как редактировать HTML в редакторе блоков WordPress
  • Как редактировать HTML в классическом редакторе WordPress
  • Как редактировать HTML в виджетах WordPress
  • Как редактировать HTML в редакторе тем WordPress
  • Как редактировать HTML в WordPress с помощью FTP
  • Простой способ добавления кода в WordPress

Как редактировать HTML в редакторе блоков WordPress

В редакторе блоков WordPress есть несколько способов редактирования HTML вашего поста или страницы.

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

Для начала перейдите в панель управления WordPress, а затем добавьте новый пост/страницу или отредактируйте существующую статью. После этого нажмите на знак плюс (+) в левом верхнем углу и добавьте блок ‘Custom HTML’.

Добавление пользовательского HTML-блока в WordPress

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

Пользовательский HTML-код в редакторе WordPress

Другой способ добавить или изменить HTML-код в редакторе блоков WordPress — это редактирование HTML конкретного блока.

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

Нажмите на три точки и выберите редактировать как HTML

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

Редактирование HTML отдельного блока

Если вы хотите отредактировать HTML всего поста, то вы можете использовать «Редактор кода» в редакторе блоков WordPress.

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

Доступ к редактору кода

Как редактировать HTML в классическом редакторе WordPress

Если вы используете классический редактор WordPress, то вы можете легко редактировать HTML в режиме просмотра текста.

Чтобы получить доступ к виду «Текст», просто отредактируйте запись блога или добавьте новую. Когда вы окажетесь в классическом редакторе, нажмите на вкладку «Текст», чтобы увидеть HTML вашей статьи.

Нажмите на Текст в классическом редакторе для редактирования HTML

После этого вы можете редактировать HTML-код вашего контента. Например, вы можете выделять различные слова жирным шрифтом, использовать в тексте курсив, создавать списки, добавлять оглавление и многое другое.

Как редактировать HTML в виджетах WordPress

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

В WordPress использование виджета Custom HTML может помочь вам настроить боковую панель, нижний колонтитул и другие области виджетов. Например, вы можете вставить контактные формы, карты Google, кнопки призыва к действию (CTA) и другой контент.

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

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

Нажмите на значок плюса, чтобы добавить виджет

Затем найдите виджет Custom HMTL в меню блока виджетов и нажмите на него, чтобы автоматически добавить его в область виджетов.

Добавление пользовательского HTML-виджета в WordPress

После этого вы можете нажать на свой пользовательский HTML-виджет и ввести HTML-код. Когда вы закончите, не забудьте нажать кнопку «Обновить» в правом верхнем углу экрана.

Добавьте пользовательский HTML-код в блок виджетов

Теперь вы можете посетить свой сайт, чтобы увидеть пользовательский виджет HTML в действии.

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

Как редактировать HTML в редакторе тем WordPress

Другим способом редактирования HTML вашего сайта является редактор тем WordPress (редактор кода).

Однако мы не рекомендуем вам напрямую редактировать код в редакторе темы. Малейшая ошибка при вводе кода может сломать ваш сайт и заблокировать вам доступ к приборной панели WordPress.

Кроме того, если вы обновите свою тему, то все ваши изменения будут потеряны.

Тем не менее, если вы собираетесь редактировать HTML с помощью редактора тем, то хорошей идеей будет сделать резервную копию вашего сайта перед внесением изменений.

Затем перейдите к Внешний вид » Редактор тем с панели управления WordPress. Теперь вы увидите предупреждение о прямом редактировании файлов темы.

Предупреждение редактора тем в WordPress

Как только вы нажмете кнопку «Я понял», вы увидите файлы и код вашей темы. Отсюда вы можете выбрать файл, который хотите отредактировать, и внести изменения.

Редактор тем WordPress

Как редактировать HTML в WordPress с помощью FTP

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

Это стандартная функция, которая поставляется со всеми хостинг-аккаунтами WordPress.

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

Для начала вам нужно выбрать программу FTP. В этом руководстве мы будем использовать FileZilla, так как это бесплатный и удобный FTP-клиент для Windows, Mac и Linux.

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

Как только вы войдете в систему, вы увидите различные папки и файлы вашего сайта в колонке «Удаленный сайт». Перейдите к файлам вашей темы по адресу wp-content » тема.

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

Перейдите к файлам вашей темы в FTP-клиенте

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

Многие FTP-клиенты позволяют просматривать и редактировать файлы и автоматически загружать их после внесения изменений. В FileZilla вы можете сделать это, нажав на опцию «Просмотр/редактирование».

Загрузите и отредактируйте файл вашей темы

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

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

Простой способ добавить код в WordPress

Самый простой способ добавить код в WordPress — использовать WPCode.

Плагин WPCode WordPress

Команда WPBeginner разработала этот плагин, чтобы вы могли легко добавить код на свой сайт за считанные минуты, и мы сделали его 100% бесплатным для использования.

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

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

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

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

Далее вы можете добавить HTML-код на свой сайт в поля header, body и footer.

Например, допустим, вы хотите отобразить на своем сайте панель оповещений. Вы можете просто ввести HTML-код в поле ‘Body’ и нажать кнопку ‘Save Changes’.

Добавление HTML-кода с помощью плагина WPCode

Кроме того, с помощью плагина можно добавить код отслеживания Google Analytics и пиксель Facebook (признана экстремистской организацией на территории РФ) в заголовок или добавить кнопку Pinterest в нижний колонтитул вашего сайта.

С WPCode легко решить, куда выводить код. Например, вы можете автоматически отображать некоторый HTML-код в начале или конце каждого поста.

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

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

Источник: www.wpbeginner.com

Оцените статью
Добавить комментарий