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

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

4 шага для редактирование шаблона WordPress

  1. Файлы шаблона WordPress
  2. Расстановка WordPress тегов h1, h2, h3, div,p
  3. Как убрать ссылки WordPress
  4. Перевод шаблона
  5. Редактируем заголовки в сайдбаре

1. Файлы шаблона WordPress

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

  • Header.php – Этот файл отвечают за верхнюю часть блога(шапку) в нём как раз сменим логотип и настроим код название сайта.
  • Sidebar.php – Этот файл отвечает за вывод рубрик, меток, свежих записей, виджетов и тому подобное.
  • Index.php – Этот файл отвечает за главную страницу блога.
  • Single.php – В этом файле выводятся информация всех записей. блога.
  • Archive.php – Выводит архив на блоге.
  • Search.php – Поиск страниц по вашему сайту.
  • 404.php – редирект, если страница, на которую пытались перейти не найдена, то переводит на отдельную страницу вашего сайта.
  • Page.php – Показывает информацию статистических страниц сайта.
  • Footer.php – подвал вашей темы, нижняя часть. Там чаще всего ненужные ссылки, которые надо либо удалить, либо закрыть от индексации.
  • Style.css – Файл отвечающий за стиль вашей темы. То как она выглядит.

Вот как эти файлы расположены, если посмотреть на стандартную тему WP. Расположение файлов темы wordpress

2. Расстановка wordpress тегов h1, h2, h3, div,p

В этом шаге придётся полазить в кодах для расстановки wordpress тегов. Вы не переживайте, с этим сможет справиться каждый. И займёт это не более 5 минут. И не стоит пропускать этот пункт, ведь он один из важнейших в редактирование шаблона WordPress.

1. Редактирование заголовка шаблона WordPress.

В стандартных шаблонах wordpress, заголовок блога в тегах h1 или h2 для блога это не правильно. Потому что человек ищет решение проблемы, а не сайт. Поэтому дорабатываем тему. При этом делаем так, что бы главная страница осталась под тегом h1. А на остальных не дублировалось. Заходим в панель администратора > внешний вид > редактор> header.php редактирование темы wordpress Находим код заключённый в тег h1, скорее всего вы найдёте что-то типо этого

[php]<h1><a href="<?php bloginfo (‘url’); ?>"><?php bloginfo (‘info’); ?></a></h1>[/php]

Теперь нам следует заменить, копируйте код который ниже и замените всю строчку начиная от <h1> до </h1> вот на это

[php]&amp;lt;?php if (is_home ()){ ?&amp;gt;&lt;br /&gt;&amp;lt;h1&amp;gt;&amp;lt;?php bloginfo (‘info’); ?&amp;gt;&amp;lt;/h1&amp;gt;&lt;br /&gt;&lt;br /&gt;&amp;lt;?php } else {?&amp;gt;&lt;br /&gt;&lt;br /&gt;&amp;lt;p&amp;gt;&amp;lt;a href=&quot;&amp;lt;?php bloginfo (‘url’); ?&amp;gt;&quot;&amp;gt;&amp;lt;?php bloginfo (‘info’); ?&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/p&amp;gt;&lt;br /&gt;&lt;br /&gt;&amp;lt;?php } ?&amp;gt;&amp;lt;span style=&quot;font-size: 13px; line-height: 19px;&quot;&amp;gt;[/php]

После этого найдите файл style.css (стили) он находится всё в той же панели где вы нашли header.php. В style.css нужно найти стили, которые прописаны для контейнера. Выглядеть будет на подобие этогоЗаголовок блога Теперь вы должны изменить несколько h1 на pредактирование заголовка и добавляем в #header-title p в конце строчку margin:0; Выглядит это такВыравнивание заголовка Теперь можете порадоваться, у вас правильный заголовок блога, поздравляю!

2. Редактирование заголовка статей

Процедура редактирования заголовка статей будет чем-то похоже на редактирование заголовка блога. Обычно в скаченных темах, в статьях стоит заголовок в теге h2 и ещё одна ошибка это то, что заголовок даёт ссылку на себя, что является не правильным! Надо найти файл single.php, он находится в той же панели, где вы нашли header.php и style.css Заходим и ищем тег h2 Примерно такой

[php]&amp;lt;h2&amp;gt;&amp;lt;a href=&quot;&amp;lt;?php the_permalink() ?&amp;gt;&quot; rel=&quot;bookmark&quot; title=&quot;Permanent Link to &amp;lt;?php the_title_attribute(); ?&amp;gt;&quot;&amp;gt;&amp;lt;?php the_title(); ?&amp;gt;&amp;lt;/a&amp;gt;&amp;lt;/h2&amp;gt;[/php]

Заменяем его на

[php]&amp;lt;h1&amp;gt;&amp;lt;?php the_title(); ?&amp;gt;&amp;lt;/h1&amp;gt;[/php]

Теперь надо зайти в файл style.css и найти стиль должен быть похож на этоСтили заголовка статей Меняем выделенное с h2 на h1 и сохраняем. Теперь у вас правильные заголовки статей, что даёт большой плюс! Можно так же сделать оптимизацию в сайдбаре, если будет интересно, то допишу это в статье! Плюсом будет, что у вас уберутся из сайдбара теги h2,h3 тем самым уберутся лишние ключевые слова.

3. Как убрать ссылки WordPress

Если вы убираете ссылки WordPress, есть риск повредить тему т.к чаще всего они являются закодированными и в ссылки невозможно вставить свой текст. В таких случаях приходится раскодировать и лишь, потом удалять. Поэтому рассмотрим 2 варианта, когда лишние ссылки убираются легко и когда надо раскодировать. Что бы узнать какой у вас вид ссылок в этом вам поможет плагин Theme Authenticity Checker (TAC). После установки зайдите в темы, если около темы есть надпись, Theme ok — значит в теме нет зашифрованных кодов. Encrypted Code Found! – есть зашифрованные коды. Static Link (s) Found… – количество найденных ссылок.

Плагин TAC

После определения ссылок, смотрите в шаблоне в какой части сайта они расположены. Как правило, они в самом низу. Если так, находим файл footer.php (подвал). Всё в той же панели, где вы заходили в header.php

1. Ссылки не закодированы

Если ссылка простая без <div id> , то можете смело удалять и пропускать пункт с удалением ссылок. Если содержит <div id> приведу пример

[php]&amp;lt;div id=&quot;seosko&quot;&amp;lt;a href=&quot;http://seosko.ru&quot; target=&quot;_blank&quot;Сео продвижение сайтов, блоггинг&amp;lt;/a&amp;gt;&amp;lt;/div&amp;gt;[/php]

то для удаление нужно будет найти ссылку в function.php Удалять ссылки следует одновременно из footer и function поэтому рекомендую скачать тему на компьютер и там в файлах удалить эту ссылку из 2ух файлов footer.php и function.php

2. Закодированные ссылки

Закодированные ссылки выглядят примерно так Phsasuqjs13Jspasjd… ( это обычно не связные буквы,цифры) найти будет не трудно. Что бы узнать, что это за ссылки вам потребуется. Декодер, которой дешифрует ссылки вот он webpeppers  просто вводите туда закодированную ссылку, он вам выдаст нормальный текст, этот текст, вставляем вместо закодированной ссылки в файл wordpress, где была закодированная ссылка, и сохраняете изменения, потом удаляете ссылку и опять сохраняете.

4. Перевод шаблона

Что бы перевести шаблон на уровне профи, потребуется отдельная статья про это. Здесь же вы найдёте, метод для начинающих. Держитесь, так как это уже последний пункт в редактирование шаблона WordPress. Здесь Покажу сам принцип действия. Для перевода скачайте сразу notepad ++, через него удобно смотреть что можно заменить в кодах, а что нет.
1.Скачайте свою тему на компьютер
2.Откройте файл через notepad++ Вот пример на файле archive.phpАрхив то что выделяется чёрным цветом, можем переводить спокойно. 3.После перевода в файле, находим в верхнем меню кодировку и ставим преобразовать в UTF-8 без BOM.8 без bom 4.Сохраняем файл. Если у вас квадратики значит тема не поддерживает кириллицу. Либо файл был сохранен не как UTF-8 без BOM. Поэтому прошу вас быть предельно аккуратным с переводом шаблона.
Задавайте вопросы, если что-то непонятно или хотите уточнить детали. Тем самым вы поможете в редактирование мануала. Надеюсь у вас на редактирование шаблона WordPress ушло не более 5-10 минут!

5. Редактируем заголовки в сайдбаре

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

1. Редактирование файла style.css

    • Внешний вид > Редактор > style.css (обычно находится в самом низу справа под заголовком «Стили»). Добавляем такие строчки как на картинки в рамке, делается это ближе к концу самого файла и делайте 1 в 1.widgettitle
      Обратите внимание, что 24px — это размер заголовка, кроме этого вы можете прописать цвет, толщину и даже анимацию!

2. Замена заголовков h2 или h3 на p или div

  • Заменяем заголовки в файле вашей темы functions.php (theme functions или функции сайта). Находим собственно сам заголовок. В моём случая, я просто заменил h3 на p class=»widgettitle», а закрытие h3 просто на p.pclass
    Иногда сама функция сайдбара другая, но строки всегда остаются такими же для замены.
(голосов: 1, в среднем: 5,00 из 5)

