Как сделать закрепленное меню (шаблоны YOOtheme — YOO Eat Theme)

Шаблоны разработчика YOOtheme достаточно популярны у вебмастеров. Тем не менее, традиционно, все в Joomla приходится «допиливать» в «ручном режиме».

При использовании шаблона YOO Eat столкнулся с проблемкой: заказчик жаждет иметь на своем сайте «закрепленное» меню, а в шаблоне данный функционал предусмотрен, но не реализован. По счастью, я не первый и не последний столкнулся с данной проблемой. В Интернет есть решение поставленной задачи.

Но: на английском и не совсем корректно изложен материал: важна версия фреймворка, на которой работает админпанель шаблона. Стоит обновиться перед началом работы (на день публикации это Warp Framework 7.3.36., по ссылкам — архивы: Uikit 3.0.3. и Warp Framework 7.3.36.). Процесс обновления обычный, не будем на этом останавливаться.

Переходим сразу к созданию «закрепленного» меню, пошагово.

Шаг 1

Открываем файл по адресу: мойсайт.ru/templates/yoo_eat/config.xml

Прописываем в админпанели шаблона функцию «закрепления» меню в виде чекбокса следующим образом:

        <field type="section" name="Navigation" description="Enable the fixed Navigation." />
        <field type="checkbox" name="fixed_navigation" value="1" label="Fixed Navigation." />

Я лично добавил эту опцию перед функцией Insert your Google Analytics (примерно на 53-й строке файла), но место можно, понятно, выбрать любое удобное.

Шаг 2

Открываем файл: мойсайт.ru/templates/yoo_eat/layouts/theme.php

Находим в нем строку: <div class="tm-top-block tm-grid-block">

Добавляем код, получая в итоге:

   <div class="tm-top-block tm-grid-block">
   <?php if ($this['widgets']->count('menu + search')) : ?>
   <nav class="tm-navbar uk-navbar" <?php if ($this['config']->get('fixed_navigation')) echo 'data-uk-sticky'; ?>>

Возможно эти строки уже прописаны. Зависит от степени «поломки» шаблона и его версии.

Шаг 3

Подключаем скрипт для реализации функции. Для этого:

Открываем файл: мойсайт.ru/templates/yoo_eat/layouts/theme.config.php

Добавляем строчку кода:

$this['asset']->addFile('js', 'warp:vendor/uikit/js/components/sticky.js');

В блок под комментарием: // add scripts, (примерно 116-я строка).

Шаг 4

Открываем файл: мойсайт.ru/templates/yoo_eat/less/uikit/uikit.less

Добавляем строчку кода:

  @import "../../warp/vendor/uikit/less/components/sticky.less";

В блок под комментарием: // Components: JavaScript, (примерно 17-я строка).

Шаг 5

Прописываем нужные стили в файл: мойсайт.ru/templates/yoo_eat/css/custom.css

  [data-uk-sticky].uk-active.tm-navbar {z-index: 1000;}

Возможно, что-то еще придется дописать в css, мне «сошло и так».

Шаг 6

Заходим в админпанель шаблона и, в настройках Settings, — включаем «флаг»: Fixed Navigation.

Если все вышеизложенное реализовано аккуратно, то меню станет «закрепленным». У меня лично — заработало. Удач.

PS: Шаблоны YOOtheme крайне востребованы и все работают на том же Warp. Очевидно, что «метода» подойдет и для иных шаблонов. С поправками на классы меню.

Ссылка на первоисточник: YOOtheme.

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


Планируете проект?

Заполните форму, наш специалист свяжется с вами для консультации (бесплатно), составит для вас персональное предложение.

Как к вам обращаться?
Сообщите корректный адрес электронной почты.
Не корректный номер.
Опишите кратко суть задачи: *
Необходимо подтвердить согласие с Политикой.

Планируете создание веб проекта?

Заполните форму и наш специалист свяжется с вами для консультации и составит для вас персональное предложение.

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

Разработка сайтов «под ключ» любой сложности и назначения!

Обращаем ваше внимание на то, что данный интернет-сайт носит исключительно информационный характер и не является публичной офертой, определяемой положениями Статьи 437 (2) Гражданского кодекса РФ. Для получения подробной информации о стоимости указанных услуг, пожалуйста, обращайтесь по телефону: +7(916) 107-51-99 или через Форму обратной связи. Политика конфиденциальности / Соглашение об обработке персональных данных.

©2010–2022 веб-лаборатория «Reklama-No» | Создание, поддержка и продвижение сайтов