Что такое тема и шаблоны WordPress? Как работают шаблоны

Здравствуйте.

Рад приветствовать вас в курсе "Минимальная тема WordPress своими руками".

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

Работая с блогом Wordpress, сразу же сталкиваешься с такими понятиями как шаблон и тема . Давайте разберемся что это такое и зачем это нужно.

Вот небольшое видео, которое должно прояснить ситуацию.

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

Тема - это костюм или одежда для вашего блога.

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

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

Шаблон, по сути, это просто файл с расширением php, который содержит в себе HTML-код и php-функции.

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

  • Файлы стилей оформления с расширением *.css . Отвечают за внешний вид элементов: их размер, цвет, отступы и.т.д.
  • Шаблоны . Отвечают за то, какую информацию и в каких местах нужно выводить. Это файлы с расширением php.
  • Файл дополнительного функционала functions.php . Позволяет перенести или изменить какой-то функционал из служебных файлов wordpress и внедрить его в тему.
  • Изображения , которые будут использоваться для данной темы.

Хранятся эти файлы в директории wp-content/themes/. Для каждой темы создается своя папка.

Примерно, файлы шаблона выгледят вот так:

Темы можно менять через главное меню панели управления «Внешний вид – Темы»:

Возникает вполне логичный вопрос, а зачем вообще нужны темы (шаблоны)?

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

Таким образом, они работают независимо друг от друга.

Чем это хорошо?

Вы можете без проблем обновлять тему или версию Wordpress независимо друг от друга. Это очень удобно и быстро.

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

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

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

Как установить тему и редактировать шаблоны WordPress

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

Однако, если вы желаете постигнуть всю суть работы с сайтом и получить дополнительные знания, то стоит попробовать загрузить и установить для начала тему с помощью какого-нибудь ФТП клиента (я, например, использую ).

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

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

  • Распакуйте архив, кликнув по нему правой кнопкой мыши и выбрав соответствующую операцию;
  • Получив доступ по FTP к файлам вашего сайта, загрузите папку, полученную после разархивирования, на хостинг в директорию (папку) themes

В принципе, после этого тема WordPress установлена. Для того, чтобы подключить оформление к своему сайту, требуется лишь активировать ее в панели управления. В дальнейшем редактировать файлы шаблонов страниц можно будет через ту же админ панель, пройдя в раздел «Внешний вид» - «Редактор» :

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

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


А вот какой интерфейс для редактирования предлагает Нотпад плюс плюс:


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

И еще. Редактирование шаблонов WordPress я советую осуществлять на локальном сервере, то бишь на своем компьютере (здесь Денвер, а еще лучше, Open Server вам в помощь). Сделали все нужные изменения, протестировали, а затем уже заливаете файлы на хостинг. Эксперименты с "живым" сайтом могут дорого стоить.

Файловая структура шаблонов страниц

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

Ваш_сайт/wp-content/themes/название_вашей_темы

Для моего блога в папку с одной из установленных тем этот путь выглядит так:

Сайт/wp-content/themes/country

При просмотре в окне редактора Нотпад++ папка со всеми файлами вашей темы WordPress будет выглядеть следующим образом:

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

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

Кроме того, есть шаблоны, которые нужны для конструирования отдельных частей, отображаемых на всех страницах сайта. Это шапка, или хидер (header.php), левая и/или правая колонка, иначе сайдбар (sidebar.php), подвал, или футер (footer.php). Схематически такую конструкцию с областями страницы можно представить так:


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

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

Иерархия шаблонов WordPress и последовательность вывода страниц

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

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

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

  1. Home (главный приоритет);
  2. Index.

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

  1. Single-{post_type}. Скажем, если в конкретном случае тип записи product, то WP будет обращаться к шаблону single-product.php;
  2. Single;
  3. Index.

