Блог Дмитрия Худякова
Энциклопедия начинающих блоггеров

Как правильно редактировать шаблон WordPress блога?

Товарищи, всем привет! Проект «zametkibloggera.ru» и автор данного ресурса – Дмитрий Худяков приветствуем вас! Я рад, что вы в очередной раз заглянули ко мне! Как настроение, друзья?

Коллеги, не так давно, в одной из предыдущих статей, говорили мы о том, как установить тему, или другими словами шаблон на WordPress блог. Помните? Отлично!

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

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

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

Друзья, редактирование шаблона WordPress требует от нас знаний в области html и css, хотя бы самых минимальных. Но если вдруг вы ими не обладаете, то ничего страшного, те или иные команды вы можете найти в интернете.

В общем, так, друзья, давайте переходить к самой сути вопроса.

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

И для этого нам не потребуется ни одной посторонней программы. Давайте с этого и начнем.

Друзья, смотрите, ниже приведена схема расположения основных элементов нашей с вами темы.

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

Смотрите, друзья, если мы с вами, к примеру, хотим поменять какой-то элемент в основной, то есть самой верхней картинке темы, то в данном случае мы с вами для редактирования открываем файл «header.php».

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

Когда вы его откроете, то увидите код, где каждая строка отвечает за вывод того или иного элемента. Но, не зная, что здесь к чему, в коде лучше ничего не менять, чтобы не сделать только хуже.

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

Ниже у нас с вами идет основной блок, в котором собрано сразу несколько файлов, этот блок отвечает за вывод статей и содержит такие файлы как:

  • «Single.php» — этот элемент отвечает за вывод каждой отдельной записи на нашем проекте
  • «Index.php» — отвечает за вывод главной страницы – основной файл шаблона

И если его не будет, то наша тема просто не сможет работать.

  • Файл «page.php» — вывод страниц блога, которые располагаются в основном меню проекта
  • «Search.php» — отвечает за поиск по блогу, он же выводит и его результаты
  • Файл «archive.php» — файл ответственный за архивы публикаций на нашем ресурсе

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

Рядом с этим блоком, справа, в нашем случае, располагается блок под названием «sidebar.php».

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

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

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

И в самом низу шаблона располагается файл «footer.php» или другими словами – подвал нашего блога.

Но, друзья, помимо описанных выше файлов, есть и другие, назовем их вспомогательными.

Это такие файлы как: «funtcion.php», «style.css» — в данном элементе прописываются все стили оформления на нашем проекте, шрифты, цвета и так далее.

Файл «category.php» — ответственен за вывод категорий блога, «404.php» — как вы, друзья, наверняка уже знаете, 404-ая ошибка – ошибка поиска страницы, именно за нее то и отвечает данный файл. Файл «comments.php» — ответ несет за комментарии.

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

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

Редактирование шаблона

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

  • Первый вариант – через админку Вордпресс

Заходим в консоль и в главном меню нашей темы идем во вкладку «Внешний вид» — «Редактор». Перед нами откроется тот самый редактор темы, где мы можем менять каждый из файлов, описанных выше, по отдельности.

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

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

  • Вариант второй – редактирование файла напрямую

Лично я считаю данный способ более удобным, видимо дело привычки. Для того чтобы найти тот или иной файл, нам с вами необходимо зайти в корень нашего блога, выбрать папку «wp-conetnt», далее папку «thems» и в ней папку с названием нашей темы.

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

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

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

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

Друзья, стоит упомянуть и такую вещь — в некоторых случаях основной файл темы «index.php» носит название «home.php», он же, как вы помните, соединяет воедино все файлы шаблона и способствует их правильному отображению.

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

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

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

К примеру, как вариант, отобразить на ней список рубрик блога. Не знаете, как это сделать? Создайте отдельный проект на фрилансе и найдите толкового верстака, который на заказ и реализует вам данную функцию.

Кстати, для удобства поиска того или иного элемента в нашем шаблоне, при его редактировании, в браузере Google Chrome можно нажать клавишу «F12» и перед глазами отобразится небольшая консоль.

При клике на тот или иной элемент на сайте, браузер в этом окне покажет нам и параметры выбранного объекта.

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

Очень удобно, скажу я вам, и не нужно никаких дополнительных плагинов.

Либо же можно щелкнуть на элементе, который необходимо найти, правой кнопкой мыши и выбрать строку «Посмотреть код». При этом вы так же увидите все параметры элемента.

Запомните, коллеги, каждая тема уникальна и нет единого правила ее редактирования, к каждой из них нужно подходить индивидуально.

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

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

Оставайтесь в курсе! А если вам все же не терпится приступить к редактированию, можете поискать в интернете видео уроки.

Кстати, помимо данного материала, так же рекомендую вам к прочтению, друзья, статью о проверке собственного сайта на ошибки. Эта статья, вне всякого сомнения, дополнит ваши знания о движке Вордпресс.

Рекомендую

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

Лично меня, перспектива заработка в сети в последнее время очень сильно интересует, и я задал себе вопрос – «А как людям, не имеющих ни собственных сайтов, ни собственных блогов заработать в сети?». Все как оказалось, до банальности просто.

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

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

Все подробности об этой школе-университете можно узнать вот отсюда.

Немного о себе

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

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

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

И первый же поворот ознаменовался таким грохотом, это ужас. Борт у газели отвалился и все доски высыпались на землю.

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


На этом все, коллеги, и опять я говорю вам до свидания и до новых встреч! Помните про поля для комментариев расположенные ниже, и про то, что у проекта есть собственная рассылка, подписаться на которую можно совершенно бесплатно.

А так же делитесь материалом в сетях социальных со своими близкими друзьями, буду вам очень признателен!

Берегите себя, коллеги! До встречи!

С уважением Дмитрий Худяков!

1 звезда2 звезды3 звезды4 звезды5 звезд (Нет голосов)
Загрузка...
Этот блог читают 4 578 человек, присоединяйся и ты
Комментариев 3
  • RonnieGrews

    Жалко, что 2 года назад я это не прочитал :O (

    30.05.2016 | 23:32
  • Хуторная

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

    30.05.2016 | 23:32
    • Дмитрий

      Да, все правильно, но перед тем как что-то меняете в файлах, лучше их исходники сохранять!

      30.05.2016 | 23:32
Оставить коментарий
:p :-p 8) 8-) :lol: =( :( :-( :8 ;) ;-) :(( :o: