Как добавить собственный код на свой сайт WordPress
Написание PHP, CSS и HTML5 для изменения сайта WordPress может быть довольно неприятным, но хорошее руководство может упростить задачу. Это не тот путеводитель. Речь идет только о том, как добавить код на ваш сайт после того, как он будет готов. Но не волнуйтесь – это не менее важно. Поскольку есть несколько способов сделать это, полезно знать различия между различными вариантами. Но сначала два предупреждения:
- Прежде чем что-либо изменять, сделайте резервную копию. Фактически, делайте резервную копию своей работы на протяжении всего процесса. Также полезно иметь отдельный файл, в который можно вставить отброшенные или готовые к использованию фрагменты кода.
- Если вы установили чужую тему, никогда не добавляйте код в файлы functions.php или style.css вашей темы. Если вы это сделаете, то, когда тема будет обновлена, вся ваша тяжелая работа будет уничтожена.
В оставшейся части статьи я рассмотрю некоторые альтернативы, от самых простых до самых сложных.
Плагины WordPress
Так же, как существует несколько типов модификации кода, существует несколько типов подключаемых модулей пользовательского кода. Два наиболее распространенных типа – это PHP и CSS. Как вы, наверное, знаете, PHP управляет архитектурой и функциями WordPress. Итак, если вы пытаетесь изменить основные функции своего веб-сайта, добавить или изменить функцию, существует множество доступных для загрузки плагинов PHP, которые помогут вам в этом.
Точно так же вы, вероятно, тоже знаете, что делает CSS – он делает вещи красивее. И если это все, что вы хотите изменить, пользовательский плагин CSS позволит вам сделать это с минимумом хлопот. На заднем плане скрывается JavaScript, который имеет сложные отношения с плагинами. Чтобы уточнить, это немного отличается тем, что он отлично работает, если вы добавляете его в заголовок, нижний колонтитул или дочернюю тему, но чтобы использовать его в сообщении, вы должны использовать специальный плагин. Что-то вроде CSS и Javascript Toolbox должно помочь. В качестве побочного примечания: ради скорости вашей страницы лучше поместить ее в нижний колонтитул.
Написание собственных плагинов
В Интернете доступно множество фрагментов кода WordPress для изменения, отключения или модификации определенных функций. Однако знание того, где их разместить, имеет решающее значение для функциональности. Например, если у вас есть фрагмент кода, который изменяет функцию плагина, вы хотите, чтобы он работал независимо от того, какую тему вы активировали. То же самое и с фрагментами, которые касаются изменений на уровне всего сайта. Так что в любом случае было бы неплохо создать для них новый плагин. Не волнуйтесь, это не так страшно, как кажется.
Одним из основных преимуществ создания плагина является то, что он позволяет вам активировать или деактивировать плагин по запросу. Это также позволяет просматривать контекстную информацию о плагине на страницах плагина. Единственным серьезным недостатком является то, что он может быть случайно отключен кем-либо, кому разрешено изменять сайт, но строгое предупреждение для них должно предотвратить это.
В качестве примечания, вы также можете создать папку под названием mu-plugins в папке wp-content. Любые вставленные туда файлы PHP всегда будут выполняться, и их нельзя активировать или деактивировать. Благодаря этому пользовательский код не попадает в папки тем и плагинов. Но делайте это только с плагинами, которые вам всегда удобно использовать в фоновом режиме.
Пользовательские файлы CSS
Если планируемые изменения незначительны, вы можете создать файл custom-style.css. Если вы хотите предварительно просмотреть свои изменения перед их внесением, вы всегда можете использовать DevTools, если вы используете Chrome или подобное приложение. Другая возможность – добавить собственный CSS через вашу тему WordPress. Некоторые премиальные темы, такие как наша Total framework, включают опцию панели тем для добавления пользовательского CSS, где вы можете легко найти и настроить его. Кроме того, когда вы обновляете свою тему, настройки панели темы должны оставаться неизменными, поэтому ваш собственный CSS остается неизменным.
Помните, что CSS каскадируется в обратном порядке, то есть правила, которые появляются позже, всегда имеют приоритет над правилами, которые появляются раньше. Таким образом, любой CSS, примененный к отдельному листу, переопределит код страницы по умолчанию. Это также относится к CSS, вставленному в…
Дочерние темы WordPress
Для непосвященных дочерняя тема наследует функциональность другой темы, что позволяет вам изменять свой дизайн по своему желанию (вы можете узнать все, что хотите, в нашем руководстве по дочерним темам WordPress ). Они были придуманы с определенной целью: позволить вам изменять тему без потери ваших изменений при обновлении. Дочерние темы отражают все изменения, которые вы вносите во внешнюю, или «родительскую», тему. Итак, как и при применении эффекта слоя Photoshop, вы на самом деле не редактируете контент; вы можете удалить его в любое время, чтобы вернуть все на круги своя.
Создание дочерней темы, когда вы хотите изменить свой код, избавит вас от многих головных болей, и это довольно просто (как и модификации WordPress). Просто войдите на свой сайт через FTP и создайте папку, а затем создайте файл style.css, соответствующий этой папке. Стандартной практикой является называть его дочерней-темой. После этого все, что вам нужно, – это одна строка в заголовке вашего нового style.css для определения шаблона. Но есть также кое-что, что полезно иметь, – их можно найти на странице WordPress Codex.
Затем внесите необходимые изменения в текущую тему под строкой @import. Единственный недостаток дочерних тем – это объем исследований, которые необходимо провести по родительской теме, прежде чем вы сможете ее изменить, без каких-либо конфликтов или странных побочных эффектов. И помните, что с дочерними темами вам нужно только указать, что будет отличаться от исходной темы. Чтобы применить изменения, просто заархивируйте его, загрузите через страницу «Внешний вид»> «Темы» на панели инструментов WordPress и активируйте через WordPress. Это, конечно, при условии, что ваша родительская тема также загружена.
Отображение кода
Есть еще один тип добавления кода, который мы не рассмотрели: его показ. Если вы веб-дизайнер и хотите показать, как что-то делается, представить это так, чтобы зрители могли копировать и вставлять, важно правильно обозначить это. То, как ваш код будет интерпретироваться WordPress, зависит от того, используете ли вы HTML-раздел редактора Visual Post Editor. Ввод его непосредственно в визуальный редактор поможет нейтрализовать его, но нет возможности поместить его в правильное форматирование или в поле кода. Визуальный редактор просто отформатирует его так же, как обычный текст. С другой стороны, редактор HTML превратит его в код и разрушит ваш сайт. Не волнуйтесь, это можно отменить.
Однако есть компромисс. Вы можете выделить и поместить свой код в блок с помощью тегов и , но это не остановит активацию кода. Все, что он сделает, это поместит его шрифтом montoype в рамку, чтобы показать, что это официальный код. Чтобы остановить его активацию, вы должны изменить активные символы на так называемые забавные персонажи. В наиболее распространенных их версиях, а также тех, которые достаточны для нейтрализации большей части кода, заменяются <и> на & lt; и & gt;, соответственно (вы можете узнать больше о показе кода в нашей статье о написании собственного кода в ваших записях WordPress ).
Как видите, существует множество способов добавить собственный код в WordPress, и я призываю вас поэкспериментировать, поиграть с ними и посмотреть, какие из них подходят вам. Есть ли дополнительные способы добавить пользовательский код, который я пропустил? Дай мне знать в комментариях.
Источник записи: https://www.wpexplorer.com