WordPress шаблон главной страницы – Структура шаблонов темы WordPress, их иерархия и порядок работы движка с файлами страниц | Создание сайтов и заработок в сети

Leave a Comment / Шаблоны / By /

Содержание

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

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

Я вижу две основные причины, зачем нам это нужно:

  • Большинство настроек блога связано с редактированием кода – html или css. Во многих своих статьях я пишу о том, что нужно отредактировать определенный файл темы. Если вы не знаете, как искать эти файлы и какими средствами удобнее их править, эта статья для вас.
  • При создании блога вы установили на него тему (шаблон) из интернета и хотите что-то в ней изменить, добавить элементы дизайна или функциональные блоки. Но для этого обязательно обладать хотя бы минимальными знаниями HTML и CSS. Независимо, новичок вы или имеете опыт в создании сайтов, для редактирования шаблона WordPress вы должны понимать из чего он состоит и для чего нужна каждая его часть. Поэтому для начала рассмотрим структуру шаблона WordPress.

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

HTML-код шаблона WordPress разбит на несколько php-файлов. Сделано это для удобства: повторяющиеся на разных страницах куски кода вынесены в отдельные файлы и подключаются к каждой странице с помощью функции include. Шапка, футер и сайдбар находятся в отдельных файлах, а файл каждого типа страниц содержит только центральную область: структура шаблона вордпресс Наиболее часто редактируемые файлы шаблона WordPress:

  • index.php – Шаблон начинается с файла index.php, который выводит главную страницу сайта.
  • header.php —  Шапка сайта. В этот файл вынесена повторяющаяся на каждой странице сайта верхняя часть. Он начинается с тега <html>, содержит полностью <head></head>
    , в который вставляется большинство скриптов при настройке блога. В нем открывается тег <body> и выводится логотип, слоган, верхнее меню и прочие элементы шапки.
  • style.css – основной стилевой файл шаблона, в котором задается внешний вид элементов сайта. Чтобы редактировать шаблон WordPress, чаще всего приходится работать именно с этим файлом.

Остальные файлы:

  • single.php – отвечает за отображение каждой отдельной записи. Т.е. внешний вид страницы, на которой вы сейчас читаете мою статью, настраивается именно в этом файле.
  • page.php – вывод статической страницы блога. Новые страницы создаются в разделе «страницы» в левом меню, а их вид настраивается в этом файле.
  • sidebar.php – отвечает за вывод сайдбара (боковой колонки блога), где находятся виджеты. Эта часть шаблона тоже повторяется на каждой странице WordPress сайта, поэтому вынесена в отдельный файл. Обычно не приходится редактировать этот файл, потому что все изменения производятся над виджетами. Однако никто не запрещает вписать какой-то код напрямую в файл sidebar.php.
  • functions.php – файл с php-функциями темы. Все они влияют на внешний вид и работу сайта, определяют события при определенных действиях пользователей.
  • footer.php – футер (подвал) сайта, его нижняя часть. Это тоже повторяющийся на всех страницах  элемент. В него обычно вставляют счетчики посещаемости, копирайт и контактные данные.
  • category.php – за вывод страницы с перечнем всех записей определенной категории отвечает данный файл.
  • tag.php – вывод архива записей по соответствующему тегу прописан в этом файле.
  • archive.php – архив всех записей за определенный месяц (год) настраивается здесь.
  • search.php – выводит результаты поиска по блогу.
  • comments.php – отображение комментариев к записям и страницам.
  • 404.php – шаблон ошибки 404 – страница не найдена.

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

Как редактировать файлы шаблона WordPress

