SEO Маяк

Всем привет! Сегодня на seo-mayak.com я расскажу, как создавать индивидуальные шаблоны страниц для WordPress.

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

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

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

Все дело в том, что стандартный редактор WordPress TinyMCE не хочет выполнять php коды, да и скрипты, написанные на JavaScript, при сохранении записи или при смене режима редактора, превращает в «фарш».

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

Из данной статьи Вы узнаете, как создать шаблоны: для главной страницы и для статической страницы (page). Сразу скажу, что есть два способа создания шаблонов страниц:

Способ №1. Создается файл с произвольным названием и подключается к теме через админ-панель WordpRess.

Способ №2. Создается файл с названием, соответствующим иерархии шаблонов WordPress.

Теперь давайте разберем оба способа более подробно.Поехали!

Как создать шаблон страницы. Способ №1

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

Создаем новый файл с расширением .php. Лично я для создания и редактирования файлов использую редактор Notepad++, что и Вам советую.

Открываем редактор и во вкладке «Файл» выбираем пункт «Новый»:

Затем в той же вкладке «Файл» жмем на строчку «Сохранить как»:

Сохраняем файл в выбранную папку под произвольным названием.

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

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

Прежде всего файл надо пометить. Для этого в самое начало вставляем следующий код:

<?php
/*
Template Name: mayak-home
*/
?>

Тем самым мы укажем WordPress, что файл с названием mayak-home надо считать шаблоном (у Вас конечно может быть другое название).

Далее нам необходимо сформировать страницу в соответствии с дизайном Вашего сайта. Процесс очень схожий с созданием страницы с ошибкой 404.

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

Вот пример:

<!--Выводим шапку-->
<?php get_header(); ?>

<!--Индивидуальные стили шаблона. У Вас они скорее всего отличаются-->
<div id="content">
<div id="postarea">
<div class="homepage_post">
<div class="homepage_in">
<div class="post">

<!--Заголовок страницы-->
<h2>Здесь должен быть заголовок</h2>

<!--Какой-то текст-->
<p>Здесь может быть текст, но это не обязательно</p>

<!--Код вывода миниатюр на главной-->
<div class="katalog">
<ul><?php query_posts('showposts=20'); ?> <!--Цифра 20 - количество миниатюр-->
<?php while (have_posts()) : the_post(); ?>
<li>
<a href="<?php the_permalink() ?>"><?php the_post_thumbnail('thumbnail'); ?></a>
<a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a>
</li>
<?php endwhile; ?>
</ul>
</div>
<!--Конец кода вывода миниатюр-->

</div>
</div>
</div>
</div>

<!--Код вывода сайдбара-->
<?php get_sidebar(); ?>
</div>
<!--Конец индивидуальных стилей-->

<!--Код вывода подвала-->
<?php get_footer(); ?>

Конечно варианты наполнения могут быть разные. Идем дальше.

Как подключить шаблон страницы через админ-панель WordPress

Итак, шаблон страницы мы создали, теперь надо его подключить. Для этого с помощью FTP клиента закидываем созданный файл в корень темы, туда, где находятся файлы header.php, single.php, footer.php и т.д.

Далее идем в админку WordPress, Страницы -> Добавить новую и с правой стороны, в блоке «Атрибуты страницы», в пункте «Шаблон» выбираем название созданного файла:

Далее заполняем поле «Заголовок страницы». Если мы делаем главную страницу, то заголовок можно сделать такой:

Жмем кнопку «Опубликовать» и смотрим что получилось. А получится следующее:

У нас теперь две главных страницы, но это не беда, сейчас мы это дело поправим.

Снова идем в админку и следуем Настройки -> Чтение. На открывшейся странице, в пункте «На главной странице отображать» ставим галочку возле строчки «Статическую страницу»:

И ниже, в пункте «Главная страница», выбираем название «Главная»:

Сохраняем изменения и вуаля, у нас новая главная страница.

Создание шаблона страницы. Способ №2

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

Известно, что в большинстве шаблонов за вывод главной страницы отвечает файл index.php, а за вывод статических страниц — файл pade.php.

Но не все знают, что у файла index.php есть «старший брат» — файл home.php, который в «глазах» WordPress имеет белее высокий приоритет. Т.е, если в шаблоне будут находится оба вышеперечисленных файла, то WorsPress отдаст право выводить главную страницу именно файлу home.php. Вот такие дела.

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

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

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

В админке WordPress создаем новую страницу, вписываем заголовок и если у нас настроены ссылки ЧПУ, то в поле «Постоянная ссылка», URL страницы будет выглядеть так:

Далее, в корне темы создаем файл с таким названием:

page-katalog-tovarov.php

Наполняем файл, подобно файлу page.php, но уже с нужными нам стилями и функционалом. Далее идем в админку и опубликовываем пустую страницу.

WordPress будет считать шаблоном данной страницы именно файл page-katalog-tovarov.php, а все остальные страницы будут как прежде выводится файлом page.php. Надеюсь понятно, но это еще не все.

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

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

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

page-3201.php

Понятно, что ID остается неизменным при смене URL адреса страница, поэтому такой способ создания шаблона считается более безопасным.

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

Вот такую иерархическая цепочку файлов-шаблонов предусмотрели разработчики CMS WordPres. По-моему гениально!

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

На этом все. Как вам статья?

До встречи!

C уважением, Виталий Кириллов

« Шаблоны для категорий WordPress. Как сделать каталог из рубрики
« Индивидуальные шаблоны записей