Как создать лучшие темы WordPress и не ошибиться

Опубликовано: 2020-10-22

WordPress занял выдающееся место среди других CMS, так как на нем работают миллионы веб-сайтов, включая The New York Times, официальный сайт Швеции, TechCrunch и Vogue. Структура платформы настолько многофункциональна, что подходит как для сайтов небольших личных блогов, так и для сайтов гигантских корпораций.

Популярность этой CMS обусловлена ​​несколькими факторами, среди которых огромное количество бесплатных тем, плагинов и высокая частота обновлений. Кроме того, в отличие от многих других платформ, WordPress имеет огромное сообщество пользователей. Если вы столкнулись с проблемой при работе с системой, или вам нужно пообщаться с единомышленниками, вы можете обратиться к сообществу через любой из тысяч доступных форумов. Тема WordPress — это набор файлов, которые определяют внешний вид вашего сайта. Тема включает в себя программирование на JavaScript и HTML, и довольно часто в ней участвует разработчик JavaScript или jQuery.

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

Однако в этой статье мы хотели бы уделить внимание созданию своей темы: как максимально эффективно подойти к этому вопросу и не допустить ошибок.

Изображение1

Источник: kinsta.com

Почему важно создать собственную тему WordPress

WordPress имеет внутреннюю библиотеку с сотнями бесплатных тем. Они подходят для любых целей и предпочтений. Так зачем разработчику JS создавать индивидуальные темы, когда есть куча бесплатных?

Пользовательская тема имеет больше преимуществ, чем бесплатная тема, и вот почему:

  • Уникальность дизайна.

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

  • Персонализированные функции.

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

  • Ограниченная возможность изменить тему по умолчанию .

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

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

Каковы распространенные ошибки при разработке темы WordPress

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

  • Создание темы без использования действий и фильтров

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

  • Поиск дополнительной работы

Будьте осторожны, когда хотите что-то улучшить, особенно когда вы создаете функцию, которая делает примерно то же самое, что и другая, уже существующая функция. Чем более «красивый» код вы добавите, тем сложнее вам будет поддерживать его в будущем. Нажатия клавиш не являются мерой вашей продуктивности как разработчика. Лучше потратить больше времени на обдумывание кода, чем на его написание.

  • Использование переменных в темах

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

Шаги создания темы WordPress

Первое, что должен сделать разработчик JavaScript, это загрузить и установить WordPress на компьютер. Также необходимо использовать для работы текстовый редактор. Далее нужно найти на диске, где установлен WordPress, каталог wp-content\themes, и создать в нем новую папку с названием будущей темы. Стандартные темы WordPress также хранятся здесь.

Каждая тема должна содержать два файла: index.php и style.css, а также папку images с изображениями для темы. Для начала нужно просто создать эти файлы, а затем приступить к их заполнению. Файл index.php можно написать самостоятельно в текстовом редакторе, заказать у специалиста, а можно взять готовый контент из другой темы.

Для темы необходимо загрузить файл screenshot.png с нужным расширением 1200х900 пикселей в папку с темой. Это может быть любое изображение, соответствующее указанному формату. Код из index.php необходимо скопировать в блокнот и сохранить в папке новой темы, указав расширение PHP. Далее в этот файл вы можете добавлять любые элементы, которые вы хотели бы видеть на сайте.

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

/ *

Название темы: Название темы

URI темы: URL-адрес сайта, посвященного этой теме.

Описание: Описание темы

Версия: Версия темы

Автор: Имя автора

URI автора: адрес автора темы

* /

Файл index.php содержит общую информацию о сайте. Он содержит элементы, которые повторяются для каждой страницы. Чтобы весь контент работал корректно, вам нужно создать отдельные файлы для шапки, сайдбара и футера. Все они будут храниться в общей папке, и каждому будет присвоено расширение PHP.

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

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

Чтобы шапка, сайдбар и футер отображались корректно, нужно привязать их отдельные файлы к основному (индексу). Для этого добавьте строку в начало файла index.php:

<? php get_header(); ?>

В основе каждой темы WordPress лежат два файла: index.php и style.css. После их создания вы можете экспериментировать с разными элементами и функциями тем, создавая уникальный дизайн для каждой страницы.

Вывод

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