Интернет        29.12.2022   

Как создать тему для WordPress самому: уроки с видео. Как создать свою тему для WordPress? Как повысить функциональность и юзабилити ресурса

Всем привет, пытаюсь «взяться за ум» и привести свои блоггерские дела в порядок. Последний раз я выходил на связь примерно два месяца назад, если не считать не давней . Нет, я периодически заглядываю на блог, стараюсь отвечать на комментарии, статьи даже пишу время от времени, поменял хостинг-провайдера, обзавелся кучей новых идей в плане дальнейшего развития блога. Но пока это как-то не торопится реализовываться, а находится либо в голове, либо на бумаге, либо в виде ментальной карты. Кстати по поводу ментальной карты, советую попробовать – классная штука ! Помогает разложить всё по полочкам и достигнуть намеченной цели.

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

Новость 2. Я сменил хостинг провайдера. Да простит меня Макхост , но согласитесь 70 рублей в год – это лучше, чем 2629 рублей в год. Теперь я буду платить за услуги хостинга в 37 раз меньше. Мой новый хостинг называется Justhost, с его услугами и тарифами вы можете ознакомиться здесь .

А теперь непосредственно к главной теме статьи – создание блога на wordpress с нуля . Раскрыть этот вопрос я решил на одной единственной странице. Было в планах разделение на целых пять отдельных статей, но решил всё-таки всё запилить в одну. Эта идея у меня вылилась в страницу под названием . Она теперь будет располагаться в верхнем меню блога и будет являться помощью в созданию блога любому человеку.

Это не все новые страницы, все другие темы также получат полнометражные страницы, где в полной мере будет раскрываться рассматриваемая тема. Я теперь считаю, что основные темы блога должны присутствовать на главной странице. В моём случае, это будет в виде меню. Скоро сами всё увидите. Хочется главные темы и в шапке отразить, поэтому этот вопрос я также прорабатываю.

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

Создание блога на wordpress с нуля

1. Всё начинается с идеи

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

2. И имя ему …

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

3. Проба пера

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

4. Пробный пуск и сдача в эксплуатацию

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

5. Поработаем дизайнером

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

Именно такое расположение этапов я считаю правильным при создании блога на wordpress с нуля.

Создать блог самостоятельно совсем не сложно, пробуйте, всем удачи и пока…

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

В WordPress можно создавать страницы (page) и записи (post). Отличаются они тем, что записи: попадают в ленту на главной странице; для записей указываются категории; записи не могут быть древовидными, а страницы: используются для такого содержимого как "Обо мне", "Контакты", "Карта сайта"; не имеют категорий, а имеют древовидную структуру. Записи обычно предназначены для хронологической информации (по времени добавления), а страницы для древовидной структуры не зависимой от времени. Для примера, эта статья опубликована как "запись" в рубрике "Кодекс", а ссылки в меню шапки ведут на страницы: Функции .

Страницы похожи на записи - они расположены в одной таблице базы данных и данные у них почти одинаковы: заголовок, текст, дополнительные поля и т.д. И то и другое - это записи, но разных типов: страницы древовидные и организуются путем создания родительских и дочерних страниц, а записи объединяются рубриками и метками. В WordPress можно создавать дополнительные типы записей древовидные или нет.

Создание страниц в WordPress

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

Способ 1: шаблон страницы через файл с произвольным названием и подключением его в админ-панели (классический способ)

Это самый распространенный способ создать шаблон страницы в WordPress. Для этого нужно создать.php файл, например, tpl_my-page.php в папке темы и в самом начале файла вписать пометку, что созданный файл является шаблоном для страниц:

Теперь при создании страницы в админ-панели в блоке «Свойства страницы» мы сможем выбрать "шаблон":

С версии WordPress 4.7. такие шаблоны страниц можно создать для любого типа записи, а не только для page. Для этого дополните комментарии строкой: Template Post Type: post, page , где post, page - это названия типов записей к которым относится шаблон.

/* Template Name: Мой шаблон страницы Template Post Type: post, page, product */

Преимущества:

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

  • Можно получить только записи с указанным шаблоном. Например, можно вывести все страницы с шаблоном «Услуги» (файл servises.php). Иногда это удобно. Название файла шаблона хранится в метаполе _wp_page_template , поэтому чтобы вывести страницы с указанным шаблоном нужно создать запрос по метаполю (см. WP_Query).

Недостатки:

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

Как это работает:

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

Template Name: ***

Строка может располагаться где угодно и как угодно в файле.

Все файлы с подобными строками собираются и выводятся в выбор шаблона в блок "Атрибуты страницы".

При публикации страницы, в произвольное поле _wp_page_template записывается название файла шаблона или default , если шаблон не указан:

Wp_page_template = default
_wp_page_template = tpl_my-page.php

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

Способ 2: шаблон страницы через файл с конкретным названием (иерархия файлов шаблона)

При создании страницы ей устанавливается ярлык (слаг, альтернативное название). Он используется в УРЛ страницы. И его можно изменить:


Для создание шаблона этим способом, вам нужно узнать слаг страницы и создать файл в папке темы. Допустим, наш слаг как на картинке равен contacts , тогда создадим в теме файл page-contacts.php . и заполним его нужным кодом (можно скопировать содержимое из файла шаблона page.php и отредактировать под себя). Все, теперь при посещении страницы мы должны увидеть новый шаблон. Аналогично можно взять ID (пусть 12) страницы и создать файл page-12.php .

Достоинства:

Нет необходимости заходить в админ-панель и устанавливать файл шаблона. Шаблон начинает работать сразу после создания файла. Удобно при разработке.

Недостатки:

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

Практически бесполезен при написании шаблонов, а тем-более плагинов. Его можно использовать, когда правишь свой сайт, в котором слаг или ID страницы известны заранее.

Как это работает:

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

  • {любое_название}.php (когда используется шаблон страницы)
  • page-{ярлык_записи}.php
  • page-{ID_записи}.php
  • page.php
  • singular.php
  • index.php

Способ 3: шаблон страницы через фильтр "template_include" (коддинг)

Это продвинутый способ, он более сложный, но вместе со сложностью он открывает широкие возможности. С помощью этого способа можно задать шаблон любой странице, записи, категории, любой публикации на сайте или вообще группе любых публикаций. Смотрите примеры с описанием:

// фильтр передает переменную $template - путь до файла шаблона. // Изменяя этот путь мы изменяем файл шаблона. add_filter("template_include", "my_template"); function my_template($template) { # аналог второго способа // если это страница со слагом portfolio, используем файл шаблона page-portfolio.php // используем условный тег is_page() if(is_page("portfolio")){ if ($new_template = locate_template(array("page-portfolio.php"))) return $new_template ; } # шаблон для группы рубрик // этот пример будет использовать файл из папки темы tpl_special-cats.php, // как шаблон для рубрик с ID 9, названием "Без рубрики" и слагом "php" if(is_category(array(9, "Без рубрики", "php"))){ return get_stylesheet_directory() . "/tpl_special-cats.php"; } # шаблон для записи по ID // файл шаблона расположен в папке плагина /my-plugin/site-template.php global $post; if($post->ID == 12){ return wp_normalize_path(WP_PLUGIN_DIR) . "/my-plugin/site-template.php"; } # шаблон для страниц произвольного типа "book" // предполагается, что файл шаблона book-tpl.php лежит в папке темы global $post; if($post->post_type == "book"){ return get_stylesheet_directory() . "/book-tpl.php"; } return $template; }

Такой код нужно разместить в файл темы functions.php или в плагин, или подключить как-то еще. Как видно из примера во время фильтра template_include уже работают условные теги, установлены глобальные переменные: $wp_query , $post и т.д.

Достоинства:

    Можно установить шаблон для любой страницы или группы страниц. Практически полный карт-бланш в действиях.

  • Можно создать шаблон при написании плагина.

Недостатки:

Необходимость писать код и отдельно его подключать (например, в functions.php темы).

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

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

Настрока wordpress с нуля для начинающих

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

Удалите тестовые страницы и статьи

Заходите в административную панель блога и далее Записи > Все записи и удаляете тестовую статью «Привет мир». Таким же образом переходите Страницы > Все страницы и удаляете тестовую страницу.

Прописываем постоянные ссылки

По умолчанию в WordPress настроенные постоянные ссылки следующего вида — http://site.ru/p=123 . Такие ссылки, хоть и являются короткими, но они не являются человекопонятными, и поисковые системы их хуже индексируют.

Вы должны изменить их, чтобы сделать ЧПУ ссылками, т.е. подходящими под запросы поисковых систем.

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

Устанавливаем часовой пояс

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

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

Отмените регистрацию на блоге

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

Обсуждения и комментарии

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

Сервисы обновления

По умолчанию в WordPress настроен только один сервис обновления, при этом вы можете уведомить о выпуски новой статьи на блоге имея расширенный список сервисов. Добавьте список сайтов уведомления перейдя в Настройки > Написание . вы можете скачать список сайтов.

