Как избежать распространенных ошибок при разработке темы WordPress
Опубликовано: 2021-02-16WordPress известен своей невероятной гибкостью, особенно когда речь идет о разработке тем и плагинов. Если вы когда-нибудь захотите увидеть доказательства, просто спросите группу разработчиков, как бы они реализовали ту или иную функцию. Скорее всего, вы получите несколько разных методов для достижения одного и того же результата. Форумы поддержки завалены подобными примерами.
Но вместе с этой гибкостью легко сделать что-то «неправильным» способом. Теперь, в этом случае, «неправильно» означает, что что-то либо неэффективно, либо немного сложно поддерживать в будущем. Хотя это может работать в смысле функциональности, обычно есть лучшие способы добиться цели.
Давайте рассмотрим пять наиболее распространенных ошибок, встречающихся при разработке тем, а также альтернативы, которые избавят вас от головной боли в будущем.
1. Использование абсолютных URL-адресов в шаблонах
Если вы когда-либо смотрели на HTML-код, создаваемый страницей или постом WordPress, вы заметите, что и изображения, и внутренние ссылки используют абсолютные (полные) URL-адреса. Но это не лучший способ добиться цели при добавлении кода в шаблоны вашей темы.
В качестве примера предположим, что вы разрабатываете веб-сайт, использующий временный URL-адрес. Жестко запрограммированный абсолютный URL-адрес в шаблоне означает, что вам придется вручную вносить изменения в код, когда вы будете готовы запустить сайт на его постоянном домене. Хотя это можно сделать, слишком легко забыть обо всех местах, где может скрываться этот тип кода.
В WordPress есть встроенные способы определения правильного URL-адреса, которые можно получить прямо из области « Settings > General
» на панели инструментов.
Для ссылки повторение esc_url( home_url() )
предоставит полный путь к домашней странице. Таким образом, вместо явного размещения URL-адреса в коде вы можете добавить простую ссылку на домашнюю страницу следующим образом:
<a href="<?php echo esc_url( home_url() ); ?>" />Home</a>
Более того, вы также можете использовать это, чтобы указать на второстепенные страницы. Например, если мы хотим сделать ссылку на страницу «О нас» нашего сайта, мы можем использовать следующий код:
<a href="<?php echo esc_url( home_url() ); ?>/about-us/" />About Us</a>
Аналогичный фрагмент работает и для изображений. В этом примере извлекается изображение из подпапки /images/
нашей активной темы:
<img src="<?php echo esc_url( get_stylesheet_directory_uri() ) ; ?>/images/hello.png" />
2. Добавление скриптов и стилей непосредственно в шаблон
Использование сторонних скриптов и стилей с WordPress — это отдельный мир. Когда вы впервые начинаете создавать темы, у вас может возникнуть соблазн просто поместить теги <script>
или <style>
или даже код для встраивания Google Font прямо в заголовок вашей темы. Обычно так дела обстоят со статическими HTML-сайтами, поэтому здесь имеет смысл сделать то же самое.
Но, как и почти все остальное в WordPress, есть лучший способ сделать это. Вместо этого воспользуйтесь wp_enqueue_script()
и wp_enqueue_style()
, которые добавляют скрипты и таблицы стилей в нужные для вас места. Это также значительно упрощает управление активами, так как все вызывается из файла functions.php
вашей темы.
Вместо того, чтобы изобретать велосипед здесь, в Руководстве по темам WordPress есть фантастическое руководство о том, как правильно добавлять сценарии и стили в вашу тему.
3. Вызов внешних экземпляров jQuery
В соответствующей заметке один из скрытых секретов WordPress заключается в том, что он уже включает копию jQuery вместе с несколькими популярными функциями пользовательского интерфейса. Таким образом, вам не нужно устанавливать jQuery или вызывать его удаленно. Это упрощает использование популярной библиотеки JavaScript и реализацию таких элементов, как вкладки, средства выбора даты, диалоговые окна и многое другое.
Единственная загвоздка в том, что вам нужно специально включить элементы, которые вы хотите использовать, в файле functions.php
вашей темы. Хотя это создает некоторую кривую обучения, это также сокращает раздувание.
И, по правде говоря, реализовать желаемый элемент пользовательского интерфейса jQuery не так уж сложно. Например, чтобы включить использование вкладок пользовательского интерфейса jQuery, просто добавьте следующий фрагмент в файл functions.php
:
function my_jquery_elements() { wp_enqueue_script( 'jquery-ui-tabs', array('jquery')); add_action( 'template_redirect', my_jquery_elements ', 10 );
Это говорит WordPress загрузить элемент из уже существующей библиотеки. Оттуда спроектируйте свои вкладки и определите их, как указано в документации пользовательского интерфейса jQuery.
4. Зайти слишком далеко
Возможность добавлять настраиваемые поля и настраиваемые типы сообщений может значительно облегчить жизнь как разработчикам, так и редакторам контента сайта. Они предлагают удобство, лучшую организацию контента и более интуитивно понятный UX. Но иногда мы заходим слишком далеко.
Например, я большой поклонник настраиваемых полей. Но даже я признаю, что были времена, когда я настраивал тему до негибкости. Поля отлично подходят для настроек, когда мы точно знаем, какой контент нужно будет ввести — например, поля профиля сотрудника.
Однако это может привести к путанице, когда есть несоответствия в типах контента, который кто-то хочет добавить. Клиенты печально известны наличием «незначительных» исключений в контенте, которые могут затруднить использование настроек. Условная логика может объяснить некоторые из них, но вы можете зайти так далеко, пока пользовательский интерфейс не выйдет из-под контроля.
Для этого типа настройки нет жестких и быстрых правил. Единственное, что мы действительно можем сделать, это использовать наше лучшее суждение о том, что следует настроить, а что лучше оставить либо редактору контента WordPress, либо даже нишевому плагину. Когда мы добавляем поля или типы сообщений, просто знайте, что со временем все может измениться, и старайтесь строить с учетом этого.
5. Отсутствие комментария к коду
Я собираюсь сделать еще одно признание: комментирование кода не является моей сильной стороной. Дело не в том, что я вообще не использую комментарии, а в том, что они не очень красноречивы. Обычно я указываю начало и конец конкретных элементов без особого понимания между ними. Должен ли я делать больше? Наверное так.
Комментирование важно, потому что оно, по крайней мере, обеспечивает некоторые точки отсчета в коде. При копании файлов PHP или JS, содержащих более одного элемента, вам нужно знать, где найти конкретный элемент.
Даже если вы единственный, кто когда-либо будет редактировать этот код, комментарии настоятельно рекомендуются. Если, например, вам нужно что-то изменить через шесть месяцев, маловероятно, что вы вспомните точное место, где разместили фрагмент кода.
Итак, я не собираюсь быть большим лицемером и умоляю вас комментировать все очень подробно. Но я скажу, что даже минимальные усилия облегчают дальнейшее обслуживание для вас или другого разработчика, которому придется прочесывать вашу работу.
Лучшие методы с течением времени
Создание собственной темы WordPress может быть отличным опытом. Но требуется немалая практика, чтобы разобраться в тонкостях создания хорошо закодированной и простой в обслуживании темы. Чем больше опыта вы приобретете, тем больше будут развиваться ваши техники.
Я могу честно сказать, что первые несколько тем, которые я собрал, были далеко не такими эффективными, как сейчас. И я также уверен, что они все еще могут быть не на высоте, если смотреть их действительно опытным разработчиком. В этом смысле наша эволюция постоянна.
Наконец, я хотел бы отметить, что я лично сделал каждую из ошибок, упомянутых выше. Только путем проб и ошибок, а также нескольких посещений Кодекса я узнал, как начать делать что-то «Путь WordPress».
Урок в том, что мы все будем делать ошибки. Но каждый дает нам возможность учиться и совершенствоваться.