20 лучших премиум-тем для вордпресс на русском языке

OnePress

Если вас заинтересовала предыдущая минималистичная тема, но при этом ее не получилось установить по каким-то причинам или вам не понравились присутствующие в ней настройки, взгляните на другой шаблон для WordPress под названием OnePress

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

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

Более сложные структуры страниц

Заголовок

Контент

Боковая панель

Подвал

Множество тем WordPress используют одну или несколько боковых панелей, которые содержат меню навигации и дополнительную информацию о вашем сайте. Боковая панель формируется с помощью файла шаблона sidebar.php. Он может быть включен в файл шаблона index.php с помощью следующей строки (теги шаблонов):

<?php get_sidebar(); ?>

А где все остальное?

Заметьте, что мы не включили шаблонный тег для «получения» контента нашей web-страницы. Это потому, что контент формируется в цикле WordPress, внутри index.php.

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

Про отступы в HTML и CSS

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

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

Также следует избегать использование отступов не кратных 5, если это не выравнивание иконок относительно текста. Нет никой надобности использовать padding или margin 14px вместо 15px или 23px вместо 25px.

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

Отступы от заголовков H2, H3, параграфа или изображения

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

Посмотрите на мой сайт ploshadka.net и можете увидеть, что отступы тщательно вымерены и пропорционально соблюдены. Между изображениями и параграфами одинаковое расстояние. Нигде ничего не пляшет. Всё отцентрировано и аккуратно подведено. И для этого не нужны никакие фреймворки. Достаточно знать базовые вещи HTML и CSS. И применить их там, где не будут наслаиваться другие ненужные свойства, о которых я уже говорил.

Советы по файлам шаблонов

Здесь приведены несколько советов по созданию файлов шаблонов:

Отслеживайте открывающие и закрывающие теги

Файлы шаблона подразумевают использование тегов и ссылок на . Элементы HTML и ссылки на CSS могут «пересекать» файлы шаблона, т.е. начинаться в одном файле и заканчиваться в другом. Например, HTML элементы html и body обычно начинаются в header.php и заканчиваются в footer.php. Большинство тем WordPress используют HTML элементы div, которые также могут охватывать несколько файлов. Например, основной div для контента страницы может начаться в header.php и закончиться либо в index.php, либо в single.php. Отслеживание начала и конца элементов HTML может быть довольно сложным в процессе разработки или изменения тем. Используйте комментарии чтобы отмечать в файлах шаблона, где открываются и закрываются теги большого контейнера, так что вы сможете отслеживать, где какой div, и в какой секции.

Тестируйте разные файлы шаблона с разными типами страниц

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

Дополнительные комментарии

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

Не забывайте закрывать HTML теги

Таблицы стилей CSS в шаблонах

Вы можете использовать любые HTML и CSS теги и стили, которые захотите. Однако, мы рекомендуем следовать стандартной структуре тем WordPress (см. Site Architecture 1.5). Это сделает ваши темы более понятными для других пользователей.

Способ 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().

Gutentype

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

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

HTML шаблон

Bootstrap v4 начальный шаблон

Для его работы понадобятся файлы bootstrap.min.css и bootstrap.min.js, которые мы соответственно добавляем в папки css и js нашей темы. Скачать их можно по кнопке Download source code на той же странице.

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

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="/docs/4.0/assets/img/favicons/favicon.ico">

    <title>Starter Template for Bootstrap</title>

    <link rel="canonical" href="https://getbootstrap.com/docs/4.0/examples/starter-template/">

    <!-- Bootstrap core CSS -->
    <link href="<?=get_template_directory_uri();?>/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom styles for this template -->
    <link href="<?=get_template_directory_uri();?>/css/starter-template.css" rel="stylesheet">
  </head>

  <body>

    <nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
      <a class="navbar-brand" href="#">Navbar</a>
      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
        <span class="navbar-toggler-icon"></span>
      </button>

      <div class="collapse navbar-collapse" id="navbarsExampleDefault">
        <ul class="navbar-nav mr-auto">
          <li class="nav-item active">
            <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Link</a>
          </li>
          <li class="nav-item">
            <a class="nav-link disabled" href="#">Disabled</a>
          </li>
          <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle" href="http://example.com" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
            <div class="dropdown-menu" aria-labelledby="dropdown01">
              <a class="dropdown-item" href="#">Action</a>
              <a class="dropdown-item" href="#">Another action</a>
              <a class="dropdown-item" href="#">Something else here</a>
            </div>
          </li>
        </ul>
        <form class="form-inline my-2 my-lg-0">
          <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">
          <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button>
        </form>
      </div>
    </nav>

    <main role="main" class="container">

      <div class="starter-template">
        <h1>Bootstrap starter template</h1>
        <p class="lead">Use this document as a way to quickly start any new project.<br> All you get is this text and a mostly barebones HTML document.</p>
      </div>

    </main><!-- /.container -->

    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    <script>window.jQuery || document.write('<script src="<?=get_template_directory_uri();?>/js/vendor/jquery-slim.min.js"><\/script>')</script>
    <script src="<?=get_template_directory_uri();?>/js/vendor/popper.min.js"></script>
    <script src="<?=get_template_directory_uri();?>/js/bootstrap.min.js"></script>
  </body>
</html>

Если все сделано верно, то на главной странице сайта отобразится тема Bootstrap 4.

Perfect Portfolio

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

Из виджетов в Perfect Portfolio есть только меню с поиском, в которое можно добавить категории сайта или важные ссылки, ведущие на другие страницы. Главное преимущество этой темы – бесплатное распространение, поэтому ее можно за несколько секунд установить с официального сайта, ознакомиться и полностью пощупать. А если тема не понравится, просто удалить и перейти к поиску другого варианта.

eSell

Есть еще одна потрясающая тема, созданная специально для сайтов электронной коммерции – eSell. С полной поддержкой плагинов WooCommerce и bbPress вы можете создать веб-сайт для продажи ваших товаров / услуг через «электронные СМИ», то есть онлайн.

Основные особенности eSell:

• Уникальный интерактивный дизайн.
• Мощная панель опций.
• Кросс-браузерная совместимость.
• SEO оптимизирована.
• Настройки Adsense.

Эта тема WooCommerce – идеальное решение для интернет-торговли с настраиваемыми страницами оформления заказа, шаблоном регистрации пользователя и быстрым адаптивным стилем. Вы можете легко связаться с мобильными пользователями и предоставить им потрясающие возможности просмотра.

Скачать/Демо/ДеталиЗаказать сайт на этой темеПотестировать хостинг

Структура страницы 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 между вызовами файлов заголовка и подвала.

Puzzles

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

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

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

Минималистичные темы

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

Less

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

Kerinci

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

Voce

Все максимально просто: записи отображаются в 2 колонки, минимум информации в футере, а в хедере навигация (меню + категории) и соц.кнопки

Аккуратненькое такое решение, где основное внимание уделено контенту

The J A Mortram

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

Zinnia

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

Maker

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

Typist

Этот минималистичный шаблон WordPress сфокусирован на типографике — в нем найдете 7 цветовых схем, 17 опций шрифтов и 3 вида отображения содержимого. Дизайн как таковой практически отсутствует. Также есть выпадающее меню, поле виджетов, он совместим с Buddypress, Bbpress и Jetpack.

Portfolio Lite

Как вы поняли из названия, вариант идеально подойдет для портфолио. Здесь около 2000 загрузок и максимальная оценка. Макет допускает использование слайдшоу, которое центрируется по вертикали и горизонтали. Прикольно выглядит меню, да и вообще расположение контента оригинальное.

Ajaira

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

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

Hexo

Авторы темы говорят, что она идеально подходит для чтения: во-первых, за счет спокойной палитры цветов, во-вторых за максимальное внимание контенту и, в-третьих, поддерживает ретина дисплеи. Morning

Morning

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

Итого. Надеюсь данные 40 решений из подборки пригодятся вам в работе. После написания заметки могу сделать парочку выводов:

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

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

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

Скорость своей темы на WordPress

Скорость загрузки сайта, который работал вместе с дочерней темой:

Load Time — 60 секунд. Это какая-то катастрофа. Конечно сайт работал не так как определял сервис, а загружался в 1-4 секунды. Тем не менее, что-то pingdom.com никак не нравилось.

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

Load Time в почти 4 секунды это тоже не мало. Но надо учитывать, что запрос проверяется из Швеции, а не из России, откуда приходят большинство пользователей. Плюс сайт достаточно многофункционален, также загрузка тормозится ещё и из-за сторонней рекламы.

Если рассмотреть текущий сайт ploshadka.net имеющий те же самые основы, то можно увидеть, что он грузится значительно быстрее.

А применив последние технологии кэширования, меньше секунды. И это при проверки из Швеции! А сайт находится в России.

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

Полторы секунды из Швеции тоже вполне хорошо. Потому что если верить pingdom.com, то это быстрее 75% сайтов. А это значит, грубо говоря, что из 10 сайтов мой работает быстрее 7-и из них.

Инструменты имеют погрешности в измерении. В разные проверки значения меняются, но примерно остаются на том же значении.

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

Free WordPress Themes FAQ

What are the best free WordPress themes?

It depends on your project. If you create a blog – it should have the required “blog” component. Building a page dedicated to interesting places – consider adding the Google Maps module. If your website is dedicated to a band, then you need audio and video players. A theme should be responsive. It assures that it works correctly on mobile devices with different screen sizes. Good SEO will increase visitors’ number because it makes your page easy to find using search engines.

How can I get free WordPress themes?

You need to log in to your account. Find the product you like (consider using a search bar or filters on the left panel). Check the detail page. Consider using the “Live Demo” feature. Share the link on social networks and then get the required item. You may start customizing it.

How to customize free WordPress themes?

Our solutions are compatible with various visual editors. Please check out the details page to learn more about a template. Some are compatible with Elementor. It’s a user-friendly drag-and-drop editor. It allows designers to modify pages without dealing with the source code. You add an element and change its parameters to achieve the necessary look and behavior.

Emmet

Премиум тема Emmet имеет профессиональный вид, и подходит для корпоративного бизнеса и сайтов-портфолио. Многофункциональная тема WordPress с чистым адаптивным дизайном. Благодаря глубокой интеграции плагинов WooCommerce, Emmet прекрасно зарекомендовала себя на сайтах электронной коммерции.

Основные особенности Emmet:

• WooCoommerce совместимый.
• Многофункциональный конструктор веб-сайтов.
• Многоцелевые блоки контента.
• Визуальный конструктор страниц.
• Сдвиг или скрытие разделов главной страницы.
• Всевозможные цветовые схемы.

Скачать/Демо/ДеталиЗаказать сайт на этой темеПотестировать хостинг

Настройка сайта WordPress

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

Начнем с основных настроек сайта.

Настройка базовых параметров

Шаг 2. Перейдите в раздел «Настройки». На вкладках общее и написание интуитивно все понятно, на них вам нужно выбрать свой часовой пояс, формат даты или даже можете изменить имя своего сайта. А вот на вкладке чтение есть свои ньюансы. Здесь нужно установить опции RSS как на картинке:

Если оставить опцию RSS — полный текст, то боты будут воровать ваш контент.

Шаг 3: перейдите к настройкам постоянных ссылок, чтобы изменить способ отображения URL-адресов вашего сайта. Я себе сделал так как показано на скриншоте. Такой формат позволяет формировать простые и короткие URL, рекомендую сделать также. И не беспокойтесь, мои статьи выходят в топ с такими короткими ссылками.

Шаг 4: нажмите «Сохранить изменения»

Установка темы вашего сайта

Установка бесплатных тем вашего сайта в WordPress проста. Вам просто нужно перейти в «Внешний вид»> «Темы», найти свою тему среди огромной базы и нажать «Установить». Но когда вы покупаете премиум-тему, вам нужно вручную установить ее самостоятельно.

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

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

Шаг 1: Перейдите на страницу темы на панели управления WordPress и выберите Добавить новую. Затем нажмите кнопку «загрузить тему«.

Шаг 2. Найдите на своем компьютере файл темы .ZIP. Выберите его и нажмите «Установить сейчас».

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

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

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

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

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

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

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

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

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

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