Сразу хочу предупредить, что не стоит лезть в код и пытаться самостоятельно его переделать, если вы ничего не понимаете в CSS и HTML. Другое дело, когда в каком-то уроке говорится вставить определенный код в определенное место файла. Обязательно сделайте бэкап файлов и базы данных, прежде чем вносить какие-то изменения! Для редактирования файлов темы WordPress сайта я предлагаю три варианта:

  1. Редактирование шаблона через админку WordPress
    В админке зайдите в раздел «Внешний вид» — «Редактор» и справа в колонке вы увидите все файлы темы, доступные для редактирования. Выберите нужный файл, отредактируйте и не забудьте кликнуть по кнопке «Обновить».adminkaДанный способ очень удобен, когда нужно внести незначительные изменения: редактирование через админку делается быстро, просто, не нужно запускать дополнительные программы и вводить пароли. Из минусов – стандартный редактор не имеет функции подсветки кода и нумерации строк, поэтому вносить серьезные многочисленные изменения таким образом не удобно.
  2. Правка файлов через файловый менеджер хостинга
    Как вы уже знаете, я пользуюсь одним из лучших хостингов — beget, у которого отличный файловый менеджер с дружелюбным интерфейсом. Мне нравится редактировать шаблоны WordPress этим способом, потому что опять же не нужно запускать никаких программ, настраивать подключений, копировать файлы на компьютер и код подсвечивается. beget менеджерФайлы шаблона WordPress, который вам нужно отредактировать, находятся в папке: /wp-content/themes/название_вашей_темы/ Зайдите в нее и откройте нужный файл для редактирования. Если ваш хостинг не обладает таким удобным файловым менеджером, советую выбрать другой хостинг:)
  3. Редактирование шаблона по ftp
    Этот способ удобен, если предстоит серьезная работа с файлами, особенно если нужно редактировать сразу несколько файлов в разных папках.
    • Запустите ваш ftp-клиент. Для подключения по ftp я использую программу FileZilla или Total Commander — по ссылке подробная инструкция настройки соединения. Настройте соединение с сайтом и зайдите в папку вашей вордпресс темы: /wp-content/themes/название_вашей_темы/
    • Скопируйте файл, который нужно редактировать к себе на локальный диск.
    • Откройте файл в программе для редактирования кода и внесите необходимые изменения. Я советую программы Notepad++ или Dreamweaver, в них подсвечивается код, пронумерованы строки и конечно есть множество других функций и преимуществ.

Настройка темы WordPress в админке

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

Зайдите в раздел «Внешний вид» — «Настроить», откроется окно с основными настройками темы. Здесь можно ввести название и описание сайта, которые отобразятся в шапке сайта после сохранения. Так же вы можете изменить цвет фона или фоновое изображение и другие настройки — разобраться не сложно. настройка темы wordpress   Большую часть настроек темы WordPress можно выполнить в разделе «Внешний вид» -> «Имя вашей темы». настройка темы wordpressЗдесь можно загрузить логотип, фавикон и т.д. Настроек очень много, но честно сказать, я ими никогда не пользуюсь, так как мне проще работать с кодом, чтобы редактировать тему WordPress.

Вот и все! Выбирайте удобный для себя способ для редактирования шаблона WordPress в зависимости от ситуации и никогда не забывайте делать бэкапы. Подписывайтесь на RSS, чтобы не пропустить новые полезные статьи.

P.S. Хочу напомнить вам, дорогие читатели, что если вы замечаете в моих статьях ошибки, не поленитесь нажать «Ctrl + Enter», чтобы с помощью системы Orhpus я их исправила.

Файлы шаблона WordPress — как легко ориентироваться в теме | History-of-Blog.ru

Статья которая РАЗОРВЕТ ваш блог на кусочки (а потом соберет его, возможно)

Статья посвящена файлам шаблона WordPress! Предупреждаю сразу – внимательно изучив данный материал Вы с легкостью будете ориентироваться в своем шаблоне и сможете практически моментально находить нужное место в нем. Мне кажется любой блоггер, который владеет ресурсом на WP, должен понимать из чего состоит его блог – а то получается: все работает, но что да как – без разницы!

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

Для начала предлагаю посмотреть из чего состоит Ваш шаблон. Для этого из административной панели перейдите по вкладкам: “Дизайн” → “Редактор”:

В правой колонке Вы увидите примерно следующую картину, в зависимости от установленной версии WordPress:

Здесь представлены все файлы Вашего шаблона WordPress – они имеют формат .php и в самом низу обязательно должен быть файл стилей style.css. Стоит заметить, что файл стилей может быть не один.

Не стоит пугаться их названий и неизвестностью. Открыли, посмотрели, закрыли. А после прочтения данного материала открыли снова и сравнили результат. Итак, давайте начнем по пунктам и с использованием живого примера!

Последовательность изучения файла шаблона обусловлена логическим строением любого блога.

Изображения приводится не будут, поэтому рекомендую пощелкать по ссылкам, чтобы наиболее полно представить картину.

1 файл: index.php – шаблон главной страницы.

За вывод главной страницы ответственен файл шаблона index.php. Именно в нем прописано все, что Вы видите на блоге вбивая его адрес в строку браузера!

2 файл: single.php – шаблон записей.

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

3 файлs: page.php – шаблон страниц.

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

4 файл: archive.php – шаблон архивов/рубрик.

По сути принцип работы страниц, созданных при помощи шаблона

archive.php такой же как и у главной страницы (index.php) – он выводит список записей, но отличие конечно есть: при помощи данного файла создаются страницы разделов, архивов или меток. Например: страница категории Инвестиции.

5 файл: style.css – файл стилей.

Этот файл находится в самом низу списка, а над ним стоит говорящая надпись: “Стили”. Именно файл style.css отвечает за все визуальное оформление блога – цвета, шрифты, месторасположение элементов относительно друг друга и так далее.

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

Ответ:

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

Любой блоггер наверное замечал, что некоторые элементы повторяются на всех страницах, это:

  • Шапка или Хэдер (header) – верхняя часть блога;
  • Подвал или Футер (footer) – нижняя часть блога;
  • Боковая колонка или Сайдбар (sidebar) – правая или левая колонка на блоге, а может быть и та и другая.

Что бы каждый раз не прописывать то, что должно находится в этих местах на блоге в файлах: index.php, single.php, page.php и archive.php было принято решения создать файлы шапки, подвала и боковой колонки и ссылаться на них.

6 файл: header.php – шаблон шапки.

В этом файле прописано то, что должно выводится в верхней части блога:

7 файл: footer.php – шаблон подвала.

В файле footer.php прописано то, что должно выводится в нижней части блога:

8 файл: sidebar.php – шаблон боковой колонки.

Файл sidebar.php как правило не задействуют при правке шаблона, так как в WordPress предусмотрено его редактирование через виджеты (которые подключены специальным файлом functions.php – о нем ниже). Когда я создавал тему я добавил поддержку виджетов, однако у меня сейчас не добавлен ни один из них, все таки кому как удобней – мне легче отредактировать файл sidebar.php и дописать непосредственно туда все, что требуется:

9 файл: comments.php – файл комментариев.

В этом файле прописан вывод комментариев. Поэтому в single.php после кода вывода статьи прописывается “ссылка” на этот файл, так же этот файл может быть вызван и на страницах – page.php. Часто встречается вариант, когда часть функционала комментариев прописывается в файле functions.php.

10 файл: functions.php – функции темы.

Пожалуй самый непонятный и “могущественный” файл в сборке любого шаблона WordPress. С его помощью можно сделать с блогом практически все, что угодно. Вот несколько примеров, что мы может сделать редактируя этот файл:

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

Многие разработчики уважают WP из-за этого файла. Еще бы – безграничные возможности всегда будут в цене Но будьте особенно внимательными редактируя файл functions.php, так как он связывает всю тему воедино и неправильно прописанный код может выдать страницу ошибки. Знайте, если блог вообще не загружается, то скорее всего проблема именно в файле functions.php.

Итак 10 файлов, необходимые для оптимального и полноценного функционирования шаблона WordPress:

  1. index.php;
  2. single.php;
  3. page.php;
  4. archives.php;
  5. style.css;
  6. header.php;
  7. footer.php;
  8. sidebar.php;
  9. comments.php;
  10. functions.php;

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

11 файл: 404.php – шаблон 404 ошибки.

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

12 файл: searchform.php – шаблон формы поиска.

Форма поиска может находится на сайте не в одном месте. Банальный пример – форма поиска в шапке и дублирующая форма на странице с результатами поиска, а может кто-нибудь еще и в сайдбар ее вставит. Поэтому чтобы не прописывать каждый раз длинный код этой формы и создается данный файл, а в том месте где ее нужно вывести ставится “ссылка” на него.

13 файл: search.php – шаблон результатов поиска.

Принцип работы этой страницы такой же как и файла index.php или archives.php, только список статей должен соответствовать введенному поисковому запросу.

Я не использую в данном шаблоне 12 и 13 файлы, так как у меня реализован поиск от Яндекса. 12 файл мне ни к чему – в шапку вставлен “прямой код”, а 13 файл заменяет обычная страница (page.php) с кодом результатов поиска.

14 файл и 15 файл: loop.php и theloop.php – файлы циклов вывода статей.

Создавать эти файлы необязательно, однако мне удобней работать с ними, что бы не делать больше файлы index.php и archives.php. “Лупы” содержат алгоритм вывода списка статей по параметрам (последние записи на главной или записи из одной категории на “архивной” странице). Так же эти файлы у меня имеют разное оформление:

На главной есть миниатюра, дата, ссылка на раздел и комментарии, а так же кнопочка твитнуть (как сделать такую же кнопку в анонсах) и ссылка “читать далее”. На страницах рубрик – господствует минимализм

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

  1. header.php;
  2. loop.php;
  3. sidebar.php;
  4. footer.php.

Так же в шаблоне WordPress могут встречаться другие файлы, которые реализуют дополнительный функционал и удобство (весьма спорно как мне кажется). Порой встречаю шаблоны где файлов около 40 штук – вот тут то уже есть где запутаться

Чтобы укомплектовать все знания и запомнить наиболее распространенный вариант шаблона WordPress я создал вот такую картинку, в которой все собрал в одном месте. После прочтения данной статьи вопросов: что? откуда и куда? наверняка не останется, а графическая часть закрепит пройденный материал:

Похожие статьи:

Комментировать через ВКонтакте:

Шаблоны страниц в WordPress — WP Magazine

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

Что такое шаблоны страниц

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

Выбор шаблона страницы в WordPress

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

Шаблоны страниц можно использовать более чем для одной страницы, а некоторые темы создают вполне специфические шаблоны, предназначенные для использования всего один раз. Как например шаблон избранного содержимого в стандартной теме Twenty Eleven:

Шаблон избранного содержимого в Twenty Eleven

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

Как создать собственный шаблон страницы

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

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

Для простоты рекомендуем использовать префикс template-*.php и/или хранить все шаблоны страниц в субдиректории, например:

  • my-theme/templates/full-width.php
  • my-theme/templates/front-page.php
  • my-theme/templates/left-sidebar.php

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

<?php
/**
 * Template Name: My Custom Template Name
 */

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

После специального заголовка вы можете писать произвольный код PHP и HTML, который будет использоваться для вывода страниц с вашим шаблоном. Для соблюдения структуры сайта (заголовок, подвал, боковые колонки) за основу можно взять шаблон page.php вашей темы.

Для примеров советуем также просмотреть шаблоны contributors.php и full-width.php стандартной темы Twenty Fourteen, и front-page.php стандартной темы Twenty Twelve.

Дочерние темы

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

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

Когда не следует использовать шаблоны страниц

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

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

/* Спрятать боковую колонку на странице 123 */
body.page-id-123 #secondary {
    display: none;
}

Шаблоны страниц так же не следует использовать, чтобы изменить параметры основного цикла WordPress, например для добавления произвольного типа записей или исключения категории. Для таких целей есть специальный фильтр pre_get_posts в WP_Query().

Если у вас возникли вопросы по работе с шаблонами страниц в WordPress, мы будем рады ответить на них в комментариях.

Как редактировать шаблон wordpress самому? Десятка лучших

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

