Хаки и Скрипты Next Generation CMS

Заголовок или логотип?

irbees2008 irbees2008 Опубликовано - 17 - июня Bootstrap 4
2428 - 0
  • Адаптировал: irbees2008
  • Уровень сложности исполнения: это делается простым копированием и нажиманием кнопки

Всем привет. Проверяя свой сайт на ошибки одним из сервисов он выдал что на главной нету тега H1, теги H2 в количестве 8 и т.д. Исправил в шаблоне H2 на H1 , и снова ошибка.

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

Код:
<a class="navbar-brand" href="{{ home }}">
{% if not isHandler('news:news') %}
<h1 style="margin-top: initial;font-size: 30px;">
{% endif %}
Хаки и Скрипты для <span>NGCMS</span>
{% if not isHandler('news:news') %}
</h1>
{% endif %}
</a>
Как видите здесь я сразу решил как показывать тег H1 на главной и не показывать в новостях.Конечно надо не забывать про стили заголовка.
На другом сайте у меня заместо названия изображение с названием,ну изображение в тег H1 не засунешь, пришлось помудрить
примерно так
Код:
<div class="logo_wrapper">
<a href="{{ home }}" title="{{ home_title }}" class="logo">
{% if not isHandler('news:news') %}
<h1 style="display:none">{{ home_title }}</h1>
{% endif %}
<img src="{{ tpl_url }}/images/logo.png" alt="{{ home_title }}" class="img-responsive">
</a>
</div>
Ну вот так пришлось спрятать название сайта display:none.

Но теперь в Bootstrap 4 появилась плюшка которая решает проблему, это класс .text-hide . Этот класс скрывает текст и позволяет решить проблему с display:none.
Вот пример
Код:
<h1 class="text-hide" style="background-image: url('путь_до_вашего_лого'); width: 50px; height: 50px;">Ваше Название Сайта</h1>
Незабываем указать полный адрес до вашего логотипа, и выставить свои размеры.

Вот вроде и все ,пользуемся.

Можешь почитать и вот эту статейку "Всплывающий информационный блок при прокрутке страницы"

Опрос

Ваше мнение

Какие темы вам интереснее?
Результаты

Последние комментарии

Теги

Anything in here will be replaced on browsers that support the canvas element

Статистика

  • Caйту: 4488 дней
  • Новостей: 566
  • Комменты: 257
  • Зарегистрированно : 670
  • Онлайн всего: [5]
  • Гости: [5]
  • Были сегодня : [3] Google, Яндекс, dankeanke
  • SQL запросов: 27
  • Генерация страницы: 0.289сек
  • Потребление памяти: 5.153 Mb 
  •   Яндекс.Метрика