Приводим шаблон к сео стандарту: Оставляем заголовки H1-H6 только в тексте статьи

Недавно совершенно случайно увидел рекламу шаблона Root и прочитал там:
[intense_alert color=»#daedf0″ border_radius=»5px»]

Правильные H1-H6 заголовки
Заголовки H1-H6 только в статьях, ни в виджетах, ни в комментариях, ни в пагинации, как это обычно бывает — их нет. Только в тексте статьи.
[/intense_alert]

Ну, думаю надо проверить и у себя в шаблоне colormag. Оказалось, что заголовки виджетов, футера и ещё некоторые несут в себе разные значения H. Надо исправлять, чтобы соответствовать seo стандарту.

Ниже я привожу инструкцию, что поправить. Если вы не очень разбираетесь в коде, то лучше редактировать с хостинга. Если что то неправильно то вы всегда можете воспользоваться комбинацией Ctrl+Z для возврата на шаг назад. Если же вы будете править код прямо из админ панели, то в случае ошибки сайт потухнет и вам опять же придётся заходить на хостинг и там всё поправлять. Имейте это ввиду. В целом настройки элементарные.

Правый сайд бар

Удаляем H3. Необходимо обернуть before и after title в div и прописать класс. Я назвал класс widgetrules.

Теперь надо прописать правила для класса widgetrules. Просто добавьте в пользовательские css

.widgetrules {
    border-bottom: 2px solid #289dcc;
    font-size: 16px;
    margin-bottom: 15px;
    padding-bottom: 0;
}
 
.widgetrules span {
    background-color: #289dcc;
    color: #fff;
    padding: 4px 12px;
    display: inline-block;
}

Внешний результат должен совпадать с оригиналом. То же самое (обернуть в div) необходимо проделать для:
// Registering footer sidebar one upper
// Registering footer sidebar two upper
// Registering footer sidebar three upper

То есть тем самым вы уберёте заголовки H3 из футера.

Остальное таким же образом: просто оберните нужное в div с тем же классом. Обратите внимание, что в классе указан цвет, то есть он уже не будет редактироваться через настройки темы. Для разных рубрик, где необходимо указать цвет придётся писать свой класс. Например, widgetrules1, widgetrules2 и тп. правила можно подставлять те же, со своим цветом. Разберётесь.

C правым виджетом закончили. Теперь перейдём к основным виджетам на главной, по умолчанию они H3.

inc/widgets/widgets.php строка 911

if ( !empty( $title ) ) { echo '<h3 class="widget-title">&lt;span ' . $title_color .'&gt;'. esc_html( $title ) .'' . $category_link . '</h3>'; }

замените этим кодом:

if ( !empty( $title ) ) { echo '<div class="widgetrules">&lt;class="widget-title" '. $border_color .'&gt;&lt;span ' . $title_color .'&gt;'. esc_html( $title ) .'' . $category_link . '</div>'; }

Здесь возникает проблема: цвет нижней полоски не меняется, хотя цвет самого блока остаётся прежним (он прописан немного другим образом).

Для того чтобы цвет полоски совпадал с цветом блока необходимо указать перед селектором класса id блока. Где его взять?

Откройте ваш сайт, наведите мышку на объект и нажмите правую кнопку мышки. В выпадающем списке выберите Просмотреть код элемента

Скопируйте ваш id и вставьте его перед селектором класса. Id должен начинаться с знака #

#ваш id .widgetrules {
    border-bottom: 2px solid #цвет блока;
    font-size: 16px;
    margin-bottom: 15px;
    padding-bottom: 0;
}

В рабочем виде это выглядит так:

#colormag_featured_posts_widget-4 .widgetrules {
    border-bottom: 2px solid #dd9933;
    font-size: 16px;
    margin-bottom: 15px;
    padding-bottom: 0;
}

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

Для редактирования этого блока необходимо открыть inc/related-posts.php и найти этот кусочек кода

Здесь необходимо удалить H4, обернуть в div и назначить класс:

В пользовательских css указать значения класса

.relpost {
    font-size: 26px;
    padding-left: 10px;
    text-align: center;
    padding: 15px;
}

 
Блоки под заголовком
 

Найдите этот кусочек кода

Здесь необходимо удалить h3 и обернуть этот код в div и задать класс

В пользовательских css указать значения класса

.relpost2 {
	padding: 10px 0 0;
	text-align:center;
	}
 
.relpost2 a {
	color: #232323;
  text-shadow: none;
}

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