Создайте Ваш собственный шаблон для WordPress

августа 14, 2008 | Комментарии | Блоггинг, Переводы статей

Источник: Create Your Own Template.
Перевод: TimeBlogger.

Создание своего собственного шаблона для WordPress не столь сложно, как Вы можете думать. Многие предлагают использовать стандартный шаблон и уже в нем вносить изменения. Лично я с этим не согласна. Если вы неплохо разбираетесь в написании страниц и имеете представление о HTML и CSS, то тогда все, что вам необходимо знать – это теги шаблона и цикл WordPress.
Единственный файл для темы, который я порекомендовала бы вам скопировать, это файл comments.php из классической темы (WP Classic Theme), а не дефолтной (WP Deafult Theme).

Дизайн и Разметка.

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

Страницы, Категории, Архивы и Ссылки выводятся по умолчанию как неупорядоченные списки. В принципе, вы можете изменить это, но хорошим решением будет оставить их в виде списков.
Хотя и не обязательно, но, как правило, рекомендуется использовать тег DIV для каждого поста.
Ваше поле ввода текста для поиска должно иметь атрибуты Name и ID как ’s’ (аббр. от “search”), какой бы метод Get или Post вы не использовали.

Разбейте на части.

Вы можете разбить свою новую страницу, как минимум, на три-четыре секции. У вас имеется Header, содержащий стандартный верхний контент, показываемый на каждой странице, Footer – стандартный нижний контент на каждой странице, Сайдбар (SideBar – боковое меню), если что-либо не поместилось в Header и Footer, и главная индексная страница, которая содержит все, что не вошло в остальные блоки. Каждый из этих файлов должен иметь соответствующие названия – header.php, footer.php, sidebar.php и index.php.

Index.Php

В вашем файле index.php вам необходимо включить следующие теги внутри php тегов:
get_header()
Поместите данный тег там, где вы убрали раздел header (заголовок);
get_footer()
Поместите данный тег там, где вы убрали раздел footer (нижняя часть страницы);
get_sidebar()
Если необходимо, то поместите вызов данной функции там, где находилось боковое меню.

Это позволит установить ваши Header, Footer и Sidebar в соответствующие части страницы.
Для вашего поста мы должны добавить код цикла. Сразу перед началом поста (внутри тега div, который окружает пост) следует вставить следующий код:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

Ниже, где заканчивается разметка вашего поста, разместите следующий код завершения цикла:

<?php endwhile; endif; ?>

Далее вам понадобятся следующие команды для построения динамических постов:

the_permalink() – возвращает конкретную постоянную ссылку на пост, использующую для связи его заголовок;

the_title() – возвращает заголовок поста;

the_category(’,’) – команда создает разделенный запятыми список всех категорий, в которые был добавлен данный пост.

the_content() – используйте эту команду или же the_excerpt() для отображения содержания поста.

comments_popup_link(’No Comments’, ‘1 Comment’, ‘% Comments’) – отображает количество комментариев, полученных на данном посте. Вы можете изменить содержание параметров согласно требованиям вашего сайта, но сохраняйте порядок их расположения и используйте знак процента, чтобы получить X комментариев.

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

the_ID()
Возвращает идентификатор ID данного поста
the_date()
Возвращает дату создания поста
the_time()
Возвращает время создания поста
the_author()
Возвращает имя автора поста (обычно ссылается на страницу с его профилем)

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

<?php comments_template(); ?>

Это будет загружать содержание файла comments.php, о котором рассказывалось ранее. Я рекомендую вам просто скопировать данный файл с темы Classic, а на то, как его редактировать, мы взглянем позже.

Задайте описание вашей темы.

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

/*
Theme Name: Название Вашей темы
Theme URI: Адрес темы в Интернете
Description: Короткое описание
Version: Версия 1.0 или 1.1 и т.д.
Author: Ваше имя
*/

Эта информация считывается WordPress и, когда вы загрузите вашу новую тему (в его собственный каталог в директории wp-content/themes) и войдете затем в Панель администрирования – Дизайн, вы увидите в списке вашу тему. Если хотите также увидеть уменьшенное изображение созданной темы, то вы можете создать скриншот темы и добавить его в каталог с темой и назвать screenshot.png или screenshot.jpg. После этого WordPress автоматически отобразит его как картинку вашей темы.

Popularity: 20% [?]