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

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

В этой статье мы обсуждаем важность выбора соотвествующей темы. Затем предлагаем вам на рассмотрение тридцать тем 2020 года для вашего сайта на WordPress. Начнём!

На что обращать внимание, выбирая шаблоны WordPress

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

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

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

Toп 40: Лучшие шаблоны WordPress 2020

Учитывая список критериев, описанных выше, тридцать тем, которые мы хотим представить вашему вниманию, представляют разнообразные функции и характеристики. К тому же, все они имеют рейтинг, как минимум 4 звезды из 5 и обновлялись за последние шесть месяцев. Эта подборка может стать хорошим местом для начала поиска, если вы ещё не определились, где же вам искать свою тему. Ну, что, поехали!

1. Sydney

Для фрилансеров, агентств и компаний, ищущих сфокусированную на бизнесе и удобно настраиваемую тему, Sydney – это прекрасный выбор. Полноэкранный слайдер, закреплённая навигация, загрузка логотипа и ещё множество настроек позволит сделать внешний вид вашего сайта профессиональным. Кроме того, доступ ко всем шрифтам Google и полный контроль над вариантами макета и цветовых решений, даёт также множество настроек, которые помогут создать дизайн, соответствующий вашему конкретному бренду.

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

2. Flash

Если вам нужна тема с премиальными функциями, включая пользовательские виджеты, drag-and-drop конструктор страниц и встроенный механизм создания портфолио и бесплатно, Flash должен возглавить ваш список тем. Эта уникальная бесплатная тема предлагает несколько готовых демо , которые вы можете легко установить на своем сайте с помощью Demo Importer ThemeGrill . Конечно, у вас также есть возможность (и необходимые инструменты) для создания своего собственного сайта. С помощью Flash вы можете создать блог, бизнес-сайт или одностраничный сайт-портфолио.

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

3. Shopera

Иногда, всё что требуется – это несложный интернет магазин для презентации ваших продуктов и возможности их купить. С темой Shopera вы получаете именно это. Это современная и гибкая в настройке тема, которая хорошо и незаметно интегрируется с WooCommerce . Она также содержит ряд полезных функций электронной коммерции, включая опцию кнопка Прокрутка Вверх , «хлебные крошки» или бредкрамп при навигации по магазину и возможность загружать своё собственное лого.

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

10. iFeature

Если вы ориентируетесь на создание сайта для онлайн магазина или бизнес агентства, iFeature – это универсальная тема, которую вы можете использовать для любой цели. Если вы умеете пользоваться простым перетаскиванием (drag-and-drop), вы можете создать сайт с iFeature. Настройки дизайна можно применять глобально или настраивать отдельно каждую страницу, что даёт вам почти безграничные возможности.

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

11. Optimizer

25. The Minimal

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

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

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

1. Foto — WordPress тема для фотографов

Foto — тема с упрощенной и чистой конструкцией, позволяющей изображениям всегда находится в центре внимания. Эта тема WordPress невероятно проста в использовании и одинаково проста для навигации, и настроек. Гладкий дизайн, ближе к стилю минимализма, разработан специально для оптимального отображения фотографий и включает в себя 15 различных вариантов фото-альбома.
С темой Foto, вы с лёгкостью сможете настроить внешний вид вашего сайта фотографий. Также в данной теме использованы самые современные методики SEO и конечно же макет темы отлично вписывается в размеры экранов всех пользовательских устройств(смартфоны, планшеты, ноутбуки и пк).

2. Photography

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

3. TopNews

Top-News — это простая, многофункциональная, удобная в использовании, быстро загружаемая, настраиваемая, функциональная и современная тема WordPress, для создания новостных сайтов, онлайн-журналов, сайтов газет, блогов, публикаций видео и фотографий. Эта тема полностью отзывчива, отлично вписывается в любые размеры дисплея от самого низкого до более высокого разрешения и поддерживает все современные браузеры. В теме присутствуют разделы для публикаций видеороликов с YouTube и Vimeo.
Эта тема имеет несколько вариантов домашней страницы и шапки. Простая в использовании админ-панель с гибкими и мощными параметрами, которые позволяют легко настраивать тему, а drag & drop конструктор страниц, предоставляет возможность легко создавать уникальные страницы.
Тема соответственно SEO-оптимизирована, что изначально обеспечивает отличную платформу для достижения высоких рейтингов вашего сайта в поисковых системах.

4. Mango

Mango — это высококачественная, креативная тема с уникальным стилем и чистым кодом. Она может использоваться для многих типов творческих проектов, портфолио различных агентств, фрилансеров и т.д... Быстрые, плавные и оптимизированные страницы представлены в дизайне с выразительным стилем минимализма. Весь код под капотом и CSS четко прокомментированы и понятны.

5. Glossy

Тема оформления WordPress для Fashion-блогов и сайтов. Одной из главных особенностей темы Glossy является способность встраивать партнерские ссылки практически в любую точку темы, чтобы эффективно монетизировать ваш блог. Элегантный дизайн, в котором с первого взгляда, явно просматривается влияние моды, современен, чист и привлекателен. Семь вариантов макетов блога и 12 готовых шорткодов, подробная документация и дружественная поддержка, несомненно сделают работу над проектом более привлекательной.

6. Travelista

Travelista — это блог тема WordPress, разработанная для путешествующих блогеров. Конечно же эту тему можно использовать для любого вида блога. Travelista поддерживает различные форматы сообщений (стандартные, галереи, ссылки, видео, аудио, изображения, статусы и цитаты...). Также предоставлена возможность выбора из 9 различных вариантов макетов для блога и архивных страниц и 3 разных макета для отдельных страниц.
В Travelista есть мощный слайдер с возможностью выбора из пользовательских слайдов, сообщений по категориям или выбранных сообщений.
Возможность выбирать разные фон для каждой записи или страницы. Независимо от того, имеет ли ваш блог 10 или 10 000 сообщений, вы можете установить разные фоне для каждого сообщения или страницы.
Футтер темы красиво оформлен, с возможностью добавления логотипа с фоном. Также вы можете выбирать макет футтера из 4-х, 3-х, 2-х или одного столбца.
15 встроенных пользовательских виджетов, существенно упростят процесс ведения блога.

7. Marco

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

8. Blueberry

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

9. Electro

Electro — это надежная и гибкая в настройках тема WordPress, которая поможет вам максимально эффективно использовать WooCommerce для вашего интернет-магазина. Дизайн очень хорошо подходит для представления электронных продуктов, торговых площадок поставщиков и партнерских сайтов. Тема укомплектована большинством расширенных функций, доступных на самых популярных сайтах электронной коммерции, таких как Amazon, FlipKart, SnapDeal, WalMart, Alibaba и т.д...
Electro разработана на базе фреймворка Underscores, код — структурируемый и расширяемый, что позволяет разработчикам легко добавлять дополнительные функции через дочернюю тему и / или настраиваемые плагины. Благодаря скорости открытия выбранного продукта и процессу оформления, который необходим для онлайн-покупок, оптимизированная производительность Electro удовлетворит как вас самих, так и ваших клиентов.

10. Paperio

Paperio — визуально привлекательная, чистая и не загроможденная, многоцелевая тема блога WordPress, которая оптимизирована для SEO и скорости загрузки.
Полностью отзывчивый и современный дизайн, многоцелевой потенциал, способность настраивать эту тему для различных типов веб-проектов, таких как блоги о искусстве и фотографии, путешествиях и приключениях, новостные и журнальные сайты, проекты о интерьере и декоре, и т.д...
Paperio содержит 7 творческих и уникальных демоверсий с разными типами стилей с выбором предопределенного цвета, также вы можете использовать собственный цвет.
Используя более 400 разработанных опций, вы сможете очень быстро и легко настроить свой веб-сайт, визуально наблюдая все изменения в режиме реального времени.

11. uDesign

В настоящее время это 10-я самая продаваемая тема на ThemeForest, 45 000+ клиентов, заплативших свои кровные, просто не могут ошибаться.

U-Design — это мощная и удобная для пользователя тема, её могут с одинаковым успехом использовать, как люди не имеющие опыта программирования, так и продвинутые разработчики. Сайты могут быть построены быстро и с минимальными усилиями. С помощью такого мощного инструмента, вы можете преобразовать свой сайт за короткое время и своевременно, в лучшем виде, представить свой проект интернет-аудитории. SEO оптимизация — приоритет в разработке U-Design, о чем свидетельствуют показатели производительности выше. Например, в иерархии кода основной блок контента помещается перед боковой панелью независимо от положения панели, поэтому сначала поисковыми системами сканируется именно блок основного контента. С заголовками в плане SEO, также всё в полном порядке.

12. NanoMag

NanoMag — это красочная и привлекательная журнальная тема WordPress с полностью отзывчивым макетом. Тема включает в себя супер-полезный «drag and drop» конструктор построения контента, параметры темы, систему обзора, пользовательскую боковую панель и многое другое.

13. Folia

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

14. Ailsa

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

15. Aerious

Aerious — это универсальная, многоцелевая тема, которая обладает всеми необходимыми и дополнительными элементами, которые обычно присущи классическим многоцелевым темам. Что делает Aerious отличной от других тем, это её безграничные функциональные возможности, скорость и простой в использовании пользовательский интерфейс.
Тема поставляется в комплекте с 40 + готовыми слайдерами, пакетом готовых страниц, страницами режима обслуживания, несколькими форматами сообщений, встроенными опциями SEO, шаблонами готовых шаблонов, шаблонами отзывов, шаблонами клиентов и многими другими функциями!
Сверхлегкая конструкция темы способствует высокому уровню производительности.

16. CorpusChristi

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

17. Motor

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

18. Coolist

Coolist — современная тема WordPress в журнальном стиле. Основные особенности этой настраиваемой журнальной темы — простой в использовании конструктор построения сообщений, отличная прорисовка бесконечной прокрутки и горизонтальная навигационная система AJAX, аналогичная той, что используется на веб-сайте USA Today. Демонстрация ниже представляет, как тема может быть полностью настроена для конкретной ниши (например, игр), что дает вам гибкость настроек и контроля внешнего вида на любом этапе работы.

19. RT-Theme 19

RT-Theme 19 — отзывчивая многоцелевая тема WordPress с мощными инструментами CMS и несколькими уникальными вариантами дизайна.
Вы можете использовать тему для развёртывания корпоративного или бизнес-сайта, каталога продуктов, услуг, сайтов о строительстве, здоровье, интернет-магазина или портфолио, просто импортируя одну из демоверсий одним щелчком мыши.
Инструменты представления продукта и портфолио также предоставляют вам широкие возможности для создания списков и отдельных пользовательских страниц различных сервисов, например аренды автомобилей, недвижимости, презентаций гостиниц и многих других.
С RT-Theme 19 и плагином WooCommerce, без особых усилий, вы сможете создать полноценный интернет-магазин. Просмотрите демонстрационную страницу, чтобы увидеть другие демоверсии, созданные с помощью инструментов настройки темы.
Все демоверсии включают пакет тем и можно переключать скин по умолчанию на один из предварительно созданных скинов одним щелчком мыши. Или же создайте свой скин, используя панель настройки.

20. Modesto

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

21. Aven

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

22. Adama

Adama — многоцелевая тема WordPress, которая может использоваться для различных веб-сайтов, включая магазины электронной коммерции. Оптимизированная тема для SEO, совместима с WooCommerce, включает в себя плагины LayerSlider и iLightBox. Практичная и надежная тема, для создания сайта.

23. Alpha-blog

Alpha-Blog — чистая, отзывчивая блог-тема WordPress. Тема разработана с большим вниманием к деталям. Отзывчивый макет и интуитивно понятный интерфейс делают эту тему отличной для личного или корпоративного использования.
Код темы написан в соответствии стандартов WordPress, и его легко понять, и при необходимости так же легко изменить. Если вы разработчик, тема станет замечательным стартером для ваших будущих, творческих проектов. Если вы блоггер, вы получите быструю, отзывчивую и оптимизированную для SEO тему прямо из коробки.

24. Mallow

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

25. Publisher

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

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

С Уважением, Андрей

Сегодня знакомимся с бесплатным шаблоном GeneratePress. Есть дополнительный опции за плату.

WordPress шаблон GeneratePress: обзор

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

• Шаблон легкий и быстрый;
• SEO оптимизирован;
• Совместим со многими плагинам, включая основные: WooCommerce, Beaver Builder, Elementor, WPML, BuddyPress, bbPress;
• 100% валидный HTML;
• Шаблон имеет адаптированный дизайн;
• Совместим со всеми браузерами (включая IE8);
• Шаблон переведен на 20 языков;
• Шаблон GeneratePress имеет 5 позиций навигации, 6 видов шаблона, 4 положения сайдбара, настройки виджетов футера и много других настроек.

С кнопку «Enter» жать не нужно, система сама находит нужные шаблоны. Выбираем нужный шаблон, устанавливаем его кнопкой «Установить» и активируем кнопкой «Активировать». Предварительно примерить шаблон можно на кнопке «Посмотреть».

Шаблон GeneratePress легкий и быстрый

Скорость пустого шаблона проверять нет смысла, а вот объем его посмотреть легко. На самом деле весит шаблон меньше мегабайта.

Шаблон совместим с основными плагинами WP

Автор считает, что шаблон GeneratePress совместим с основными плагинам WordPress, а именно: WooCommerce, Beaver Builder, Elementor, WPML, BuddyPress, bbPress. Не знаю, почему автор считает их основными, просто напомню, что это за плагины:

• (интернет магазин);
• Beaver Builder (строитель домашних и целевых страниц);
• Elementor Page Builder (конструктор страниц веб-сайта);
• WPML (плагин для создания многоязычных виджетов);
• BuddyPress (плагин создания социальных связей и сетей);
• bbPress (форум на WordPress).

Адаптивный дизайн

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

• https://www.google.com/webmasters/tools/mobile-friendly/?hl=ru
• quirktools.com

или десятком других, но ограничусь инструментами разработчика своего браузера Chrom.

Видим, что шаблон действительно меняется (адаптируется) для различных устройств. Кстати, проверка адаптивности шаблона уже давно есть в консоли WordPress, на вкладке настройка шаблона (внизу слева).

Валидность HTML кода 100%

Проверяю валидность WordPress шаблон GeneratePress на сервере WC3 валидатор тут (https://validator.w3.org/ ). Скажу честно, я редко встречал шаблоны без ошибок в коде. GeneratePress такой шаблон.

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

1. Проверю верстку шаблона, на соответствие правилам SEO. Title, description, keyword смотреть не будем, они успешно задаются системой на любом сайте WordPress. Посмотрим теги h1. 2. Открываем главную страницу (последние записи). Смотрим код. Видим, что слов h1 на странице два, и они относятся к CSS. Для SEO это не важно. Важно, что все заголовки последних записей в тегах h2. 3. Открываем запись. Смотрим код. Видим, что слов h1 на странице четыре, и только два из них это теги, в которые обернут заголовок статьи.

4. Для успокоения души смотрим заголовки виджетов: они в тегах h4.

Вывод, анализ показал, что шаблон оптимизирован по основным правилам SEO.

Настройки шаблона GeneratePress

Осталось посмотреть настройки шаблона. В бесплатной версии они без излишеств, отличаются строгостью цвета, но достаточным разнообразием. Автор сделал одно место для размещения меню, но с пятью позициями:

• Над шапкой;
• Под шапкой;
• Справа от шапки;
• Слева от шапки;
• Справа в виджете.

6 макетов расположения боковой панели:

• Без сайдбара,
• Сайдбар справа или слева;
• Сайдбар только справа или только слева;
• Два сайдбара справа или слева.

Выпадающие меню с выбором открытия (клик или наведение курсора).

Настраиваемы футер, по количеству виджетов: 1-2-3-4-5 штук. (по умолчанию 3 виджета в футере).

Есть настройка цветов:

• Цвет текста;
• Ссылок;
• Посещенных ссылок;
• Цвет фона.

Вывод

Если бы я оценивал WordPress шаблон GeneratePress, то поставил 5 из 5 балов.

Примечание

Если вы не можете установить WordPress шаблон GeneratePress из консоли, идете на сайт шаблона (у этого шаблона отдельный сайт), скачиваете его и ставите по FTP. Сайт шаблона: https://generatepress.com.

Демо шаблона

Шаблон GeneratePress видео

Только следует учесть, что вордпресс генерирует некоторые классы, которые должны присутствовать в таблице стилей. К примеру классы aligncenter, alignleft и alignright служат для выравнивания изображений и блочных элементов, и их нужно включить в свою таблицу стилей (можно скопировать из таблицы стилей дефолтной темы):

.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignleft {
float: left;
}
.alignright {
float: right;
}

Следующие классы используются для выравнивания изображений, которые имеют подписи (можно скопировать из дефолтной темы, в дальнейшем при необходимости поправить):

.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
/* необязательные параметры, которые сделают скругленные углы в поддерживаемых браузерах*/
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}
.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}