Пробежимся по списку изученного

  • Настроили постоянные ссылки
  • Настроили часовой пояс
  • Настроили комментарии
  • Добавили список сервисов обновлений.

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

Что делать дальше

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

  • Установка плагина WordPress SEO by Yoast и по этой вы можете прочитать руководство по его настройке.
  • , которые увеличивают посещаемость блога.
  • Также советую перейти по ссылке, где вы узнаете все об установке на блог.

Советую подписаться на обновления блога , чтобы быть в курсе событий по настройке блога WordPress и его продвижению.

2 голоса

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

1. Сбылась мечта идиота

Немного отвлеку вас от разбора основного вопроса статьи и поделюсь радостью. Сегодня по почте пришла моя карта Яндекс Деньги. Можете похихикать, типа чему тут радоваться? Но имейте ввиду, я живу в небольшом городке на Дальнем Востоке, цивилизация сюда доходит с опозданием. Здесь у половины населения вообще нет пластиковых карт, а что такое знают один человек из двадцати, в лучшем случае. Провинция.

Карта шла 21 день, и вот сегодня пришло СМС, что карта ожидает меня на почте. Естественно, почтовое извещение я ждать не стал, ведь это Почта России:). Сходил и получил вот такой конверт, внутри Инструкция и приветственной письмо с самой картой.


Наконец-то дождался. Вот он долгожданный конвертик.
Внутри инструкция пользования картой и письмо.
Внутри письма прилеплена сама карта.
Поздравляю! Себя.

Часть клиентов расчитываются со мной именно Яндекс Деньгами, а тратить их я мог по очень ограниченному перечню, теперь с ней смогу по магазинам ходить.

А какими картами вы предпочитаете пользоваться, и почему?

Теперь по существу сегодняшнего вопроса.

2. Дизайн

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

2.1. Вы нанимаете дизайнера

Не так давно работал над полной доработкой сайта дверей. Меня позвали, потому что портал не приносил никакой пользы. В его дизайн угрохали 60 000 рублей и ничего. Один-два человека в месяц, которые сбегали быстрее, чем с парохода «Титаник».

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

Фактически магазин занимался не только межкомнатными, но также входными дверьми, автоматическими воротами, фурнитурой и художественной ковкой. Звучит вроде бы неплохо, если не учитывать одно «но»… портал не содержал ни единого текста. Кроме того, туда затолкали какие-то непонятные фотографии со сторонних источников.

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

Мы вместе с несчастным чертом бесконечно ломали ноги и пытались привести все это в хоть какой-нибудь порядок.

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

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

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

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

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

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

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

Я не просто так решил пройтись по дизайнерам. Наболело. Воюю с ними регулярно.

2.2. Бесплатные или платные шаблоны

Поговорим о шаблонах для wordpress. Вот это – то что надо! Их в интернете великое множество. Чаще всего они разложены по специфике: для интернет магазинов, бизнес-журналов, порталов с рецептами и другими тематическими изданиями. Эти шаблоны помогают новичку начисто забыть о дизайне и сконцентрироваться на наполнении.

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

Мне очень нравятся темы на сайте Template Monster . Сделаны довольно неплохо, поддерживают большинство плагинов, что дает широкие возможности для усовершенствования дизайна. Цены не кусачие и техническую поддержку можно получить, если возникнут проблемы - разработчик поможет с установкой.

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

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

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

2.3. Вы можете сделать дизайн сами

Это будет довольно сложно и, возможно, придется запастись не одним томом из серии «Основы коммерческого веб-дизайна », «Основы CSS », «HTML для начинающих » (по ссылкам можете скачать их бесплатно), просмотреть не один десяток видео уроков, а также пройти через ряд сложностей и неудач. Но в принципе, если вы решитесь на этот шаг - мое почтение. Хватит сил, мужества и упорства реализовать затею - нереальный респект!

3. Базовая настройка – пошаговая инструкция

Теперь: как настроить сайт. Если вы , скорее всего, все уже будет настроено, но на всякий случай проверьте. Выполнить настройку не составит труда.

Главная страница – самый важный элемент вашего сайта. Настроим ее: для этого перейдем в «Настройки – Чтение»:

Лучше всего, если на главной странице будут отображаться ваши последние записи, тогда читатели будут уделять особое внимание последним публикациям на вашем портале. 6 – оптимальное число постов для блога.

В RSS ленте тоже должно быть 6 новостей. Это увеличивает шансы на обретение популярности.

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

Для каждой статьи в ленте рекомендую отражать «Анонс», а не «Полный текст». Так вы уменьшите длину главной страницы, сможете более точно вычислить какие ваши публикации пользуются наибольшей популярностью (для этого мы потом установим Яндекс Метрику). Помимо этого, из RSS-ленты люди будут заходить на ваш сайт, а не читать информацию со стороннего источника. Нам это не нужно.

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

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

Под этим пунктом вы найдете раздел: «Перед появлением комментария».

В самом низу раздела запрятана самая важная кнопка: «Сохранить изменения». Не забудьте ее нажать.

Теперь поговорим о плагинах. Ну, во-первых, что это такое? Если по-простому, то сейчас у вас появился телефон или новый компьютер (сайт), wordpress – это все равно что windows или android (операционная система), а плагины – это дополнительные приложения, которые будут помогать вам в работе.

Сейчас вам нужно установить плагин ЧПУ (человеко понятные урлы). Адрес страницы с информацией, отображаемая в поисковой строке, в простонародье именуется урлом.

Сейчас на вашем сайте она выглядит крайне непрезентабельно. Часть написана кириллицей, а часть латиницей. Установите плагин «Rus-to-lat», чтобы этого исправить.

Зайдите в раздел плагины и введите его название в поисковую строку.

После нахождения наживаете кнопку «Установить».

И активируйте плагин.

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

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

Здравствуйте, друзья! Сегодня я расскажу о принципах и технических моментах создания темы для WordPress с нуля. Эта статья написана для тех, кто имеет какой-то опыт работы с движком WordPress и, хотя бы на базовом уровне, разбирается в HTML и CSS.

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

Если вы решили создать собственную уникальную тему оформления, то перед созданием темы нужно продумать дизайн и сверстать HTML шаблон сайта или заказать у фрилансеров, решать вам. В общем, у вас должен получиться сверстанный шаблон, например, вот с таким содержимым: файлы index.html и style.css , папка картинок images и папка js со скриптами. Из этого шаблона мы и будем делать тему оформления.

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

Для создания темы оформления необходимо знать функции или как их еще называют — теги WordPress. Мы разберем основные функции темы, со всеми тегами вы можете ознакомиться на официальном сайте codex.wordpress.org .

Структура темы WordPress

В папке themes создаем папку и называем ее, например, mytheme . Затем в нее переносим наш style.css и создаем необходимые файлы.

Создаем шаблоны блоков, которые отображаются на всех страницах:

  • header.php - шапка вашего сайта;
  • sidebar.php - боковая колонка с различными виджитами;
  • footer.php - подвал сайта.

Шаблоны контента:

  • Index.php - шаблон главной страницы, выводятся короткие анонсы статей;
  • single.php - шаблон постов (статей);
  • page.php - шаблон статических страниц;
  • category.php - шаблон категорий;
  • search.php - шаблон выдачи результатов поиска;
  • 404.php - шаблон сообщения о несуществующей странице;
  • comments.php - шаблон коментариев.

Дополнительные файлы:

  • functions.php - файл дополнительного функционала и изменения стандартного функционала движка WordPress;
  • searchform.php - код формы поиска;
  • screenshot.png - Изображение 880 х 660, превью отображается в админке во вкладке «темы».

Не обязательные шаблоны (по моему мнению):

  • author.php - шаблон страницы автора;
  • archive.php - шаблон архивов;
  • date.php - шаблон вывода дат;
  • tag.php - шаблон меток;
  • attachment.php - шаблон страниц вложения.

Лично я редко использую пять последних шаблонов, в основном делаю перенаправление на «главную» или на «404 ошибку» при запросе данных шаблонов. Информацию об авторе можно оформить на основе page.php , а остальные четыре только плодят дублированный контент на вашем сайте, организацию архивов можно реализовать намного продуктивнее.

Начинаем с файла style.css , делаем отступ и в самом верху вставляем закомментированный текст с названием и описанием темы.

/* Theme Name: Название темы Theme URI: УРЛ адрес, если есть отдельный сайт о теме Description: Описание темы оформления Version: Версия, например (1.0) Author: Ваше имя Author URI: УРЛ адрес автора темы */

Файл стилей придется редактировать при подключении функционала WordPress, который добавляет дополнительные участки кода.

Формируем header.php

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

Код был таким.

Мой блог

После переноса и редактирования стал таким.

" /> <?php echo wp_get_document_title(); ?> " rel="stylesheet" type="text/css" />