Для начала о том, зачем нужна настройка шаблона WordPress опытному веб-мастеру и новичку:

  • Практически все настройки блога завязаны на редактировании кода – чаще всего css или html. Во многих руководствах по ВордПрессу специалисты рассказывают, что для достижения результата нужно отредактировать файл темы. Если вы не совсем понимаете, о чем идет речь, как редактировать тему WordPress, самое время осваивать новый материал.
  • Создавая или редактируя блог, вы установили загруженный шаблон. Все бы хорошо, но он криво встал и нуждается в небольшой доработке. Как добавить или убрать функциональные блоки, новые элементы дизайна? Знаний CSS, HTML маловато или вообще нет – с чего начинать работу? Знакомство со структурой позволит понять, как работает сайт изнутри, какие функции выполняет каждый элемент.

Разбираем структуру по кирпичикам

Если изобразить HTML-код как один большой квадрат, шаблон можно разбить на несколько частей: шапку сайта, контентную область, сайдбар, футер.

Редактирование и настройка темы WordPress: ТОП-10 ШаблоновСтруктура

Часто приходится редактировать такие файлы:

  • index.php. Он позволяет вывести главную страничку.
  • header.php. Шапка сайта или его верхняя часть. Независимо от того, на какую именно страницу переходит посетитель сайта, шапка остается неизменной.
  • style.css. Стилевой элемент, используемый для настройки внешнего вида шаблона WordPress.

Мы назвали 3 элемента, которые редактируют чаще остальных. Кроме них, есть другие:

  • single.php – демонстрация записей.
  • page.php – статическая web-страница.
  • sidebar.php. Сайдбар с виджетами.
  • functions.php – php-функции.
  • footer.php. Он же подвал сайта, остается неизменным.
  • category.php. Отвечает за вывод страничек по конкретной категории.
  • tag.php. Вывод по тегу.
  • archive.php. Записи за год или месяц.
  • search.php. Поиск WordPress. Когда посетителю нужно найти конкретный материал, статью или файл, search.php в шаблоне помогает искать контент.
  • comments.php. Аудитория сайта может дискутировать между собой, оставлять комментарии и отзывы. Чтобы настроить отображение комментариев, используют файл php.
  • php. Еще один важный файл, отвечающий за ошибку 404.

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

Редактируем шаблон самостоятельно

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

Есть три варианта настройки темы или шаблона WordPress:

  1. Через админку.

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

Редактирование и настройка темы WordPress: ТОП-10 ШаблоновАдминка

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

  1. В файловом менеджере хостинга.

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

Редактирование и настройка темы WordPress: ТОП-10 ШаблоновХостинг

Как работает редактор тем WordPress? Вам нужно открыть папку по адресу /wp-content/темы/название_темы/файл. Если файлового менеджера нет, есть смысл задуматься о смене хостинга.

  1. Редактируем шаблон по

Когда намечается основательная работа с контентом, и нужно отредактировать сразу несколько файлов в папках, на помощь приходит третий вариант – ftp-клиент.

Достаточно выполнить три простых действия:

  • Запустить клиент, воспользоваться FileZilla, Total Commander. Установив соединение, нужно открыть папку темы ВордПресс по адресу: /wp-content/темы/название_темы/
  • Скопировать файл, внести изменения.
  • Открыть его в Dreamwaver, Notepad++, любой другой толковой программке, предназначенной для редактирования. Выбирайте ПО, с которым действительно удобно работать. Недостаточно просто загрузить тему в WordPress – нужно найти программку для редактирования с удобной подсветкой кода, нумерацией строк.

Как выглядит настройка в админке ВордПресса?

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

Редактирование и настройка темы WordPress: ТОП-10 ШаблоновХостинг
  1. Открываем раздел «Внешний вид», переходим в «Настроить».
  2. В открывшемся окошке прописываем название вашего сайта, делаем его краткое описание. Когда вы нажмете «Сохранить», эта информация отобразится в шапке сайта. Меняйте цвет фона, фоновое изображение – это и многое другое можно делать в настройках.
  3. Большинство изменений производятся в категориях «Внешний вид», «Имя темы», загружается фавикон, логотип. Опций действительно много, и для тех, кто не хочет (не умеет) работать с кодом, это просто находка.