Для статической страницы Page иерархия следующая:

  1. Custom template (пользовательский шаблон, который создан специально для конкретной вебстраницы);
  2. Page-{slug}. Здесь slug - короткое название (псевдоним) страницы. Например, если в составе темы присутствует файл с названием page-recent-news, то WP обратиться к нему;
  3. Page-{id}. Если вебстраница отождествляется по конкретному идентификатору (id) 12, то именно она будет следующей по иерархии, ежели отсутствуют указанные выше;
  4. Page;
  5. Index.

Чтобы вывести страницу рубрик, Вордпресс предпримет поиск специального файла, затем будет искать по id. Если таких шаблонов не существует, то преимущество получит общий шаблон Category , далее по убывающей Archive и Index:

  1. Category-{slug};
  2. Category-{id};
  3. Category;
  4. Archive (архив);
  5. Index.

Аналогичная картина вырисовывается и для тега (метки). В первую очередь специальный шаблон, далее на основе id, после чего Tag , Archive и Index:

  1. Tag-{slug};
  2. Tag-{id};
  3. Archive;
  4. Index.
  1. Author;
  2. Archive;
  3. Index.

Продолжаем, осталось немного. Существует возможность наличия страницы временного архива Date . В этом случае WP после неудачи будет искать Archive, после него Index:

  1. Date;
  2. Archive;
  3. Index.

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

  1. Search;
  2. Index.
  1. Index.

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

  1. Image, video, audio;
  2. Application;
  3. Attachment;
  4. Index.

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

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

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

  • Можно получить уникальный сайт или лэндинг, отличный от конкурентов. Учитывая миллионы блогов, построенных на этой CMS, каждый типовой дизайн используется как минимум сотню раз.
  • Полная свобода действий на этапе разработки. Можно добавлять собственный функционал с нужными именно вам рабочими элементами.
  • Можно применять разные дизайны для разных разделов сайта, что невозможно при использовании готового шаблона.
  • Можно сделать несколько видов и предоставить посетителям возможность переключаться между разными темами, что повысит интерес и лояльность к веб-ресурсу.
  • Простота работы на Вордпресс делает ее доступной для многих (в помощь будут видео-уроки в интернете). А значит, собственноручная разработка главной или создание дочерней темы позволит сэкономить деньги на привлечении сторонних дизайнеров и программистов.
  • Можно воспользоваться возможностью дочерних тем – когда корректировки вносятся в дублеры таблицы стилей style.css, а главный файл при этом остается нетронутым. Это позволяет быстро отменить изменения, если они окажутся неудачными, а также не терять наработки при обновлении основной темы.

Краткая инструкция

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

Шаг первый: подготовительные работы

Перед началом работ надо убедиться, что у вас есть текстовый редактор (самым простым является Блокнот или Nodepad++, тем более скачать их можно бесплатно). Следующий шаг – установка движка WordPress и набора Denwer на локальный компьютер. Денвер – это пакет важных инструментов для программистов. С помощью них значительно облегчается и ускоряется процесс разработки и внесения изменения сайтов. Как его устанавливать, подскажет это видео:

Шаг второй: создают папку новой темы

Переходим в нужную директорию. Она чаще всего имеет следующий путь: . Здесь хранятся все темы – и стандартные, и произвольные. Заходим в нее создаем новую папку. Называем ее, например, «MyFirstTheme».

Теперь переходим в новую папку и обязательно добавляем два файла, сделанных через Nodepad++ или другой редактор. Это index.php и style.css. Пока эти документы пусть останутся пустыми, потом мы еще займемся их наполнением. Еще добавьте в «MyFirstTheme» сюда папку images. куда можно будет добавлять картинки для оформления шаблона.

В последствии в «MyFirstTheme» можно добавлять шаблоны для отдельных частей сайта: боковой панели (sidebar.php), сайта (header.php), записей на страничках (single.php), комментариев (comments.php) и пр. Набор дополнительных файлов зависит от структуры, которую вы запланируете для своего веб-ресурса.

Шаг третий: наполнение index.php

Первое, что надо сделать – заполнить индексный файл (index.php). Вот пример самого простого кода, по которому у сайта будет четыре области: header, main, sidebar и footer.












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

Шаг четвертый: заполняем и style.css

Теперь надо открыть style.css, добавить и заполнить следующие поля (вписать вместо *** собственную информацию о сайте и владельце). Введенные данные будут отображаться в админке.

/*Theme Name: ***

Theme URI: http:// ***

Author URI: http:// ***

Description: ***

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

(информация в /**/ — это комментарии, а не части кода)

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

Шаг пятый: разбиваем файлы

Все элементы, указанные в index.php следует продублировать отдельными файлами. В шаге первом в примере помимо главной части main были указаны header, sidebar и footer – следовательно, для них создаем свои документы в формате.php.

Например, создаем файл header.php, открываем index.php. находим соответствующий участок кода и вставляем его в новый файл. Это будет:






Site Title



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






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

  • Header – стиль шапки вашего сайта.
  • Comments – шаблон для создания комментариев.
  • Home – тема для главной страницы.
  • Page — определяет тему, если создадите отдельные странички на сайте
  • Category – шаблон для разбивки на категории
  • Date – определяет стиль вывода даты-времени.
  • Archive – шаблон для архивного раздела со старыми материалами.
  • Search – файл, в котором указываются параметры для поиска на сайте.
  • 404 — шаблон для страницы, на которой сообщается об ошибке 404 Not Found.
  • Footer – определяет стиль подвала вашего сайта.

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

Шапка в header.php:

Добавление контента:

Стилизация комментариев:

Подвал на сайте:

Как можно вносить изменения без опасений

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

Чтобы этого не произошло, можно создать дочернюю тему WordPress (подтему) – это дублер файла стилей style.css, не затрагивающий главный файл (изменения в одном не отменяют обновления в другом).

Создание дочерней темы WordPress не составит никакого труда. Надо сделать новую папку в основном каталоге C:\WebServers\home\localhost\www\НАЗВАНИЕ_ЗАДАННОЕ_ПРИ_УСТАНОВКЕ\wp-content\themes . В новой папке делаем свой файл style.css с вот таким содержимым:

Theme Name: НАЗВАНИЕ ТЕМЫ

Template: НАЗВАНИЕ ПАПКИ В ДОЧЕРНЕЙ ТЕМОЙ

Theme URI: ЗАПОЛНИТЬ

Description: ЗАПОЛНИТЬ

Author URI: ЗАПОЛНИТЬ

/* импортируем стили родительской темы */

@import url(«../НАЗВАНИЕ/style.css»);

/* Свои дополнительные стили */

Foo{ color:red; }

Теперь можно в админке зайти во «Внешний вид›Темы» и активировать дочерний шаблон. В дальнейшем можно работать в новом файле. В дополнение небольшая видео-презентация на тему дочерних шаблонов:

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

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

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

Что мы должны проверять, выбирая шаблон для WordPress, какие методы можно использовать для его проверки и оценки? Рассмотрим основные моменты.

Выбор шаблона для Wordpress.

Код страницы.

Первое, что нужно проверить – «чистота» кода. Чтобы увидеть HTML-код страницы, нужно нажать Ctrl+U, или щелкнуть правой кнопкой мыши на странице и выбрать Просмотр кода страницы. Код страницы не должен содержать CSS-стилей, они должны быть вынесены в отдельный файл. Если это не сделано, то страницы будут иметь большой «вес», и сайт будет сильно нагружать хостинг.

Сайдбар после контента.

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

Заголовки .

Для поисковиков большое значение имеют тэги заголовков h1 и h2 . В коде страницы должен быть только один тэг h1. Если это условие в шаблоне соблюдается, говорят, что шаблон SEO-оптимизирован.

«Битыми» называют ссылки, которые никуда не ведут. Таких ссылок в хорошем шаблоне быть не должно. Как проверить шаблон на наличие «битых» ссылок? Для этого можно воспользоваться специальным сервисом Интернета http://gtmetrix.com/ . Запускаем сервис, вводим адрес сайта, нажимаем GO! .
После окончания сканирования сайта нужно выбрать вкладку Timeline и нажать View Larger Version

Сервис проанализирует скорость загрузки страниц, но нас интересует работа ссылок. Смотрим второй столбец. Если там 200 OK, то ссылка рабочая, а если 404, то ссылка никуда не ведет, она «битая».

Аналогичную проверку можно выполнить с помощью сервиса http://tools.pingdom.com/ .

Внешние ссылки, то есть ссылки, ведущие на внешние ресурсы, также понижают рейтинг сайта в поисковых системах. Значит, их должно быть как можно меньше. Для обнаружения таких ссылок можно использовать плагин TAC (Theme Authtenticity Checker) . Он проверяет работоспособность шаблона и наличие внешних ссылок.

Чтобы установить плагин, в строке поиска набираем TAC и устанавливаем плагин.
После его активации переходим в консоли WordPress Внешний вид ТАС

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

На примере видно, что тема Admired рабочая (Theme OK) и не содержит внешних статичных ссылок.

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

Третья тема iDream тоже не очень хороша, так как содержит шесть внешних ссылок.

Валидация темы.

Последним этапом проверки темы будет анализ соответствия кода стандартам HTML. Для этого можно использовать сервис http://validator.w3.org/ . Переходим на данный сервис. вводим адрес своего сайта и ждем результат

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

Вот таковы основные этапы выбора шаблона для WordPress. Ну а выбор внешнего вида, стиля оформления — это дело вашего вкуса.

Для создания блога с уникальным дизайном на CMS WordPress можно воспользоваться курсом «Уникальный сайт с нуля» .

Если вас заинтересовала статья, или вам есть, что добавить, оставьте комментарий.

Сейчас объясню, как сделать из простого HTML-шаблона тему WordPress на примере дизайна из той статьи.

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

Итак, приступим.

Распределяем код по файлам

1. Скачайте шаблон и распакуйте его в папку с темами WordPress (адрес вида адрес_блога_wordpress/wp-content/themes/ ). Если хотите, переименуйте папку с темой на свой вкус. Например, у меня шаблон располагается по адресу адрес_блога_wordpress/wp-content/themes/MyTheme/ .

2. Переименуйте файл styles.css в style.css .

3. Откройте style.css в редакторе кода (таком, как Notepad++) и в самое его начало вставьте следующие строки:

/* Theme Name: MyTheme Theme URI: http://test1.ru Author: NoName Author URI: http://test1.ru Description: Example of test Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html */

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

4. Создайте файлы header.php , index.php , sidebar.php , footer.php и распределите по ним код из index.html .

4.1. В header.php скопируйте код по строчку , так как этот файл отвечает за верх сайта. styles.css замените в коде на style.css - новое корректное имя файла.

4.2. В index.php вставьте код основного блока (со строки по строку ).

4.3. В sidebar.php скопируйте код бокового меню по ).

4.4. В footer.php вставьте оставшиеся строки (с до конца документа index.html ).

5. Удалите index.html .

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

Адаптируем header

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

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

1. Откройте файл header.php и замените содержащийся в нём код до блока

на следующий:

> "> "> " type="text/css" media="screen" /> <?php bloginfo("name"); ?>

Мы сделали динамическим блок

Код вызывает функцию, возвращающую языковые атрибуты в контейнер.

">

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

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

2. Перейдите к редактированию файла index.php. В самом его начале пропишите

,

Строчки вызывают файлы шапки, боковой панели и низа сайта.

Теперь вы можете просмотреть или даже активировать MyTheme. В результате браузер отобразит уже знакомый шаблон со статическим меню и одной-единственной страницей. Чтобы меню стало динамическим и настраиваемым, а вместо одной страницы отображались все помещённые на сайт материалы, нужно преобразовывать шаблон дальше.

Делаем динамическим верхнее меню

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

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

так, чтобы получилось следующее: