Как добавить пользовательские фрагменты кода в WordPress (самый простой метод)

Опубликовано: 2023-09-11

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

Изучение WordPress — это не только темы и инструменты. Иногда именно неуловимая сила фрагментов кода придает сайту уникальный оттенок.

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

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

Что такое фрагменты кода в WordPress?

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

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

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

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

Как добавить пользовательские фрагменты кода в WordPress

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

В этой статье

  • Что такое фрагменты кода в WordPress?
  • 1. Установите и активируйте плагин WPCode.
  • 2. Создайте собственный код (PHP, CSS, HTML).
  • 3. Добавьте свой собственный код (новый фрагмент)
  • 4. Обработка ошибок в пользовательском коде
  • 5. Управление собственными фрагментами кода
  • Часто задаваемые вопросы о пользовательских фрагментах кода

1. Установите и активируйте плагин WPCode.

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

The WPCode homepage

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

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

2. Создайте собственный код (PHP, CSS, HTML).

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

Имейте в виду, что вам потребуются некоторые знания кодирования для создания собственного кода, будь то в формате PHP, CSS или HTML.

В этом руководстве мы создадим собственный код, который предотвращает конфликты тем, из-за которых значения Radio и Checkbox не отображаются правильно в WPForms.

.wpforms-container input[type=radio] {
	-webkit-appearance: radio !important;
	-moz-appearance: radio !important;
	appearance: radio !important;
}

.wpforms-container input[type=checkbox] {
	-webkit-appearance: checkbox !important;
	-moz-appearance: checkbox !important;
	appearance: checkbox !important;
}

.wpforms-container input[type=radio]:checked:before,
.wpforms-container input[type=radio]:before,
.wpforms-container input[type=checkbox]:checked:before,
.wpforms-container input[type=checkbox]:before,
.wpforms-container input[type=radio]:checked:after,
.wpforms-container input[type=radio]:after,
.wpforms-container input[type=checkbox]:checked:after,
.wpforms-container input[type=checkbox]:after {
	display: none !important;
}

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

3. Добавьте свой собственный код (новый фрагмент)

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

Add new snippet WPCode

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

Нажмите кнопку «Использовать фрагмент» рядом с опцией «Добавить свой собственный код (новый фрагмент) , чтобы вставить новый код.

Add your custom code snippet

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

Create custom snippet WPCode

Поскольку мы создали код в CSS, в раскрывающемся меню «Тип кода» мы выбрали «Фрагмент CSS» . Вы можете изменить его на основе созданного вами кода.

Code Type WPCode

Затем прокрутите вниз до вкладки «Вставка» . Теперь выберите «Автовставка» и в раскрывающемся списке «Местоположение» выберите параметр «Заголовок всего сайта ».

Insert code in Site Wide Header

В зависимости от типа кода, который вы создаете, вы даже можете добавить его в качестве короткого кода [/] на свои страницы/сообщения.

Если вы хотите присвоить теги фрагменту кода, прокрутите вниз до раздела «Основная информация» . Это поможет вам классифицировать примеры кода по темам и функциям.

Если вы хотите отображать несколько фрагментов в одном месте, параметр «Приоритет» позволяет вам выбрать порядок их обработки.

Assign tags WPCode

Далее, сложная функция Smart Conditional Logic позволяет отображать или скрывать автоматически вставленные фрагменты на основе набора критериев.

Smart Conditional Logic WPCode

Наконец, все, что вам нужно сделать, это установить флажок «Активный» и нажать кнопку «Сохранить фрагмент» , прежде чем выходить из плагина!

Save snippet WPCode

4. Обработка ошибок в пользовательском коде

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

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

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

Error detection WPCode

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

Smart code validation WPCode

При наведении курсора мыши на проблему появится всплывающее окно с инструкциями по ее устранению.

5. Управление собственными фрагментами кода

Если у вас есть несколько фрагментов кода, WPCode позволяет невероятно легко управлять ими с помощью удобного интерфейса и библиотеки фрагментов.

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

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

Managing snippets WPcode

У вас также есть возможность экспортировать отдельные фрагменты кода или экспортировать их все сразу. Просто перейдите в раздел «Фрагменты кода» » «Инструменты» и выберите опцию «Экспорт» .

Export snippets WPCode

Плагин также позволяет импортировать фрагменты, если вы переносите свой сайт на новый сервер. Перейдите в раздел «Фрагменты кода» «Инструменты» «Импорт» и загрузите файл экспорта.

Import snippets WPCode

Часто задаваемые вопросы о пользовательских фрагментах кода

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

Какой менеджер фрагментов кода для WordPress лучший?

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

Как добавить CSS в фрагмент кода в WordPress?

В WPCode просто перейдите в раздел + Добавить новый , введите нужный CSS и убедитесь, что вы выбрали тип CSS перед сохранением и активацией.

Как добавить собственный код в WordPress без плагинов?

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

Как добавить собственный PHP-код в WordPress?

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

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

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

Создайте свою форму WordPress прямо сейчас

Готовы создать свою форму? Начните сегодня с самого простого плагина для создания форм WordPress. WPForms Pro включает в себя множество бесплатных шаблонов и предлагает 14-дневную гарантию возврата денег.

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