Редактирование шаблона WordPress: 17 комментариев

  • Октябрь 18, 2013 в 11:27 пп
    Ссылка

    Добрый день!
    вопрос от полного чайника )))))
    в разделе 1. редактирование заголовка блога — любуюсь на первый скрин-шот «панель администратора > внешний вид > редактор>» — у меня НЕТ редактора в меню!!!!!! ))))У меня вообще окно выглядит немного по-другому….
    Работаю именно на хосте вордпресса.
    Это дело в бесплатности? ограничения редактирования? или?…
    Спасибо,
    Светлана

    Ответ
    • Октябрь 19, 2013 в 3:50 пп
      Ссылка

      Возможно на бесплатном хостинге нельзя. Если так, то советую скачать шаблон(тему) на компьютер, потом зайти в архив скаченной темы и отрыть файл header.php через notepad ++ , после всех исправлений, установить тему в WordPress.

      Ответ
  • Ноябрь 3, 2013 в 9:58 пп
    Ссылка

    А если в моем шаблоне в файле style.css вместо header-title стоит headerlogo? Делать тоже самое, или тут как-то по-другому должно быть?

    Ответ
    • Ноябрь 4, 2013 в 4:48 пп
      Ссылка

      Принцип действий такой же, что и с header-title

      Ответ
  • Декабрь 16, 2013 в 3:07 пп
    Ссылка

    Здравствуйте,у меня не получается поставить правильные заголовки статей,на странице статьи выводиться название сайта и без пробела следом название статьи.
    В файле одиночной записи нашла вот такой код <a href="» rel=»bookmark» title=» «>
    отличается немного от вашего и мне «чайнику»не понятно какой кусок данного кода нужно изменить чтобы выводилась только название статьи.
    Спасибо заранее за ответ
    С уважением Татьяна

    Ответ
    • Декабрь 16, 2013 в 3:59 пп
      Ссылка

      Дело в том, что у вас прописано в single.php название сайта в h1 — тег для заголовка, его следует поменять на div ( просто вместо h1, написать div. Сам заголовок статьи где написано h2, замените на h1 и уберите rel=bookmark — это даёт ссылку само на себя, что мешает вашему сайту быть выше в поисковиках.

      Ответ
  • Март 25, 2014 в 10:02 пп
    Ссылка

    Добрый день. как сделать, чтобы заголовок сайта в теге h1 выводился только на главной? как бы с этим разобрался. Меняю <a href="» title=»» rel=»home»> на

    <a href="»>

    и заголовок в h1 только на главной. Но он теряет размеры и цвет. Не знаю, где именно в CSS подправить и как. Может какой либо стиль дописать как-то отдельно. Спасибо, буду очень благодарен за помощь.

    Ответ
  • Апрель 2, 2014 в 10:05 пп
    Ссылка

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

    Ответ
  • Апрель 10, 2014 в 1:56 пп
    Ссылка

    очень полезный материал, спасибо!

    Ответ
  • Декабрь 22, 2014 в 5:32 пп
    Ссылка

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

    Ответ
    • Декабрь 24, 2014 в 9:58 пп
      Ссылка

      По вашей просьбе, допишу статью на этой недели.

      Ответ
  • Февраль 6, 2015 в 11:47 дп
    Ссылка

    Здравствуйте! Я из начинающих. Пытаюсь на localhost подредактировать тему Phase (freewordpressthemes.ru/phase.html). Не получается добавить логотип в шапку (перед надписью FreeWordpressThemes.ru). Помогите пожалуйста, подскажите, что нужно сделать?

    Ответ
  • Февраль 19, 2015 в 9:05 пп
    Ссылка

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

    Ответ
  • Май 23, 2015 в 10:48 пп
    Ссылка

    Это что за код то такой жестокий???? А где нормальный код?

    &lt;?php if (is_home ()){ ?&gt;<br />&lt;h1&gt;&lt;?php bloginfo (‘info’); ?&gt;&lt;/h1&gt;<br /><br />&lt;?php } else {?&gt;<br /><br />&lt;p&gt;&lt;a href="&lt;?php bloginfo (‘url’); ?&gt;"&gt;&lt;?php bloginfo (‘info’); ?&gt;&lt;/a&gt;&lt;/p&gt;<br /><br />&lt;?php } ?&gt;&lt;span style="font-size: 13px; line-height: 19px;"&gt;

    Ответ
    • Май 25, 2015 в 9:32 пп
      Ссылка

      к сожалению код съезжает после каждого апдейта WordPress, уже устал исправлять его в надлежащий вид.

      Ответ
  • Декабрь 22, 2015 в 8:23 пп
    Ссылка

    Здравствуйте, подскажите а если в файле header.php не строчек которые начинаются с . этих значений вообще нет

    Ответ
  • Декабрь 22, 2015 в 8:24 пп
    Ссылка

    В предыдущем послании не отобразилось h1

    Ответ

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

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