Общие сведения. Лабораторная работа №3.

Лабораторная работа №3.

Редактирование темы (шаблона) WordPress

Общие сведения

Тема для WordPress сайта состоит из файлов на языке php и папок, в том числе папки. images, в которой хранятся картинки темы, из которых строится ее дизайн. Еще есть файл стилей css style.
Файлов php в теме для WordPress может быть разное количество с разными названиями. Все зависит от создателя темы. Но тех, без которых тема не будет работать, совсем немного. А типичный комплект файлов может быть таким:

index.php
home.php
page.php
header.php
sidebar.php
footer.php
comments.php
archives.php
404.php

Или вот таким:

index.php
single.php
page.php
header.php
sidebar.php
footer.php
comments.php
archives.php
404.php

Комплекты отличаются тем, что в первом есть файл home.php, а во втором его заменяет файл single.php.

Чтобы знать, как это все влияет на работу темы для WordPress сайта, нужно знать так называемую иерархию шаблонов WordPress. Если кто-то хочет изучить эту тему более подробно, то это можно сделать вот по этому адресу — WordPress Codex

Если коротко и просто, то в соответствии с иерархией шаблонов WordPress каждый из php-файлов - это шаблон. То есть, например, файл index.php – шаблон. Поэтому, чтобы не запутаться с этой иерархией, мы называем скачанный Вами из Интернета шаблон– тема.

Индексная страница (первая, главная страница сайта) может быть index.html, если сайт статический или index.php, если сайт динамический и создан на движке.

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

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

Аналогично действует иерархия шаблонов WordPress и для второго варианта с файлом single.php. Если движок не находит шаблон home.php, то он будет применять шаблон index.php как для отображения главной страницы сайта, так и внутренних страниц. А для отображения одиночной записи движок будет искать шаблон single.php. И если не найдет - выдаст шаблон index.php. Что может быть использовано аналогично первому варианту для создания различного отображения и содержания главной и внутренних страниц сайта.

Ну и наконец, если поставить перед собой цель создать самый простой сайт на WordPress, то типичный комплект шаблонов WordPress темы такого сайта может быть таким:

index.php
header.php
sidebar.php
footer.php
comments.php

Это все, что нужно для создания работоспособной темы для WordPress сайта.

В составе каждой темы есть папка под названием images.

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

Открываем графический файл header в Photoshop и редактируем его по своему вкусу. После чего сохраняем его в своей папке images, естественно с заменой установленного ранее файла.

Если Вы хотите полностью заменить файл header на свой, то и это не проблема. Только свой файл создавайте такого же размера, как и заменяемый. Определить его размер тоже просто. Откройте файл в Photoshop. Откройте меню Изображение – Размер изображения.

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

Точно так же и с остальными элементами графики. Меняете или редактируете графику и сразу видите, что получилось. Не нравится — переделали. Единственное, что обязательно нужно будет сделать перед тем, как редактировать шаблон WordPress, это скопировать и сохранить папку images. После этого Вы сможете не только вернуть какой-то из элементов дизайна сайта, но и полностью восстановить его начальный дизайн, если что-то не получится, и Вы захотите начать все с начала.

WordPress можно расширить за счет плагинов — это различные php-скрипты, которые автоматически подключаются к основному «ядру». Таким образом можно не просто добавить нужную функциональность, но и изменить уже существующую. Создать плагин не очень сложно, все зависит от уровня знания PHP.

WP DB Backup - полезный плагин в плане безопасности, он автоматически делает бэкап вашей базы данных. После его установки и активизации заходим в АП Инструменты – Архивация БД, вы можете либо сделать копию базы данных сразу или настроить автоматический бэкап базы. В обоих случаях выделяйте все таблицы для копирования, по умолчанию плагин копирует только таблицы самого движка, игнорируя остальное. Вручную у вас есть 3 варианта на выбор: сохранить базу в папке на сервере, скачать базу на компьютер или отправить базу на email. При автоматическом резервном копировании выбор один - отправить базу на email.

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

Слайдер (галерея) привлекает посетителей, они просматривают не одну, а несколько страниц сайта. Это способствует продвижению сайта.

Ход работы

1. Отредактировать тему своего блога, изменив по своему усмотрению хедер и заменив имеющийся футер. Например, можно поменять цветовую гамму, добавить логотип или сведения об авторе и пр. Предварительно сохранить копию папки images вашей темы в другом месте!

2. Установите плагин, позволяющий делать копию вашей БД, разберитесь с его настройками, выполните копирование БД вручную. Задайте, если это возможно, автоматическое обновление копии БД еженедельно, в определенный день недели. Опробуйте работу плагина и убедитесь, что копия БД получена.

3. Каждый плагин устанавливайте в одноименную папку.

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

5. Создайте карту сайта для блога.

5.1. Сначала скачаем плагин, который будет нам генерировать карту сайта самостоятельно. Называется он Dagon Design Sitemap Generator, скачать его можно здесь.
Плагин скачали, поместили в папку " плагины", активировали.

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

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

5.3. Теперь идем в настройки плагина, вкладка "параметры", выбираем плагин DDSitemapGen.
Для удобства выбираем русский язык, внизу сохраняем настройки. После опять заходим в DDSitemapGen, теперь тут все на русском языке, начинаем настраивать.

5.4. Во - первых, нужно указать ссылку на страницу " карта сайта".

Она отображается в строке адреса вашего блога:

Эту ссылку копируем и вставляем в настройки плагина. Сохраняем настройки - и на вашей странице появилась прекрасная и информативная карта сайта. Она будет полезна не только посетителям и поисковикам, но и вам тоже, например, если в статье вы ссылаетесь на другую вашу статью («Об этом я писал здесь…»).

6. Некоторые темы для WordPress имеют встроенный слайдер, но не все. Установите специальный плагин для слайдера WordPress Content Slide.

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

6.2. По размеру картинок установить размеры слайдера в пикселях (самая первая строка настроек плагина)

6.3. Теперь нужно найти ссылки на картинки. В примере это можно увидеть в галерее при просмотре картинки в самом низу.

6.4. Если таким образом не получается, то нужно искать по названию картинки в HTML коде сайта. Открыть Ctrl + U, поиск Ctrl + F.

7. Осталось заполнить нижнюю часть плагина.

7.1. Первая ссылка – путь к картинке;

7.2. Вторая ссылка – ссылка на статью вашего сайта, которая будет открываться, если щелкнуть на картинке (в браузере в троке адреса можно взять, когда статья открыта).

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

9. Открываем редактор админ панели сайта. ВНИМАНИЕ! Входим именно в РЕДАКТОР! Ищем нужное место (например, сайтбар) и вставляем туда сразу после тега заголовка (<…header…> или <…sitebar…>) следующий код:

<?php if(function_exists(‘wp_content_slider’))

{ wp_content_slider(); }?>

10. Подробнее можно посмотреть здесь.

11. Сохраняем и переходим к просмотру: слайдер работает.

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

Дата добавления: 2015-07-07