Очередное улучшение и исправление.

Код header.html был значительно усовершенствован, исправлены логические ошибки и добавлены премиальные UI-эффекты. Также были внесены сопутствующие изменения в стили, скрипты и контекстные процессоры для обеспечения корректной работы всех функций.
23 Янв 2026
12 просмотров
Очередное улучшение и исправление.
Главные новости 12 просмотров 2 минуты чтения
Аудиоверсия статьи Слушать текст в один клик
Скорость:

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

Список основных изменений:

  1. Исправление ошибок отображения баннеров:

    • В main/context_processors.py исправлена функция statistics_banners. Теперь она возвращает готовые HTML-строки отрендеренного кода баннеров вместо списков объектов. Это исправляет ошибку, при которой тег

      {{ statistics_banners.header|safe }}

      в шаблоне не выводил код баннеров.

    • Ключ в контексте изменен на statistics_banners, чтобы соответствовать вызовам в шаблонах.

  2. Улучшение навигации и UX в header.html:

    • Подсветка активных пунктов меню: Добавлена логика

      {% if request.resolver_match.app_name == '...' %}active{% endif %}

      , которая автоматически подсвечивает текущий раздел сайта.

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

    • Анимированный гамбургер: Кнопка мобильного меню теперь имеет плавную анимацию превращения в крестик при открытии.

    • Премиальный стиль: Добавлены классы для эффекта градиентного текста (text-gradient), стеклянного меню (dropdown-menu-glass) и микро-анимации.

  3. Обновление стилей в ui-enhancements.css:

    • Добавлены стили для Glassmorphism эффекта в выпадающих списках.

    • Реализована плавная анимация появления для меню. 

      animate-slide-in
    • Добавлены стили для адаптивного расширения строки поиска при фокусе на десктопе.

    • Добавлены стили для анимированной иконки меню.

  4. Добавление интерактивности в main.js:

    • Добавлена функция initHeaderScroll, которая добавляет класс к шапке при прокрутке страницы вниз, позволяя менять её прозрачность или высоту для лучшей читаемости контента.

      .scrolled

Исправленные ошибки:

  • Устранено дублирование закрывающих тегов

    </header>

    и

    </nav>

    .

  • Исправлено использование фильтра для списков (теперь применяется к строке).

    |safe
  • Удалены избыточные и повторяющиеся комментарии в коде.

  • Исправлена доступность (ARIA-атрибуты) для кнопок навигации.

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

Как вам статья? Отправьте реакцию!

Обсуждение статьи

0

К этой статье пока нет комментариев. Будьте первым, кто выразит свое мнение!

Оставить комментарий

captcha

Похожие материалы

Наши услуги

Мы делаем для вас лучшее

Комплексный подход к цифровому развитию вашего бизнеса — от создания сайтов до автоматизации и технической поддержки

Создание сайтов

Разрабатываем сайты любой сложности: от лендингов до полноценных маркетплейсов.

  • Лендинги и промо-сайты
  • Интернет-магазины
  • Корпоративные сайты
  • Порталы и каталоги
  • Маркетплейсы

Автоматизация бизнеса

Освобождаем ваше время — автоматизируем рутинные задачи и бизнес-процессы.

  • Автоматизация рутины
  • Документооборот
  • Отчётность и аналитика
  • Email и смс рассылки
  • Уведомления и триггеры

Продвижение сайтов

Приводим целевых посетителей и клиентов через эффективные каналы продвижения.

  • SEO-оптимизация
  • Контекстная реклама
  • SMM и социальные сети
  • Таргетированная реклама
  • Медийная реклама

Техническая поддержка

Обеспечиваем стабильность и безопасность ваших ресурсов в режиме 24/7.

  • Поддержка сайтов
  • Интернет-магазины
  • Обновления и патчи
  • Резервное копирование
  • Мониторинг и безопасность
0+
Завершённых проектов
0+
Лет опыта
0%
Довольных клиентов
0/7
Техническая поддержка