Добрый день всем на wmbn.ru! Продолжаем говорить о шаблонах для WordPress и в сегодняшней записи речь пойдет о структуре шаблонов и файлов, которые входят в любую тему. Также рассмотрим установку шаблона на WordPress и постараемся разобрать принцип действия шаблона, так как все они имеют почти идентичную структуру и код. Зная структуру темы, его принцип действия и способы установки можно решить многие проблемы, в частности редактирования кода (установку социальных кнопок от ВКонтакте и Facebook, Google+, виджетов от Twitter).

Структура шаблона на WordPress

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

Способы установки готового шаблона от WordPress

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

Установка шаблона на блог WordPress

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

Кстати можно уже выбрать готовые из пункта Избранное, Свежие или Недавно обновленные шаблоны (нашел стартовую тему для WordPress, которая работает аналогично принципу структур тем для Drupal, однако это лишь макет, структура, которую можно изменить на HTML 5 и CSS 3, при этом не теряя стандартного функционала, а добавляя в структуру шаблона WordPress новые элементы).

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

Второй способ установки — загрузка файла темы на хостинг через FTP программу или файловый менеджер в панели управления хостингом. Рассмотрим первый — для этого подключитесь к серверу через клиент, к примеру Filezilla или другой аналог, и создайте в нем папку tmp или temp (обычно так обозначаются папки, в которых хранятся временные файлы, которые потребуются один или несколько раз, но никак не на всем протяжении ведения блога).

После этого загрузите туда архив с темой и распакуйте его туда. Причина такого подхода — пусть и временное, но резервное хранилище ваших загруженных файлов и папок. Затем скопируйте распакованную папку в каталог wp-content/themes. Далее на странице выбора тем появится загруженная, которую потом надо активировать. Через файловый менеджер делается все аналогичным способом — создание папки, загрузка архива, распаковка и копирование папки в каталог wp-content/themes.

Структура шаблона WordPress и принцип работы

Приступим к изучению структуры шаблонов для WordPress — все файлы вы можете найти на странице Редактора в меню Внешний вид. Всего в моем шаблоне основных файлов 14, которые отвечают за функции темы и структуру. Файлов, которые отвечают за вид и структуру темы 12 — это файлы archive.php (отвечает за вывод записей по времени), sidebar.php (боковая колонка блога), header.php (файл, показывающий шапку блога), comments.php (отвечает за структуру комментариев блога), single.php (файл, отвечающий за показ страницы записи).

Структура шаблона на WordPress

Index.php (собирает все файлы в одну страницу и является главной страницей любого сайта), footer.php (подвал сайта — обычно размещают менее важную информацию, типа счетчиков и логотипов), search.php (формирует результаты на страницу сайта), searchform.php (стандартная форма поиска сайта), functions.php (в данном файле прописаны все функции установленного шаблона, хотя он не отвечает за структуру, но без него сайт правильно функционировать не будет), 404.php (файл для показа страницы ошибки 404), page.php (единый стиль для страниц сайта) и последний archives.php (шаблон для станицы с архивами).

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

<?php get_header(); ?>
<div id="content" class="narrowcolumn"></div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Иногда можно встретить такой код файла index.php, что в нем может отсутствовать подключение сайдбара. Теперь про контент — он загружается в файл не с помощью функции get, а просто вставляется блок div, который уже имеет свой стиль CSS. Внутри него строится условие на проверку наличия записей, а затем повторения записей (разных) до тех пор, пока не загрузятся все посты, количество которых указано в настройках WordPress, вывод категорий, к которым принадлежит запись, количество комментариев и ссылка Читать полностью.

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

<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php if ( function_exists('the_title_attribute')) the_title_attribute(); else the_title(); ?>"><?php the_title(); ?></a></h2>
<h3>
Категория : <span class="post_cats"><?php the_category(', ') ?></span>
</h3>
</div>
<h4><?php comments_number('0', '1', '%'); ?></h4>
</div>

В первой строке загружается заголовок статьи, заключенный в тегах h2, который задает для заголовка свою ссылку на страницу в формате адрес сайта/категория/запись. Каким будет выглядеть заголовок зависит от настроек WordPress, когда вы настраивали вид ссылок для страниц сайта. Ниже представлена категория, которая заключена уже в теге h3 — естественно сначала представлена главная категория, а затем дочерняя. После того, как загрузятся заголовок и категория (подкатегория), будет показано количество комментариев, для которого можно задать свой стиль, так как количество (номер) заключено в блок div.

Ниже представлен код плагина WP-PageNavi, который установлен на блоге. Код загрузки плагина заключен внутри блока div, следовательно, можно задать свой стиль для навигации. Затем проверка поиска файлов через форму и загрузка подвала. Хочу заметить, что загрузить свой шаблон какой либо страницы с помощью функции get не получится, так как WordPress не знает функцию, допустим get_footer2() — она не забита в базе. Изучив проблему нашлось два выхода — загрузка с помощью include и include.templatepath:

<?php include (footer2.php); ?>
<?php include (Templatepath."/footer2.php"); ?>

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

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

Комментариев: 5

  1. alimugik

    Ну вот, нормально объяснил че куда)) а то некоторым говоришь в сайдбаре поправь, а тебе вопрос — «А че такое сайдбар?»)))

  2. West Blogger

    Как же некоторые дельцы ухищряются, чтобы заныкать во фришаблон ссылку и сделать так чтобы ее не удалили :) Очень часто такие шаблоны к сожалению попадаются.

    1. writer

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

  3. Юрий

    Вадим!
    Подскажи.как открыть для редактирования главный файл wordpress index.html ведь в структуре и редакторе все файлы с расширением php?

    1. writer

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

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Можно использовать следующие HTML-теги и атрибуты: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>