Кроме того, существует еще несколько классов WordPress, которые необязательно описывать в таблице стилей, но, т.к. WordPress генерирует страницы с их использованием, можно и им задать стиль:

.categories {...}
.cat-item /* Этот класс присваивается всем категориям */}
.current-cat {/* стиль текущей категории */}
.current-cat-parent {/* стиль для предка(ов) текущей категории */}
.children {/* класс для потомка */}
.pagenav {/* постраничная навигация */}
.page_item {/* любой элемент списка */}
.current_page_item {/* этот класс присваивается в списке страниц к текущей активной странице */}
.current_page_parent {/*класс для родительской страницы по отношению к текущей */}
.current_page_ancestor {/* любая страница верхних уровней по отношению к данной */}
.widget {/* все виджеты обворачиваются в этот класс */}

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

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

Найти:

Поэтому учитываем это при верстки темы.

И последнее, что нужно добавить в style.css это информацию о себе любимом и о созданной теме. Информация размещается в начале файла в коментах:

/*
Theme Name: Придумайте уникальное имя темы
Theme URI: http://ссылка-на-домашнюю-страницу-темы
Description: Описание темы
Author: Автор темы
Author URI: http://ссылка-на-страницу-автора
Template: название-темы-предка
Tags: теги темы - только из списка предлагаемого wordpress.org
Version: версия
Ну и здесь текст лицензии
*/

Также не забудьте сделать screenshot.png и положить его в папку с шаблоном (в корень). Информация, размещенная таким образом в таблице стилей, будет отображаться в админке в разделе Управление «темами» . Сверстанный шаблон тестируем в браузерах, если все норм, можно идти далее.

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

Принцип работы wp-темы :

Если вы откроете папку темы по умолчанию (wp-content/themes/default), вы увидите множество файлов PHP (файлы темы) и одного файла style.css. Когда мы просматриваем блог, WP подключает файлы темы (index.php <

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

Шаг 1:
Для начала в директории тем вордпресса (wp-content/themes) создайте папку с именем нашей темы. Пусть это будет ruseller_lessons . Затем из папки темы по умолчанию (wp-content/themes/default) скопируйте файлы comments.php, search.php и 404.php в папку нашей темы. Эти файлы отвечают за комментарии и поиск на блоге. Затем в ruseller_lessons скопируйте таблицу стилей style.css нашего шаблона, screenshot.png (300x225) и папку images .

Теперь файлы нашего шаблона нужно "распилить", т.е. вытащить в отдельные файлы footer, sidebar и header. Схема показывает упрощенный вид файла index.php с метками, согласно которым будем его пилить:

Шаг 2 - Header.php
Открываем index.html и вырезаем все, что находится до коментария , создаем новый файл header.php и вставляем в него вырезанный код, сохраняем в директории нашей темы ruseller_lessons :