Темы и шаблоны wordpress

Как упростить создание свой WordPress темы

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

Там будут самые необходимые файлы для WordPress темы. Внутри этих файлов будет основная структура и функции: вывод заголовков, навигации, меню и т.д.

Для перфекционистов вроде меня можно потереть всё непонятное и ненужное. Например, из файла functions.php можно удалить такую конструкцию:

function ploshadka_content_width() {     $GLOBALS = apply_filters( ‘ploshadka_content_width’, 640 ); } add_action( ‘after_setup_theme’, ‘ploshadka_content_width’, 0 );

Зачем она нужна можете прочитать в интернете, но обычно вносит только сложности.

Ещё удалить всё что непонятно (а значит не нужно). Удалить некоторую структуру из стилей, разбить файлы как удобнее лично тебе. Удалить ненужные файлы вроде rtl.css. Если только кто-то не собирается верстать сайт для тех кто читает справа на лево. И т.д. На конечном этапе получим файлы лишенные всего «хлама».

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

Template Tags Articles

Stepping Into Template Tags 

Introduction to the use of template tags in template files.

Template Tags 

The core set of functions used to draw information from the database and display it on the web. For example, the Content of a Post is displayed with the Template Tag the_content().

Anatomy of a Template Tag 

Understanding the structure, usage, and parameters of template tags used in template files.

Include Tags 

A document describing the tags that are available to include and use WordPress’ template files.

Conditional Tags 

These tags (always of the form is_*(), such as is_home()), report what sort of page is being displayed (e.g. the Main Page, a Category Archive, etc.) and can be used within a Template to control the Template’s output depending on what the tags report.

Query Posts Template Tag 

A description of the query_posts template tag, which is used to control which posts are displayed on a page. Query posts alters the main query that WordPress uses, and is therefore not recommended to display different posts than those that would normal show up at a specific URL. It is best to use pre_get_posts for any changes that need to be made to the main query.

Get Posts Template Tag 

A description of the get_posts tag, which is used to retrieve a list of posts matching criteria set through the tags parameters. This is the preferred method for quickly creating new criteria for your Loop, or to create a specific array of posts.

Русские премиум плагины для WordPress

Премиум плагины для ВордПресс на русском — Оптимизация, минимальная нагрузка, максимальная скорость работы.

SEO плагин для WordPress — Clearfy Pro

+49 пунктов по улучшению вашего сайта. Отличное дополнения для плагина Yoast SEO:

Clearfy Pro — мощный плагин для WordPress

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

Плагин Expert Review

Плагин Expert Review для визуального оформления экспертного контента и создания дополнительной ценности вашим сайтам на ВордПресс.

Создание дополнительной ценности сайту

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

Какие блоки есть в плагине Expert Review?

1. Блок эксперта;
2. Вопросы и ответы;
3. Рейтинг;
4. Плюсы и минусы;
5. Лайки и дизлайки.

Блок эксперта. Выводит информацию об авторе или отдельном специалисте. Можно дополнительно указать мнение эксперта, добавить кнопку «Задать вопрос», для вовлечения пользователей. Можно задать несколько, выбрать из готовых или ввести вручную.

Можно визуально выделить мнение автора или эксперта

Блок позволяет визуально выделить мнение автора, мнение эксперта. В данном блоке выводится фотография, имя эксперта, описание (должность, профессия) и сам текст, мнение эксперта.

Блок вопросов и ответов. Оформить контент можно с помощью блока вопросов и ответов. Таких блоков может быть сколько угодно в статье.

Вопросы и ответы

Блок Вопросов и ответов позволяет выводить контент в формате вопроса и ответа эксперта или автора статьи.

Блок рейтинга. Позволяет выставить оценки по определенным критериям, в конце (опционально) вывести итог и краткое резюме.

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

Блок плюсы и минусы. Выделить сильные и слабые стороны продукта, услуги, специалиста, мероприятия, компании, да чего угодно!

Способ оформления контента — это блоки плюсов и минусов

Кстати, у блока могут быть только плюсы.

Лайки и дизлайки. Возможность ставить нравится и не нравится для статей. Вывести можно в любом месте. Разные стили, иконки, отключение элементов (иконки, текста, счетчика).

Нравится и не нравится статья

У этих кнопок есть различные стили, размеры и иконки. При этом — Вы можете отключить вывод текста на кнопках, иконки или счетчика.

Подробности о плагинах на этой странице.

Добавляем API WordPress

Первым делом добавим в тему поддержку API WordPress, а так же выведем тайтл. В тег добавляем следующее:

<title><?php wp_title('|', true, 'right');?></title>

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

И ниже подключаем API. Код должен находится внутри тега :

<?php wp_head();?>

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

Далее нужно перед закрывающим тегом добавить следующий код:

<?php wp_footer();?>

Эта функция выведет панель инструментов WordPress вверху сайта.

Кулинарный шаблон WordPress

Красивая тема WordPress для рецептов с микро-разметкой.

Кулинарный шаблон wordpress

Cook It — горячая кулинарная тема вордпресс

Тема WordPress для кулинарных рецептов. Мощная кулинарная тема, удобное наполнение ингредиентов и шагов, видео-рецепты, грамотное SEO, микроразметка рецептов, продуманная структура, встроенная реклама, блоки внимания, свои виджеты и многое другое.

Кулинарная тема полностью поддерживает микроразметку schema.org

• Отдельные поля для ингредиентов и шагов;
• Легко поменять местами — просто перетащите;
• Возможность разбить ингредиенты на группы;
• Загружайте картинки в 1 клик;
• Автоматическая микроразметка для рецептов.

Отдельные поля для ингредиентов и шагов

Встроенная реклама

1. 7 рекламных позиций
2. Перед контентом, после, посередине, после абзацев и т.д.
3. Отдельная реклама для мобильного
4. Отключение рекламы в отдельных записях
5. Возможность показывать только для старых записей

Встроенные функции. Вам не нужно устанавливать лишние плагины, в теме уже есть:

• Форма обратной связи;
• HTML карта сайта
• Содержание постов;
• Рейтинг записей с микроразметкой;
• Сокрытие внешних ссылок через JS;
• Блоки внимания;
• Спойлер.

Демонстрация и более подробно о возможностях темы для кулинарии читайте тут.

Бесплатные игровые темы для WordPress

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

Gaming Mag

Первая тема в нашей подборке, которая давно завоевала популярность среди пользователей, – Gaming mag. На первый взгляд можно подумать, что это потрясающая тема с ярким дизайном. Так оно и есть! Шаблон был проработан специально под игры. Благодаря этому тема позволяет охватить большую аудиторию, а это значит, что создать и раскрутить портал с данным шаблоном не составит никакого труда.

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

Дополнительные особенности:

• адаптивный, простой и интуитивно понятный дизайн;
• совместимость с Yoast, All in One SEO и другими плагинами для внедрения дополнительных функций SEO;
• полностью совместим с популярными виджетами для перевода;
• доступны пользовательские виджеты.

Ссылка на скачивание: Gaming mag

Chosen gamer

Chosen Gamer – это адаптивная тема, которая может быть использована для создания веб-ресурса на игровую тематику. Она отличается своей четкой типографикой и атмосферой. Chosen Gamer отлично подойдет тем, кто не любит большие фреймворки и огромные портянки с кодом. Шаблон весит всего 184 Кб, что в разы меньше предыдущего. Структура довольно проста: меню в шапке с логотипом, картинка и журнальный тип вывода записей.

Особенности:

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

Ссылка на скачивание: Chosen Gamer

MH Joystick lite

MH Joystick lite – это бесплатная адаптивная тема для WordPress, которая подходит для онлайн-порталов, развлекательных и информационных ресурсов. Шаблон также имеет премиум версию за $49, включающую в себя более обширный функционал. Как и в случае с шаблоном, рассмотренным в начале, MH Joystick lite подходит для SEO-продвижения, поэтому добиться высоких позиций в поисковых системах может каждый.

Особенности:

• качество кода на высоте – тема прошла профессиональную проверку со стороны обозревателей тем WordPress;
• поддерживает большой набор популярных шрифтов от Google;
• тема полностью готова к переводу;
• есть премиум-версия.

Ссылка на скачивание: MH Joystick lite

90s Retro

Не сказать, что это отличная тема, которая подойдет для каких-то серьезных целей. Это скорее бесплатный игровой шаблон, используемый для погружения в разработку сайтов. С его помощью, конечно, можно создать полноценный сайт, но особым функционалом отличаться он не будет. Единственное, что в нем может порадовать, – это стиль ретро 90х годов.

Что на этот счет обещают сами разработчики:

• функционал включает в себя старые GIF-изображения;
• включена возможность добавления MIDI-музыки на сайт;
• шрифты Comic Sans;
• адаптивность и пользовательские виджеты.

Ссылка на скачивание: 90s Retro

Play

Последний бесплатный шаблон, о котором я расскажу, – это Play. Его по-настоящему можно считать лучшим макетом в этой подборке: он обладает огромным функционалом и хорошо настроенными блоками.

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

Из особенностей можно отметить:

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

Ссылка на скачивание: Play

Fluida

Fluida – современная, минималистичная тема для WordPress. Она впечатляет гибкой компоновкой и построена на легком и мощном каркасе, при редактировании которого не всплывет никаких непредвиденных ошибок. Тема оптимизирована для SEO, используя распознаваемые Google микроданные Schema.org. Используя этот шаблон, вы получаете более ста настраиваемых параметров, позволяющих преобразить сайт. Вы можете изменить все, начиная с макета и его основного содержания и заканчивая шириной сайта и боковых колонок, цветом, шрифтами, изображениями и многим другим. Тему Fluida отличает наличие меню ссылок на ваши аккаунты социальных сетей с более чем сотней значков, которые можно разместить в 4 местах.

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

Подборка бесплатных лучших шаблонов для создания блогов

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

Семейство шаблонов Twenty – бесплатные шаблоны для блога от создателей WordPress

Шаблоны семейства Twenty это разработки от создателей самого WordPress, команды Automatic. У них сложилась традиция каждый год выпускать новый шаблон с номером года – Twenty Seventeen, Twenty8teen и так далее, вплоть до 21 года. Каждая имеет свой функционал и определенный уникальный внешний вид. По настройкам одинаковы, но есть множество плюсов.

Twenty

• Совместимость со всем плагинами, которые сделали именно Automatic – WooCommerce, BBpress, Jet Pack и остальные.
• Наличие микроразметки для блога.
• Довольно валидный код.
• Некоторые возможности кастомизации шаблона.
• Не требуют установки дополнительных шаблонов.
• Уровень доверия у них больше, чем к остальным разработкам.

Balanced Blog – красивая адаптивная сетка

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

Balanced

Poseidon – бесплатный премиум темплейт

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

Poseidon

Writer Blog от знаменитой в своих кругах фирмы VW, занявшая нишу условно бесплатных продуктов для WordPress. Отличаются только изменением дизайна и верстки в некоторых местах. Но начинка с опциями управления стандартные, но их предостаточно, чтобы создать хороший блог на начальном этапе. Много блоков на главной странице, которые без труда настраиваются из кастомайзера.

VW Writer

Envo Blog – интересный дизайн слайдера

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

Envo

VT Blogging – подойдет для блога програмиста

VT Blogging по построению подойдет для ведения IT блога, например, для программиста, про строительство и такие более серьезные темы. Сдержанное содержание, узкая шапка, продуманные цвета и типографика строгого стиля с разнообразием гаммы. Чистый и ускоренный, преимущество, почти всех бесплатных шаблонов для блога, это отсутствие необходимости ставить дополнительные инструменты.

VT Blogging

На что обращать внимание при выборе темы

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

Мобильная версия

Самое первое, на что стоит обратить внимание — это наличие у темы WordPress мобильной версии. Не устаем повторять: трафик с мобильных устройств рос, растет и будет расти

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

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

Как проверить мобильную версию?

Вы можете просто открыть демо-версию шаблона с телефона, но есть еще один способ: проверьте ее через специальный сервис от Google.

Сервис покажет, удобна ли страница для просмотра с мобильных и выдаст отчет

Дизайн

Дизайн — это дело вкуса, поэтому выбирайте то, что понравится вашим пользователям

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

Чем проще, тем лучше

И интерфейс

Оценивайте не только внешний вид, но и удобство: легко ли прицелиться в кнопку? Очевидно ли расположение элементов? Насколько просто ориентироваться по сайту? Понятно ли, что происходит по нажатию на какие-либо кнопки? 

Чем понятнее и очевиднее интерфейс, тем проще посетителю пользоваться сайтом.

SEO

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

Проверьте: 

• как организованы заголовки и хлебные крошки в теме
• насколько быстро загружается шаблон
• как оформлены страницы рубрик, есть ли в них заголовки и описания

Например, тема Root от WPShop позволяет задавать свои заголовки и описания для рубрик

Конечно, только то, что тема оптимизирована для SEO — не гарантия того, что ваш блог будет выйдет в ТОПы поисковых систем, но чем лучше продуман этот аспект, тем выше вероятность.

Скорость и производительность

Хорошая тема быстро загружается

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

Как проверить скорость загрузки темы?

Чтобы проверить, насколько быстро будет работать ваш сайт, вы можете проверить демо-версию шаблона с помощью Google PageSpeed Insights. Скопируйте адрес демо-версии, вставьте его в поле ввода на сервисе и нажмите «Анализировать» — PageSpeed Insights выдаст оценку скорости загрузки.

Обновления

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

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

Тема Sky от BeeWise обновлялась примерно полтора года назад — можно уточнить у разработчиков, поддерживают ли они тему

Возможности монетизации

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

Фирменный стиль

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

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

Остальные простые и легкие шаблоны WordPress

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

Actions – самая простая тема

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

Actions

Twenty Sixteen – лучший бесплатный продукт от WordPress

Стандартные темы WordPress зря обходят стороной, потому что созданы по все правилам разработки и верстки. Почему Twenty Sixteen, из всего семейства Twenty самая простая в освоении и построении файловой логики. Разрабатывалась на шаблоне Underscores, то есть структура аналогична, но с применением дополнительных настроек, что имеет:

Twenty Sixteen

• Много возможностей изменения цветов
• Изображения заголовка и фона
• Правильная микроразметка json
• Валидный html
• Несколько методов отображения контента

Iconic One – для лендинга

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

Iconic One

• Легкость кода обеспечивает скорость по gmetrix 96/93
• Отдельный файл дополнительных стилей
• Безконфликтный с плагинами
• Имеет свой вывод миниатюр
• Совместим с SEO
• Простая панель настроек внешнего вида
• HTML5 и CSS3 сетка

Steady Blogging – оптимизированный CSS

Steady Blogging не особо отличается от предыдущего. Но понравилась особенность – сжатый код CSS, продуманная и логичная верстка. На базе темы без исправлений, а только добавлений создать продукт не плохого качества.

Steady Blogging

• Адаптивна ко всем экранам
• Мгновенная загрузка по pagespeed 100% скорости
• Изменение цветов и фона
• Базовая микроразметка

Poseidon – красивая сетка постов

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

Poseidon

1. Липкое меню
2. Два положения сайдбара
3. Управление отрывками в карточках постов
4. Изменение метаинформации у записей
5. Простой слайдер
6. Виджет социальных кнопок

Scaffold – бесплатный вариант

Scaffold сжатый во внешнем виде, но не по внутренним возможностям. Имеет правильный код, всего 6 ошибок при проверке на W3C. Скорость по показателям не ниже 94%.

Scaffold

• Настраиваемая шапка: отступы, фон (его положение и размножение)
• Фоны и цвета
• Полностью бесплатный не имеет PRO версии
• Пользовательские виджеты

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

Мне нравитсяНе нравится

Что такое тема WordPress

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

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

Как сразу выбрать ту, что точно подойдет? Расскажем дальше.

Тема или шаблон?

Часто слова «тема» и «шаблон» используют в одном значении. Но если строго следовать терминологии WordPress, это неверно.

Тема (theme) — это макет целого сайта: как выглядит шапка и подвал, сколько колонок, какой шрифт и т. д. Twenty Nineteen — вот это тема.

Шаблон (template) — это часть темы, макет одной страницы или секции в блоге. Например, Header.php, который определяет вид верхнего блока на всех страницах, — вот это шаблон.

С терминологией разобрались, можно переходить к делу.