Топ-5: лёгкие и быстрые темы wordpress
Содержание:
- Akea
- Остальные простые и легкие шаблоны WordPress
- Что такое тема WordPress
- Более сложные структуры страниц
- Modern
- Минусы чужих тем на WordPress
- Vagabonds
- На что обращать внимание при выборе темы
- Способ 1: шаблон страницы через файл с произвольным названием (классический способ)
- Template Tags Articles
- Структура страницы WordPress
- Правильное подключение скриптов
- Matina
- Русские темы (шаблоны) и плагины для WordPress
Akea
Следующую тему можно назвать идеальной для личного блога. Разработчики позволяют добавить не только объемные статьи, но и прикрепить к ним необходимое количество изображений как в промежутках между текстом, так и в качестве логотипа. Главная особенность Akea – возможность читателей ставить лайки на записи, а не только комментировать их. Это дает обратную связь, поощряет и добавляет стимула автору.
С помощью Akea делите свои статьи на категории, выводя их в меню справа, прикрепляйте к каждой из них теги, чтобы обычному пользователю было проще ориентироваться во всем и находить интересную для него информацию быстро, без мониторинга всех статей от новых до самых старых. Akea распространяется платно, но ее цена не так высока, чтобы обходить этот шаблон стороной.
Остальные простые и легкие шаблоны 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
- Липкое меню
- Два положения сайдбара
- Управление отрывками в карточках постов
- Изменение метаинформации у записей
- Простой слайдер
- Виджет социальных кнопок
Scaffold – бесплатный вариант
Scaffold сжатый во внешнем виде, но не по внутренним возможностям. Имеет правильный код, всего 6 ошибок при проверке на W3C. Скорость по показателям не ниже 94%.
Scaffold
- Настраиваемая шапка: отступы, фон (его положение и размножение)
- Фоны и цвета
- Полностью бесплатный не имеет PRO версии
- Пользовательские виджеты
Закончу статью, вывел лучший простой шаблон для WordPress и показал еще 9 вариантов легких в кастомизации тем начинающим вебмастерам и программистам. Не стал рассматривать bootstrap, потому что считаю его мусорным фреймворком.
Мне нравитсяНе нравится
Что такое тема WordPress
Тема — это макет сайта, созданный на движке WordPress. Она определяет общий дизайн страниц, стиль шрифтов, цвета, размещение виджетов. Темы создают профессиональные разработчики и распространяют бесплатно или за деньги.
Но не все темы хороши: одни устарели, другие несовместимы с популярными плагинами, у третьих сложная админка. Проблемы могут проявиться сразу или позже, когда сайт уже будет наполнен контентом. Но тогда изменить выбор будет сложно.
Как сразу выбрать ту, что точно подойдет? Расскажем дальше.
Тема или шаблон?
Часто слова «тема» и «шаблон» используют в одном значении. Но если строго следовать терминологии WordPress, это неверно.
Тема (theme) — это макет целого сайта: как выглядит шапка и подвал, сколько колонок, какой шрифт и т. д. Twenty Nineteen — вот это тема.
Шаблон (template) — это часть темы, макет одной страницы или секции в блоге. Например, Header.php, который определяет вид верхнего блока на всех страницах, — вот это шаблон.
С терминологией разобрались, можно переходить к делу.
Более сложные структуры страниц
Заголовок
Контент
Боковая панель
Подвал
Множество тем WordPress используют одну или несколько боковых панелей, которые содержат меню навигации и дополнительную информацию о вашем сайте. Боковая панель формируется с помощью файла шаблона sidebar.php. Он может быть включен в файл шаблона index.php с помощью следующей строки (теги шаблонов):
<?php get_sidebar(); ?>
А где все остальное?
Заметьте, что мы не включили шаблонный тег для «получения» контента нашей web-страницы. Это потому, что контент формируется в цикле WordPress, внутри index.php.
Также стоит отметить, что таблицы стилей темы определяют внешний вид и положение заголовка, подвала, боковой панели и контента в браузере пользователя. Чтобы узнать больше об изменении дизайна ваших тем WordPress и web-страниц, смотрите Дизайн и раскладка блога.
Modern
Ранее речь шла преимущественно про легкие и минималистичные темы в белом цвете, которые сейчас популярны из-за сложившихся трендов веб-дизайна. Однако не всем пользователям нравятся такие решения или в определенных случаях красивее будет смотреться тематический шаблон, например, под портфолио путешественника или фотографа. Как раз таким пользователям подойдет Modern.
На задний план можно поставить свое фото или выбрать одну из заготовок автора. Сама тема заранее оптимизирована под SEO, мобильные устройства и экраны с большим разрешением, поэтому вручную пользователю не придется вносить никаких изменений в код. Дополнительно можно подключить любой плагин создания страниц, о чем пишет автор темы на ее официальной странице.
Минусы чужих тем на WordPress
Все эти сторонние темы создаются преимущественно для «домохозяек», которым некогда и неинтересно разбираться в тонкостях html или css. В результате туда добавляют множество функций, которые я никогда не использовал.
Взять самое простое — добавление логотипа в виде изображения. Это можно сделать через панель администрирования сайта, если заранее была добавлена функция в шаблон темы сайта. А сейчас она добавлена практически везде.
Когда нужно поставить логотип в непредусмотренное для него место, от этой функции никакой пользы. А ведь для неё написаны десятки PHP строк только для того, чтобы пользователь мог добавить одно единственное изображение. Когда вместо этого, в нужном месте файла, достаточно прописать всего одну строчку:
<img src=»» alt=»»>
И так по всем функциям. Много бесполезного для отдельно взятого человека. Напичкано всё подряд, ведь одному может понадобится одно, а другому другое.
Я также уже очень давно не использую виджеты через панель администрирования. Слишком мало свойств, по которым можно вывести желаемое меню. Либо надо использовать плагины, а это дополнительные ресурсы для сайта. Потому что, чтобы вывести блок ссылок в меню на сайте посредством плагина, в самом плагине требуется описать кучу функций.
Гораздо проще зайти в sidebar.php и вывести нужные рубрики обычным способом:
<div class=»widget»> <h3 class=»widget-title»>Страны</h3> <ul> <?php $args = array( ‘title_li’ => 0, ‘orderby’ => ‘name’, ‘show_count’ => 0, ‘use_desc_for_title’ => 0, ‘exclude’ => ‘43,22’, // исключены страны Африки ‘hide_empty’ => 1, // не обязательные ‘depth’ => 1, ); wp_list_categories($args); ?> </ul> </div>
В таком небольшом участке кода имеется и список нужных рубрик и требуемая сортировка и даже исключены неугодные категории. И всё это работает без какого-либо плагина.
Vagabonds
Шаблон для блога WordPress Vagabonds предназначен исключительно для тех юзеров, которые хотят вести блог про путешествия и рассказывать читателям о впечатлениях и опыте, полученном в других странах. Для этого в теме реализована отдельная интерактивная карта, при нажатии по точкам на которой можно узнать, куда вы путешествовали, какие фотографии и истории, связанные с этим местом, выложили у себя на сайте.
Если опуститься по главной странице, появится блок с отдельными статьями и их превью. Они используются для подробного описания достопримечательностей, городов, стран и других мест, которые вы посетили. Еще на главной странице сайта можно разместить главную фотографию и добавить описание от автора, чтобы читатели сразу понимали, чей это блог и чему он посвящен. Однако стоит отметить, что Vagabonds – платный шаблон, купить который можно на официальном сайте. Перед этим советуем посмотреть его лайв-версию и прочесть описание от разработчика.
На что обращать внимание при выборе темы
Не давайте дизайну шаблона ввести вас в заблуждение: красивые фотографии на демо-версиях, графичные шрифты и плавная анимация могут легко сбить с толку и отвлечь от того, что тема полчаса загружается или не оптимизирована для SEO. Вот простой чек-лист, как проверить тему «на прочность».
Мобильная версия
Самое первое, на что стоит обратить внимание — это наличие у темы WordPress мобильной версии. Не устаем повторять: трафик с мобильных устройств рос, растет и будет расти
Поэтому, если ваша тема не будет оптимизирована для просмотра со смартфонов и планшетов, читатели могут просто уйти, оставив за собой высокий показатель отказов.
В 2020 году встретить тему без адаптации под мобильные устройства сложно, но если вдруг такая попадется — рекомендуем смело вычеркивать ее из списка. Даже в блоги со сложной экспертной тематикой люди заходят с телефонов, поэтому обязательно просмотрите мобильную версию темы и походите по разным страницам — это покажет, насколько грамотно она сверстана.
Как проверить мобильную версию?
Вы можете просто открыть демо-версию шаблона с телефона, но есть еще один способ: проверьте ее через специальный сервис от Google.
Сервис покажет, удобна ли страница для просмотра с мобильных и выдаст отчет
Дизайн
Дизайн — это дело вкуса, поэтому выбирайте то, что понравится вашим пользователям
Чтобы не затруднять чтение, обращайте внимание на минималистичные темы с небольшим количеством декоративных элементов — это поможет читателю сосредоточиться на контенте
Чем проще, тем лучше
И интерфейс
Оценивайте не только внешний вид, но и удобство: легко ли прицелиться в кнопку? Очевидно ли расположение элементов? Насколько просто ориентироваться по сайту? Понятно ли, что происходит по нажатию на какие-либо кнопки?
Чем понятнее и очевиднее интерфейс, тем проще посетителю пользоваться сайтом.
SEO
Для блогов оптимизация для поисковых систем очень важна — скорее всего, читатели будут приходить к вам за ответами на вопросы, которые они обычно ищут в интернете. Поэтому оцените, насколько тема SEO-оптимизирована: чаще всего создатели тем сами охотно об этом рассказывают, но если вы не нашли таких пунктов в презентации, это повод насторожиться.
Проверьте:
- как организованы заголовки и хлебные крошки в теме
- насколько быстро загружается шаблон
- как оформлены страницы рубрик, есть ли в них заголовки и описания
Например, тема Root от WPShop позволяет задавать свои заголовки и описания для рубрик
Конечно, только то, что тема оптимизирована для SEO — не гарантия того, что ваш блог будет выйдет в ТОПы поисковых систем, но чем лучше продуман этот аспект, тем выше вероятность.
Скорость и производительность
Хорошая тема быстро загружается
Это важно не только для поисковых систем, но и для читателей — чем меньше им придется ждать загрузки страницы, тем с большей охотой они будут читать ваш блог.
Как проверить скорость загрузки темы?
Чтобы проверить, насколько быстро будет работать ваш сайт, вы можете проверить демо-версию шаблона с помощью Google PageSpeed Insights. Скопируйте адрес демо-версии, вставьте его в поле ввода на сервисе и нажмите «Анализировать» — PageSpeed Insights выдаст оценку скорости загрузки.
Обновления
Обновления темы часто становятся головной болью для владельцев сайтов — если внести в тему собственные изменения, при обновлении их легко потерять.
На самом деле обновления темы очень важны: они ускоряют загрузку и добавляют новые функции, но главное — закрывают уязвимости, с помощью которых злоумышленники могут получить доступ к вашему блогу. Поэтому при выборе темы проверьте, когда выходило последнее обновление — если это было не больше года-полутора назад, значит, разработчики поддерживают и улучшают тему.
Тема Sky от BeeWise обновлялась примерно полтора года назад — можно уточнить у разработчиков, поддерживают ли они тему
Возможности монетизации
Если вы собираетесь размещать на сайте блоки рекламы AdSense или Яндекс.Директ, обратите внимание на рекламные блоки в теме. Отлично, если такая возможность предусмотрена сразу, потому что доделывать ее на живом сайте потребует дополнительных затрат денег и времени
Фирменный стиль
Это применимо не только к корпоративным блогам: следите за тем, чтобы тема соответствовала вашему фирменному стилю. К такому стилю может относиться как только логотип, так и какие-то элементы графического оформления баннеров, обложек и другого.
Например, если в вашем логотипе используются скругления и мягкие формы, обращайте внимание на темы с похожими формами и не рассматривайте слишком «квадратные» темы — это поможет создать у читателей впечатление целостности
Способ 1: шаблон страницы через файл с произвольным названием (классический способ)
Это самый распространенный способ создать шаблон страницы в WordPress. Для этого нужно создать .php файл, например, tpl_my-page.php в папке темы и в самом начале файла вписать метку, что созданный файл является шаблоном для страниц:
<?php /* Template Name: Мой шаблон страницы */ ?> <!-- Здесь html/php код шаблона -->
Теперь при создании страницы в админ-панели в блоке «Свойства страницы» мы сможем выбрать «шаблон»:
С версии WordPress 4.7. такие шаблоны страниц можно создать для любого типа записи, а не только для page. Для этого дополните комментарии строкой: , где post, page — это названия типов записей к которым относится шаблон.
/* Template Name: Мой шаблон страницы Template Post Type: post, page, product */
Подробнее читайте в отдельной статье.
Преимущества:
-
Создав один шаблон, мы можем удобно применять его для разных страниц. Например, можно создать шаблон без боковой панели и использовать его на разных страницах.
- Можно получить только записи с указанным шаблоном. Например, можно вывести все страницы с шаблоном «Услуги» (файл servises.php). Иногда это удобно. Название файла шаблона хранится в метаполе , поэтому чтобы вывести страницы с указанным шаблоном нужно создать запрос по метаполю (см. WP_Query).
Недостатки:
После создания файла шаблона в папке темы, нужно зайти в админ-панель и установить шаблон для страницы. При разработке это не всегда удобно. Поэтому если подразумевается использовать шаблон только для одной страницы, используйте второй метод.
Как это работает:
Когда вы заходите в админ-панель на страницу редактирования записи древовидного типа, WordPress просматривает все файлы шаблона на наличие в них строки:
Template Name: ***
Строка может располагаться где угодно и как угодно в файле.
Все файлы с подобными строками собираются и выводятся в выбор шаблона в блок «Атрибуты страницы».
При публикации страницы, в произвольное поле записывается название файла шаблона или , если шаблон не указан:
_wp_page_template = default_wp_page_template = tpl_my-page.php
Далее, когда пользователь посещает страницу, WordPress проверят метаполе , если шаблон установлен, то используется файл шаблона. В противном случае поиск шаблона страницы продолжается по иерархии.
Локализация названия шаблона
Название задается в php комментариях, поэтому нет возможности перевести эту строку обычным способом: через функцию перевода, заключенного в теги <?php … ?>. Однако WP сам пытается перевести эту строку при выводе, используя подгруженные данные перевода. Таким образом, для перевода нам нужно как угодно добавить эту строку в список переводов темы. Сделать это удобнее всего сразу после заголовка — так всем будет понятно зачем нужен такой странный вызов функции переводов __():
/** * Template Name: Мой шаблон страницы * Template Post Type: post, page, product */ __( 'Мой шаблон страницы', 'my-theme' );
— это ID перевода — параметр Text Domain:, который указывается в заголовках темы и при подключении файла перевода, см. load_theme_textdomain().
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
Простая web-страница WordPress сделана из трех основных блоков: заголовок (header), контент и подвал (footer). Каждый из этих блоков формируется на основе файла шаблона текущей темы WordPress.
Заголовок
Контент
Подвал
Заголовок содержит всю информацию, которая должна быть наверху — т.е. внутри тега
— вашей XHTML web-страницы, так же, как и теги , и ссылки на таблицы стилей. Он также включает открытый тег и видимый заголовок вашего блога (который обычно содержит название вашего сайта, а также может содержать навигационное меню, логотип, описание сайта и т.д.).
Блок контента содержит записи и страницы вашего блога, т.е. «основу» сайта.
Подвал содержит информацию, которая находится в самом низу страницы, например ссылки на остальные страницы или категории вашего сайта в меню, авторские права, контактную информацию и т.п.
Основные файлы шаблона
Чтобы сформировать структуру темы WordPress, начните с файла шаблона index.php в папке вашей темы. У этого файла две основные функции:
- Включить или «вызвать» другие файлы шаблона
- Включить цикл WordPress для получения информации из базы данных (записи, страницы, категории и т.д.)
В нашей упрощенной структуре нам достаточно включить два других файла шаблона: заголовок и подвал. Они должны быть названы header.php и footer.php. Теги шаблонов, которые включают их, выглядят так:
<?php get_header(); ?> <?php get_footer(); ?>
Если нужно показать записи и страницы вашего блога (и настроить их внешний вид), файл index.php должен запустить цикл WordPress между вызовами файлов заголовка и подвала.
Правильное подключение скриптов
Мы вывели скрипты прямо в шаблоне указав путь до них через функцию . Вы конечно можете оставить это и так. Я и сам так делал. Но по правилам WordPress скрипты должны подключаться через специальную функцию в файле functions.php. Давайте подключим их правильно. Делается это следующим образом:
function it-blog_style_frontend() {
wp_enqueue_style('bootstrap', get_stylesheet_directory_uri() . '/css/bootstrap.min.css');
wp_enqueue_style('styles', get_stylesheet_directory_uri() . '/css/style.css');
}
add_action('wp_enqueue_scripts', 'it-blog_style_frontend');
function it-blog_include_myscript(){
wp_enqueue_script('jquery', 'https://code.jquery.com/jquery-3.3.1.slim.min.js', '', '1.0', false);
wp_enqueue_script('bootstrap', get_stylesheet_directory_uri() . '/js/bootstrap.min.js', '', '1.0', false);
}
add_action('wp_enqueue_scripts', 'it-blog_include_myscript');
Как вы можете заметить ещё я подключил файл style.css, в нём будут находится пользовательские CSS стили, которые рано или поздно вам понадобятся.
Matina
Matina — тема WordPress для креативных людей, которая лучше всего подходит для создания личных и профессиональных блогов любого направления. Этот шаблон имеет уникальный и современный адаптивный дизайн, который уже настроен под просмотр на разных устройствах. Разработчик предлагает гибкие функции настройки, которые позволяют выбирать макеты для своих публикаций, их цвета, типографику другие основные параметры, характерные для такого рода шаблонов.
Присутствует переключение в темный режим, отдельная страница для биографии автора или описания предназначения сайта. Вы можете использовать готовые макеты, чтобы настроить свой сайт в течение минуты, приложив минимальное количество усилий. Также юзеры могут легко управлять настройками темы и предварительно просматривать их из интерактивного настройщика так, как это происходит и в других продвинутых темах.
Русские темы (шаблоны) и плагины для WordPress
Плагины, темы и скрипты собственной разработки. Вы можете приобрести премиальные плагины и темы для CMS WordPress по низкой цене, на официальном сайте — магазин wp-r.
Плагины и темы для WordPress на русском языке
В магазине представлены премиальные плагины WordPress для разных задач. Это например:
- Плагин HaWoB — калькулятор роста и веса малыша (Выводит форму расчета веса и роста малыша согласно ВОЗ);
- Модуль HaWoC — калькулятор роста и веса ребенка (Выводит форму расчета веса и роста ребенка согласно ВОЗ);
- AdsPlace’r Pro — Плагин управления рекламой для увеличения заработка сайта WP;
- Plagin ELT (External Links Tune’r) — Управление ссылками на сайте ВордПресс с широким функционалом;
- И многие другие.
Премиальные плагины WordPress
А вот, шаблонов для сайта WP представлено всего пару, но зато они крутые. Темы для сайтов на WordPress собственной разработки — Romb и SPage.
Romb — быстрая тема WordPress для статейников и коммерческих сайтов. Под современные требования SEO. Главная страница строится полностью из заготовленных виджетов:
Плиточный стиль темы
Широкие настройки дизайна и куча других фишек:
Romb — быстрая тема WordPress
SPage — Легкая тема со всеми фишками SEO для малостраничников и статейников. В теме все учтено для успешного продвижения сайта и заработка на нем. Все настройки выполняются через стандартный функционал CMS WordPress.
WP тема SPage
Страница будет дополняться.