Редактирование и настройка темы WordPress: ТОП-10 ШаблоновНастройки внешнего вида

ТОП-10 бесплатных шаблонов

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

Avada

Минималистичная, универсальная тема WordPress с регулярными обновлениями. Есть русификатор. Рекомендуем ее для создания, дальнейшего администрирования магазинов, инфосайтов.

  • Поддерживает адаптивный дизайн.
  • Имеет удобную панель.
  • Можно работать с Avada сразу же после ее установки. Дизайн чистый, можно менять оформление.

Nitro

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

Sydney

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

Allegiant

По словам разработчиков, великолепная тема для малого бизнеса. На главной страничке есть слайдер, поле отзывов, блок с новостями и пр.

Riba Lite

Как упростить ведение блога, сделать процесс увлекательнее и разнообразнее? Попробуйте установить тему Riba Lite! Это идеальный вариант для тех, кто практикует создание текстового контента в таких жанрах, как путешествия, красота и здоровье, стиль жизни. Доступен большой выбор цветовых схем, поддержка версий для всех мобильных платформ. За счет использования Retina Ready получаем отличную производительность.

ColorMag

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

eStore

Клевый WooCommerce макет, который идеально подходит для создания онлайн-магазина. Совместим с плагинами Wishlist.

Ascent

Зачетная тема, которая выглядит симпатично на любом десктопе и мобильном устройстве. Имеет простой и минималистичный дизайн, работает с технологиями CSS, HTML 5.

Onetone

Шаблон сайта-одностраничника Onetone стал настолько популярным, что его установили себе десятки тысяч веб-мастеров. Позволяет организовать ресурс любой тематики. Создан с использованием CSS3, HTML5.

Awaken

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

Заключение

На этом все – мы разобрали 3 основных способа редактирования тем WordPress и 10 лучших шаблонов для сайта. Выбирайте тот, который по душе и как раз соответствует вашей тематике. Желаем успехов!

Поделитесь со своими друзьями

Создание темы (шаблона) WordPress

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

Что такое тема?

Тема WordPress — это набор css, js, php файлов, которые в связке с WordPress и плагинами выводят информацию из базы данных на экран в красивом и удобном виде (дизайне). Ну или в некрасивом и неудобном, тут смотря какую тему выбрать… В других движка тему еще называют «шаблоном», но в WordPress принято говорить именно тема — theme, а не шаблон — template. Хотя и то и другое по сути одно и тоже…

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

Необходимые файлы

Чтобы создать тему необходимы лишь два файла:

  1. index.php — главный файл темы, отвечает за вывод содержимого
  2. style.css — главный файл стилей, отвечает за css стили

Но ни одна тема по факту не состоит всего из двух файлов. Их больше: PHP, языковые файлы, файл CSS и JS, текстовые файлы. Тему начинают с двух файлов, а затем, чтобы было удобнее, её расширяют, добавляя такие файлы как:

  • header.php — отвечает за вывод шапки
  • footer.php — отвечает за вывод подвала
  • sidebar.php — отвечает за вывод боковой панели
  • page.php — отвечает за вывод отдельной страницы (записи)
  • и т.д. смотрите полный список.

Возможности темы

Возможности темы по сути безграничны, ведь там можно полностью использовать PHP. НО! Тема, как призвана отображать содержимое сайта определенным образом, а не добавлять функционала сайту. Поэтому возможности темы принято ограничивать до тех, которые отвечают за внешний вид, а все остальные возможности: голосование, рейтинги, редиректы, СЕО и т.п. принято выносить в плагины…

Таким образом, тема может:

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

Как и на любом сайте, тема — это не только цветовое решение, макет и красивая картинка. По-настоящему качественные темы еще и очень функциональны. Функциональность темы, заключается в её гибкой настройке. Т.е. она не добавляет ничего нового на сайт, но отлично настраивается по вкусу владельца. Например: устанавливается фоновая картинка, меняется цвета элементов, настраивается меню и блоки с контентом (виджеты).

Чем тема отличается от плагина?

С точки зрения кода, можно сказать, ничем — в теме можно создать полноценный плагин. А вот с точки зрения логики — всем! Задача плагина, добавить что-то новое на сайт, например добавить опрос. Задача темы — вывод содержимого, в том числе, этого опроса…

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

Никогда не добавляйте функциональность в саму тему, если только на это нет веских причин. Если это сделать, то при смене темы функциональность потеряется в месте с ней. Например, в вашей теме есть крутая фотогалерея. И если поменять тему, то эта крутая фотогалерея потеряется…

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

Где скачивать темы?

Каталог тем на сайте WordPress.org. — одно из самых безопасных мест, где можно скачать темы. Там все темы проверяются на соответствие требованиям и рекомендациям.

Есть и другие источники, но там темы обычно платные. Например, темы можно скачать на: Creative Market.

Старт

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

  1. настроить локальную среду разработки.
  2. Затем можно посмотреть примеры WordPress-тем.
  3. Ну и начать разработку своей первой темы.

Этот раздел в процессе разработки… И вообще, я его начал писать и забросил, неинтересное занятие получается. Будет время, желание продолжу…

Шаблоны страниц и типов записей в WordPress

Страницы — это один из типов постов WP. По умолчанию все страницы выглядят одинаково, возможно вам и нужно, чтобы они выглядели одинаково (только с разным контентом разумеется), если же нет — читайте этот пост.

Средствами WordPress вы можете сделать страницы вашего сайта уникальными. Например создать страницу с картой, создать HTML-карту сайта, страницу с формой, лендинги и т.д. Всё это можно реализовать при помощи шаблонов страниц.

Установка шаблона для страницы

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

Для того, чтобы это проверить:

  1. Переходим в Страницы > Добавить новую.
  2. В метабоксе «Атрибуты страницы» выбираем один из шаблонов.
Выбираем шаблон страницы из выпадающего списка

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

Опции быстрого (Свойства, Quick Edit) и массового (Bulk Edit) редактирования также имеют возможность задавать шаблоны для страниц.

Задаем шаблон страницы в параметрах быстрого редактирования

Также важно отметить, что один шаблон может использоваться для нескольких страниц одновременно.

Создание собственного шаблона страницы

Для того, чтобы создать любой шаблон страниц, всегда нужно сделать два шага:

  1. В папке с темой создать какой-нибудь файл, так, чтобы его название не перекликалось с условными названиями файлов темы WordPress. Если не уверены, то придумайте такое название, которое кроме вас больше никому не прийдет в голову 🙂 например misha123.php.

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

  2. В начале вашего файла нужно обязательно указать название шаблона — после этого WordPress его «увидит»:
    <?php
/*
Template Name: Мой Супер-шаблон
*/
  3. Далее в шаблоне вы можете использовать абсолютно любой код, не хотите подключать get_header() и get_footer() сайта? — да пожалуйста, можете вообще просто один <iframe> туда засунуть и будет норм.

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

Иерархия и порядок подключения файлов страниц

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

Этот список показывает приоритет задействования файлов темы для отображения типа записей «Страницы».

  1. custom-template.php (если файл шаблона существует и выставлен для данной страницы в её настройках)
  2. page-{ярлык страницы}.php (если существует)
  3. page-{ID страницы}.php (если существует)
  4. page.php (наиболее распространённое решение практически во всех темах)
  5. index.php (используется, если все вышеперечисленные файлы отсутствуют в папке с темой)

Я уже писал про иерархию в одном из моих предыдущих постов.

Шаблоны страниц для записей произвольного типа

Эта потрясающая функция появилась в версии WordPress 4.7, мне нравится, как плавно и постепенно WordPress расширяет возможности, внедряя только то, что действительно необходимо 😊 🎉

Шаблон для типов постов (записи тоже сюда относятся) создаётся точно так же, как и для страниц, только помимо параметра Template name:, нам ещё на следующей строке нужно указать параметр Template post type:, в котором можно указать название типа поста, или несколько названий через запятую, например я захочу использовать свой шаблон и для записей и для страниц, в этом случае он будет начинаться так:

<?php
/*
 * Template name: Мой Супер-шаблон
 * Template post type: post, page
 */

Если у вас уже был какой-то шаблон для страниц и он уже использовался на сайте, то, после того, как вы добавите туда параметр Template post type: и укажите какой-то другой тип записей там, то уже существующие страницы, использующий этот шаблон не перестанут работать, однако при редактировании там уже будет указан Базовый шаблон.

А для соответствующего типа записи сразу появится такой блок, у меня для записей он появился под рубриками и называется Свойства записи:

Метабокс для выбора шаблона записи в админке

В меню быстрого редактирования он тоже появится.

Видеоурок по шаблонам страниц

Миша

В последние годы я долго не знал, что мне делать с сайтом misha.blog, ведь он практически не приносит никакого профита, но недавно я осознал, что моя миссия – способствовать распространению WordPress. Ведь WordPress – это лучший движок для разработки сайтов – как для тех, кто готов использовать заложенную структуру этой CMS, так и для тех, кто предпочитает headless решения.

Сам же я впервые познакомился с WordPress в 2009 году. Организатор WordCamp. Преподаватель в школах Epic Skills и LoftSchool.

Если вам нужна помощь с вашим сайтом или может даже разработка с нуля на WordPress / WooCommerce — пишите. Я и моя команда сделаем вам всё на лучшем уровне.

Настройка статической главной (начальной) страницы — Поддержка — WordPress.com

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

Содержание

Видео: как настроить статическую главную страницу
1: Создание главной страницы
2: Настройка статической главной страницы
3. Создание страницы «Блог» (необязательно)
4: Создание пользовательского меню
Дополнительные возможности настройки
Шаблоны главной страницы и ваша тема

Видео: как настроить статическую главную страницу

↑ Содержание ↑

1: Создание главной страницы
  1. Перейдите в Мой сайт → Сайт → Страницы.
    Добавить страницу
  2. Нажмите Добавить, а затем Новая страница.
  3. Оформите и опубликуйте новую страницу.
    Опубликовать страницу

Если у вас пока нет опубликованных страниц, опция «Настройки главной страницы», описанная в следующем шаге, будет вам недоступна.

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

↑ Содержание ↑

2: Настройка статической главной страницы
  1. Нажмите Мой сайт.
  2. Прокрутите вниз до раздела Дизайн и нажмите Настроить.
  3. Найдите опцию «Настройки домашней страницы»
  4. Выберите опцию Статическая страница, затем выберите только что созданную страницу из выпадающего меню Главная страница.

В окне предварительной настройки новая выбранная страница будет отображаться как начальная страница вашего сайта.

Нажмите кнопку Опубликовать для сохранения настроек главной страницы.

↑ Содержание ↑

3. Создайте страницу «Блог» (необязательно)

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

Помните: чтобы страница появилась в раскрывающемся меню страницы «Записи», она должна быть опубликована.

  1. Создайте страницу сайта. Эту страницу можно назвать «Блог» или иначе — на ваше усмотрение.
  2. В разделе Дизайн → Настроить → Настройки главной страницы выберите новую страницу блога в раскрывающемся меню Страница записей.
  3. Опубликуйте изменения.

↑ Содержание ↑

4: Создание пользовательского меню

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

В этом случае можно создать для сайта пользовательское меню. Для этого следуйте инструкциям в нашем руководстве «Пользовательские меню».

↑ Содержание ↑

Дополнительные возможности настройки

Многие элементы статической страницы можно изменить с помощью пользовательских CSS. Расширенные возможности пользовательской настройки тем, в том числе CSS, доступны в тарифных планах не ниже WordPress.com Premium.

↑ Содержание ↑

Шаблоны главной страницы и ваша тема

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

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

Лучший способ узнать, как формируется главная страница темы, — изучить инструкции вразделе «Информация» соответствующей темы в каталоге тем.

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

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