Огромный сборник статей от WPTec для начинающих

Мнение

Наиболее распространенные ошибки при разработке тем WordPress (и как их исправить)

Отправка темы в каталог тем WordPress.org – отличный способ поделиться своей работой и внести свой вклад в сообщество WordPress. На данный момент в каталоге более 7000 тем, самая популярная из которых превышает 300 000 активных установок . (Не считая Twenty____ тем, которые упакованы с WordPress и имеют миллионы установок.)

Прежде чем отправлять свою тему в каталог, важно сначала понять процесс проверки, потому что, если ваша тема не соответствует этим требованиям, ее можно сразу отклонить.

Темы с 3 и более отдельными проблемами могут быть закрыты как неутвержденные. Однако авторы темы могут повторно отправить тему после исправления проблем.

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

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

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

Загрузка вашей темы

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

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

Примечание. Авторы тем, которые имеют опыт отправки беспроблемных тем, могут подать заявку на получение статуса « доверенных авторов ».

Проблемы с именами

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

Как такое могло быть? Причина в том, что тест проверяет не только каталог, он проверяет всю экосистему WordPress. Если тема была выпущена где-либо (Github, ThemeForest и т. д.) И имеет более 50 активных установок, это имя будет недоступно для использования.

Примечание: если вы выпустили свою тему в другом месте и накопили более 50 установок, вы все равно можете использовать это имя в каталоге.

Неэкранированный вывод

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

Неэкранированный вывод подвергает риску пользователей вашей темы. Вот пример неэкранированного значения ($ title):

1 $title = get_option( 'my_custom_title' );
2 echo '<h2>' . $title . '</h2>';

Проблема с приведенным выше состоит в том, что, хотя мы знаем, какой тип значения $ title должен быть, это строка, мы не проверили, так ли это.

Если хакеру удалось изменить значение my_custom_title в базе данных, ваша тема выведет это значение. Это представляет огромный риск, поскольку они могут заменить предполагаемый вывод встроенным Javascript:

1alert('This is dangerous');

Решение состоит в том, чтобы исключить все выходные данные, чтобы гарантировать, что они включают только тип данных, которые мы ожидаем.

Наш пример можно исправить так:

1 $title = get_option( 'my_custom_title' );
2 echo '<h2>' . esc_html( $title ) . '</h2>';

Обратной стороной использования esc_html является то, что он удаляет все теги HTML. Если $ title выделен полужирным шрифтом или курсивом, например:

1 $title 'This article is <strong>very</strong> useful';
2 echo esc_html( $title );

Слово «очень» не выделяется жирным шрифтом на внешнем интерфейсе; вместо этого будет выведен код <strong> очень </strong>.

Это показывает, почему важно использовать правильные функции экранирования для контекста. Если бы мы ожидали в выводе какой-то HTML-код, лучше было бы использовать wp_kses_post () или wp_kses () и установить параметр $ allowed_html.

Функции, которые выводят данные, также необходимо экранировать:

1 <a href="<?php echo esc_url( get_permalink() ); ?>">

Исключение составляют основные функции WordPress, в названии которых есть символ the_, обычно они уже экранированы.

1 function the_permalink( $post = 0 ) {
2     /**
3      * Filters the display of the permalink for the current post.
4      *
5      * @since 1.5.0
6      * @since 4.4.0 Added the `$post` parameter.
7      *
8      * @param string      $permalink The permalink for the current post.
9      * @param int|WP_Post $post      Post ID, WP_Post object, or 0. Default 0.
10      */
11     echo esc_url( apply_filters( 'the_permalink', get_permalink( $post ), $post ) );
12 }

Непереводимый текст

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

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

Несмотря на простоту реализации, это часто упускается из виду, поскольку это идет вразрез с тем, как люди пишут HTML.

Обычно вы можете сделать что-то вроде этого:

1<h1>404 - Not Found</h1>

Чтобы сделать его переводимым, вам нужно добавить немного PHP:

1 // __ functions are the basis of localization.
2 <h1><?php echo __( '404''text-domain' ); ?>
3
4 // _e functions echo the value.
5 <h1><?php _e( '404''text-domain' ); ?>
6
7 // Escape and echo the string.
8 <h1><?php esc_html_e( '404''text-domain' ); ?>
9
10 // localization and variables.
11 <h1><?php _n( 'One post''%s posts'$count'text-domain' ); ?>

Строки, выводимые функциями, также должны быть готовы к переводу:

1 // not translation-ready :-(
2 <?php next_posts_link( 'Older Entries' ); ?>
3
4 // translation-ready :-)
5 <?php next_posts_link( esc_html__( 'Older Entries', ‘text-domain’ ) ); ?>

Совет: многие примеры кода на codex.wordpress.org не используют функции перевода, поэтому будьте осторожны при их копировании и вставке.

Неправильная постановка ресурсов в очередь

Файлы .css и .js, используемые вашей темой, должны быть поставлены в очередь с использованием правильных функций: wp_enqueue_style () для CSS и wp_enqueue_script () для Javascript.

Распространенной ошибкой является жесткое кодирование скриптов и стилей непосредственно в <head> или ранее </body>. У этого подхода есть две проблемы:

1. Невозможно удалить

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

1 /**
2  * Dequeue the theme javascript.
3  *
4  * Hooked to the wp_enqueue_scripts action, with a late priority (100),
5  * so that it is after the script was enqueued.
6  */
7 function wptavern_dequeue_script() {
8    wp_dequeue_script( 'theme-scripts' );
9 }
10 add_action( 'wp_enqueue_scripts''wptavern_dequeue_script', 100 );

2. Дублирующая загрузка

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

1 /**
2  * Enqueue jQuery
3  *
4  * jQuery will only be loaded once, despite the two enqueues.
5  * jQuery is packaged with WordPress so we don't need to specify a src.
6  */
7 function wptavern_enqueue_script() {
8    wp_enqueue_script( 'jquery' );
9    wp_enqueue_script( 'jquery' );
10 }
11 add_action( 'wp_enqueue_scripts''wptavern_enqueue_script' );

Если бы вместо этого вы жестко запрограммировали jQuery в свой <head>, WordPress не смог бы узнать об этом, и он был бы загружен дважды.

Функциональность плагина-территории

Объем темы должен соответствовать только дизайну и эстетике веб-сайта, все остальные функции должны выполняться самим WordPress или плагинами.

Пытаясь повысить ценность своих тем, авторы тем часто пытаются включить дополнительные функции, например элементы управления SEO или настраиваемые типы сообщений.

Проблема с объединением функциональности в тему заключается в том, что данные не переносятся. Возьмем в качестве примера элементы управления SEO: если пользователь меняет тему, он теряет всю работу, которую он проделал для оптимизации своих страниц. Напротив, при использовании плагина SEO данные и функции не зависят от темы и будут сохранены при изменении темы.

Некоторые примеры функциональности плагинов:

  • Аналитика / Отслеживание
  • SEO контроль
  • Контактные формы
  • Шорткоды
  • Блоки Гутенберга

Совет: если ваш код записывается в базу данных, скорее всего, это территория плагинов. Исключение составляют настройки, связанные с дизайном (положение боковой панели, цвета и т. д.).

Без префикса

Префикс – это способ гарантировать, что ваш код не конфликтует с кодом из плагинов. Пространство имен в PHP – лучший способ добиться того же эффекта. Однако некоторые пользователи все еще используют старые версии PHP (5.2), которые не поддерживают эту функцию.

Джастин Тэдлок поделился списком общих вещей, которые следует ставить префиксом:

  • Имена функций PHP.
  • Имена классов PHP.
  • Глобальные переменные PHP.
  • Крючки Action / Filter.
  • Скрипт обрабатывает.
  • Стильные ручки.
  • Имена размеров изображения.

Источник: https://themereview.co/prefix-all-the-things/

1 // function example.
2 my_prefix_example();
3
4 // class example.
5 class My_Prefix_Example { … }
6
7 // action and filter example.
8 do_action( 'my_prefix_action' );
9 apply_filters( 'my_prefix_filter'$values );
10
11 // enqueue examples.
12 wp_enqueue_script( 'my_prefix_script', get_template_directory_uri() . '/js/custom-script.js' );
13 wp_enqueue_style( 'my_prefix_style', get_template_directory_uri() . '/css/styles.css' );
14
15 // image size example.
16 add_image_size( 'my_prefix_image_size', 220, 180 ); // 220 pixels wide by 180 pixels tall.

Исключение: при постановке сторонних ресурсов в очередь не добавляйте префикс:

1 // enqueuing a third-party script (chosen.js).
2 wp_enqueue_script( 'chosen', get_template_directory_uri() . '/js/chosen.js' );

Проблемы с лицензированием

Ваша тема и все ее файлы должны быть на 100% совместимы с GPL. Сюда входят изображения, библиотеки, скрипты и шрифты.

На всех сторонних ресурсах должна быть указана информация об их источнике и лицензии.

Это требование может быть особенно сложным, поскольку не все лицензии совместимы с GPL. Лицензия Unsplash имеет только одно ограничение:

«Эта лицензия не включает право компилировать фотографии из Unsplash для воспроизведения аналогичной или конкурирующей услуги».

Однако этого ограничения достаточно, чтобы сделать его несовместимым с GPL, и поэтому вы не увидите изображений Unsplash, включенных в темы wordpress.org.

Список лицензий, совместимых с GPL, доступен здесь – https://www.gnu.org/licenses/license-list.html#GPLCompatibleLicenses

В последнее время stocksnap.io был наиболее распространенным источником изображений в каталоге, поскольку все изображения, которые они перечисляют, имеют лицензию CC0 (совместимую с GPL).

Ошибки при создании снимков экрана

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

Образы также должны соответствовать тем же лицензионным требованиям.

Бонус: используйте стандарт кодирования

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

Хотя нет никаких требований к стандартам кодирования, следование им делает ваш код более легким для чтения, понимания и сопровождения. Я лично использую и рекомендую « Стандарты кодирования WordPress », хотя есть и другие.

Использование PHP_CodeSniffer и набора правил WordPress в редакторе кода может значительно упростить соблюдение стандарта – https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards

Заключение

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

Рекомендуем прочитать
Мнение

Плагин Delete Me для WordPress помогает владельцам веб-сайтов предоставить право на забвение GDPR

Мнение

Команда Gutenberg наращивает юзабилити-тестирование в WordCamp US

Мнение

Плагин распространителя теперь в бета-версии: новое решение для синдикации контента WordPress от 10up

Мнение

Gutenberg 1.8 добавляет большую расширяемость для разработчиков плагинов

Подпишитесь на рассылку
и будьте в курсе новостей Wordpress

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *