Отличные блоговые темы 2020 года для wordpress

Темы (шаблоны) для блога на WordPress

Для начала объясню, что такое шаблоны в WP. Да, понимаю, например, в Joomla принято называть шаблоном, но в Вордпресс немного иначе. Шаблон для WP – часть темы.

Это всё шаблоны, которые являются составляющей темы

Например, стрелками я отметил шаблоны подвала (footer.php), шапки (header.php), главной страницы (index.php). И в папке templates можно найти ещё под десяток шаблонов, способных кардинально изменить внешний вид сайта.

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

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

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

Пример плохой поисковой оптимизации у блоговой темы для WP

Здесь получается два заголовка h1. И если захотим исправить сей недочёт, то придётся переписывать шаблон, отвечающий за вывод заголовка в шапке. Это не фатальная ошибка, но очень неприятная. И такие встречаются повсеместно.

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

Так что выбрал для вас качественные темы, с хорошей проработкой по SEO, а также не вызывающих никаких проблем при установке и настройке.

Если решите покопаться самостоятельно, вот несколько моментов, на которые следует обратить внимание при выборе темы. В общем, рассказал в видео

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

Hueman — многофункциональная бесплатная тема WordPress. С большим количеством настроек и простой панелью администратора.

У Hueman есть несколько вариантов макета, два варианта расположения навигационного меню. Вы можете выбрать один, два или три вида расположения столбцов.

Также у нее есть встроенное меню социальных сетей, что, безусловно, очень удобно.

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

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

Главную страницу можно настроить с помощью виджетов и полноэкранного слайдера.

Customizr одна из самых популярных и настраиваемых бизнес-тем WordPress. Она полностью адаптирована для мобильных устройств.

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

Make — это тема со встроенной функцией drag & drop, с помощью которой вы можете создать собственный бизнес-сайт. Она имеет полностью адаптивный дизайн, поэтому отлично смотрится на любом устройстве.

Также есть несколько вариантов макета на выбор.

Vantage — бесплатная тема с адаптивным дизайном, которая может использоваться практически для любого вида сайта. Большой набор настроек с плагином Page Builder и функцией drag-and-drop.

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

Enigma — это отзывчивая бизнес-тема WordPress на базе Bootstrap. Она включает встроенный слайдер для главной страницы и довольно большое количество настроек.

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

Бизнес-тема WordPress с плоским (flat/minimal) и полностью адаптивным дизайном. Функции этой темы дает возможность сделать по-настоящему уникальный сайт.

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

Вы можете добавить собственный логотип, фотографии и контент.

Spacious это многофункциональная бизнес-тема WordPress. Включает слайдер для главной страницы, 5 настраиваемых виджетов и 2 макета страницы. Также вы можете установить светлое или темное цветовое оформление сайта.

Тема адаптирована и прекрасно смотрится на любых устройствах.

Moesia — адаптированная бизнес-тема WordPress с полной поддержкой parallax. Она оптимизирована для мобильных устройств и предлагает 11 готовых блоков для создания страницы.

У каждого блока есть свое фоновое параллакс изображение.

Идеальная бизнес-тема WordPress, которая предлагает полноэкранный макет сайта с большим слайдером для главной страницы.

Также имеет панель управления с большим набором функций.

Как следует из названия, Full Frame — это тема c полноэкранным макетом сайта и адаптивным дизайном. Она включает встроенный функциональный слайдер, кнопки с призывом к действию, настраиваемые виджеты и набор макетов страниц.

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

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

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

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

Она совместима с популярными бесплатными редакторами (плагинами) сайта и предлагает бесплатную поддержку WooCommerce. Также включает редактор страниц в режиме реального времени.

Заключение

Бесплатные темы WordPress — это хороший вариант для знакомства c платформой. Пробуйте и, пожалуйста, не расстраивайтесь, если у вас не будет что-то получаться. Со временем вы обязательно научитесь.

Полезные ссылки:

«Как установить тему WordPress» — видео на примере темы Ronneby.

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

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

Надеюсь, эта статья была полезна. Теперь вы знаете самые популярные бесплатные темы WordPress.

И подписывайтесь на нас в , Instagram и .

The7 – получаем отличный корпоративный ресурс

Один из рекордсменов по продажам на themeforest платная тема The7, больше 200 000 продаж. Имеет глобальную базу блоков, которая интегрируется с помощью дополнительных плагинов. Видел на нем много туристических порталов.

The7

1. Разрабатывался специально для плагинов WPBakery Page Builder, Ultimate Addons.
2. Не знаю как подсчитывали но разработано около 1000 разных видов дизайна.
3. Интеллектуальная подборка, смешивание модулей при помощи Design Wizard.
4. Импорт более 40 демо сайтов с качественной типографикой и картинками.
5. Можно создавать для каждой страницы отдельный показ.
6. Плюс идет плагин дополнительных элементов The7 Elements от разработчиков этого платного шаблона WordPress.
7. Гибкое мега меню.
8. Подробная документация, наличие поддержки.
9. Много возможностей для корпоративных сайтов.

Подробнее Демо

index.php

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

<?php if (have_posts()): while (have_posts()): the_post(); ?>
	Здесь HTML код и функции вывода значений поста (заголовок, дата, ссылка, текст и т.д.)
<?php endwhile; else: ?>
	<p>Записей не найдено.</p>
<?php endif; ?>

А вот основные функции цикла, которые нам понадобятся:

the_title() — выводит заголовок постаthe_content() — выводит текст анонса или полный текст, если цикл находится внутри записиthe_permalink() — ссылка на постthe_time() — дата и время создания постаthe_posts_pagination() — пагинация

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

В итоге получился следующий код главной страницы:

<?php get_header();?>

<h1 class="my-4"></h1>
<?php if (have_posts()): while(have_posts()): the_post();?>
<h2 class="card-title"><a href="<?the_permalink();?>"><?the_title();?></a></h2>
<div class="card mb-4">
	<a href="<?the_permalink();?>"><img class="card-img-top" src="<?php echo get_the_post_thumbnail_url(null, 'full'); ?>" alt="<?the_title();?>"></a>
	<div class="card-body">
		<p class="card-text"><small class="text-muted"><?the_time('j F Y');?></small> <?php the_tags('');?></p>
		<?the_content('');?>
		<a href="<?the_permalink();?>" class="btn btn-primary shadow-none">Читать далее →</a>
	</div>
</div>
<?php endwhile; else:?>
	<p>Записей не найдено.</p>
<?php endif;?>
<?php the_posts_pagination(array(
	'mid_size' => 4,
	'end_size' => 2,
));?>
		
<?php get_footer();?>

Создание темы WordPress

Если вы ещё не установили CMS WordPress, то пришло время это сделать. Про то, как установить WordPress можно прочитать в этой статье. Если система уже установлена, то продолжаем.

Итак, приступим к созданию собственной темы. Для начала нам понадобится создать папку с названием темы в разделе /wp-content/themes/. Я назову её it-blog. Как я уже говорил, чтобы WordPress не выдавал ошибку, внутри этой папки необходимо создать файл стилей style.css. Теперь в панели администрирования в разделе Внешний вид → Темы появится наша тема, где её можно применить к сайту, нажав кнопку активировать. Название темы будет такое же, как и название её папки. На сайте теперь конечно же будет открываться только белая страница, так как тема ещё совсем пустая.

Активация новой темы

Вы можете создать свое изображение темы, добавив файл screenshot.png в папку с темой, а в файле style.css установить название, описание, автора и другую информацию добавив в начало файла примерно такой текст:

/*
Theme Name: Progme
Version: 1.0
Description: Тема Bootstrap 4
Author: Progme
Author URI: https://it-blog.ru
*/

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

Теперь внутри папки с нашей новой темой нам нужно создать все файлы в соответствии со структурой описанной выше. Можно создать их все сразу пустыми или создавать отдельно по мере написания кода.

Правильное подключение скриптов

Мы вывели скрипты прямо в шаблоне указав путь до них через функцию . Вы конечно можете оставить это и так. Я и сам так делал. Но по правилам 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 стили, которые рано или поздно вам понадобятся.

General Theme Articles

Использование_тем 

Основная информация об использовании и установке тем и шаблонов

Миграция плагинов и тем 

Content information how to upgrade a theme for compatibility with new versions of WordPress

Разработка темы 

Как создать свою собственную тему

Framework (каркас) темы 

Build a child theme on the foundation of a parent theme. You can start with a theme that you like and easily modify the parts you want to change. Do more in less time.

Обзор темы  

How to prepare your Theme for public release and submission to Theme Directory

I18n для разработчиков WordPress  

Internationalization, including a section on how to internationalize your theme

Theme Compatibility List 

List of which Themes are compatible with various Versions WordPress

Creating Admin Themes 

How to create a plugin that modifies the look of the Admin section

Интеграция_WordPress_в_Ваш_сайт_—_Введение 

Using WordPress with your existing website

General Theme Articles

Using Themes 

Basic information about using and installing themes and templates

Migrating Plugins and Themes 

Content information how to upgrade a theme for compatibility with new versions of WordPress

Theme Development 

How to develop and build your own themes

Theme Frameworks 

Build a child theme on the foundation of a parent theme. You can start with a theme that you like and easily modify the parts you want to change. Do more in less time.

Theme Review 

How to prepare your Theme for public release and submission to Theme Directory

I18n for WordPress Developers 

Internationalization, including a section on how to internationalize your theme

Theme Compatibility List 

List of which Themes are compatible with various Versions WordPress

Creating Admin Themes 

How to create a plugin that modifies the look of the Admin section

Integrating WordPress with Your Website 

Using WordPress with your existing website

Travelbiz / Шаблон туристического агентства

Скачать тему бесплатно Посмотреть демо

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

Adv — шаблон Вордпресс для сайта рекламного агентства

Тема отлично подойдет не только для рекламного агентства, но и для других сфер бизнеса. Конструктор Elementor и набор плагинов Jet позволяют создать удобную навигацию на сайте

К тому же яркий дизайн темы сразу привлекает внимание. Однозначно посетители не останутся равнодушными и захотят задержаться на таком сайте

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

Bono – премиум шаблон для интернет магазинов

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

Bono

• Встроенная микроразметка для магазинов и блогов.
• Множество фильтров, хуков для вставки своего функционала с кодом.
• Сравнение товаров.
• Покупка в один клик.
• Две полоски выразительного верхнего меню.
• Полноразмерный настраиваемый слайдер товаров.
• Настраиваемая страница оформления заказа.
• Конструктор главной страницы, можно выводить разные форматы.
• Множество функций, которые понадобятся для создания интернет магазина на WordPress любой сложности.

Bono со скидкой

Бесплатные шаблоны для блога

Для альтернативы предложу 6 разработок для создания блога при помощи бесплатных тем. Нашел свежие выпуски, но готовьтесь к тому что бесплатные продукты перестанут обновляться, это частая ситуация, потом продвигается платная версия, а free забрасывается.

Wishful Blog

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

Wishful Blog

1. Заглушка для миниатюр если не заданы
2. Много областей где можно поменять цвет
3. Настройка типографики сайта
4. Вставка ссылок на социальные сети
5. Отключение кнопки вверх
6. Задать длину отрывка в карточке записи
7. Детальная кастомизация логотипа
8. Управление элементами шапки
9. Слайдер под меню WordPress
10. Редактирование положением и компонентами главной страницы
11. Управление отображением таксономий и постов, отображение элементов
12. Стилизация пагинации

VT Blogging

Минимализм темы VT Blogging проявляется во всем. Мало цветов, почти нет скриптов, простое построение в customiser, но составляющие подобраны красиво, подойдет пользователям, которым не нужен крутой дизайн, а только строка меню, поиск, карточки, виджеты сайдбара и футера.

VT Blogging

1. Намного настроек гаммы
2. Три раздела фонового изображения
3. Два вида отображения контента в ленте архивов и главной
4. Пять областей для виджетов

X Blog Plus

X blog Plus раскрывает весь функционал только после установки плагинов в админке WordPress, но выдержан в строгих тонах с красивым выводом текста в дополнительных блоках ресурса, не отвлекающие от прочтения материала.

X Blog Plus

Кнопка вверх, слайдер, красивые галереи, расширенный редактор постов – достигаются установкой дополнительных плагинов
Управление фонами и гаммой
Изменение положение логотипа и меню
Есть преднастройки типов оформления (темная, желтая, светлая, зеленая темы)
Особое внимание уделили записям, скрытие и показ почти всех блоков
Наличие верхнего текстового раздела

Color Blog

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

Color Blog

1. Настройка палитры и фоновых изображений
2. Два вида отображения всего сайта: на всю ширину и с отступом
3. Включение анимации появления карточек с предзагрузкой контента при прокрутке
4. Вывод строки с популярными хештегами
5. Вывод элементов в меню (иконки, поиск, социальные сети)
6. Слайдер под главным меню + настроить популярные записи совместно с ним
7. Настройка разметки архивов по выводу записей и наличию сайдбара
8. Изменение разметки записей по сайдбару и положению шапки
9. Изменение страницы 404
10. Более 30 подключаемых аккаунтов соцсетей
11. От 1 до 4 областей для виджетов в подвале

Minimalblog

Отличная типографика подобранная верстальщиками с дизайнерами, выделяет minimalblog среди остальных, все таки блоги делаются ради прочтения и восприятия текстовой информации. Чем лучше оптимизирован текст для прочтение тем лучше – Google оценивает написание, начертание текста.

Minimalblog

1. Расширенные параметры гаммы
2. Разметка составляющих шапки в сетке 2,3 или 4
3. Липкий сайдбар и шапка
4. Соцкнопки
5. Вывод избранных записей, компоновка слайдера
6. От 2 до 4 колонок в подвале
7. Предзагрузка
8. Вывод формы контактов
9. Блоговые настройки вывода постов
10. Простая настройка типографии

Template File Articles

General References

Stepping Into Templates 

Introduction to the building blocks of WordPress Themes, the template files. Explains how they work together to build a web page and how template files can be included in other template files.

Template Hierarchy 

Description of the order of preference of templates for the generation of various pages. Briefly lists the various templates that WordPress checks for in the process of generating a requested page on the weblog.

The Loop 

Description of the WordPress Loop, which is the part of a template file that generates the content

The Loop in Action 

More about the WordPress Loop

WP Query 

WP Query is a class that refers to the $wp_query object used in the WordPress Loop. There are times when you may have to interact with the WP Query, for instance when creating multiple Loops, or when dealing with Conditional_Tags.

Header, Footer, Sidebar, and Content Sections

Designing Headers 

Customizing the header.php template file.

Adding Post Feeds to the Header 

How to add RSS feed links to your header template file

Customizing Your Sidebar 

Customizing the sidebar.php template file.

Customizing the Read More 

Customizing the look of Read More links on your excerpts

Next and Previous Links 

Customizing the look of next/previous post/page links

Styling Page-Links 

How to break up single posts into multiple pages, and customize their links

Separating Categories 

Putting custom separators in the category list for your posts

Using Custom Fields 

How to add custom meta-data to your blog posts, and how to display it

Adding Asides 

How to add side notes to your blog posts

How to make comments come in a pop-up window

Archives, Categories, and Special Pages

Creating a Static Front Page 

How to make a static home page, or splash page, for your blog

Author Templates 

Customizing the author.php template file which showcases information about the author and their posts.

Category Templates 

All about defining and customizing templates for the various category archives for your blog.

Tag Templates 

All about defining and customizing templates for the various tag archives for your blog.

Alphabetizing Posts 

How to make a category page use alphabetical rather than chronological order

Creating an Archive Index 

Customizing the archives.php template file which showcases posts by date.

Pages 

Describes WordPress Pages, and the relationship between Templates and Pages feature.

Page Templates 

Describes the Template Hierarchy for Pages and Custom Page Templates.

Styling Theme Forms 

Describes how to make forms in your templates for comments, search, etc.

Creating a Search Page 

Customizing the search.php template file.

Creating an Error 404 Page 

Creating a template file Page to feature a customized Error 404 Page.

Displaying Posts Using a Custom Select Query

Modifying which posts are displayed on a page

External Resources

Creating Multiple Single Posts for Different Categories

Выводы и рекомендации

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

Создать сайт на WordPress + Bluehostустановка CMS в 1-клик на хостинг ↵

Быстрый, простой и безопасный хостинг с автоматической установкой WordPress. Включена БЕСПЛАТНАЯ регистрация домена на 1 год + SSL сертификат в подарок!Цена: от $2.95

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