Перейти к содержанию
  • Авторизация  

    Зафиксированное меню в IPS4


    dci

    Делаем зафиксированное в IPS4 при помощи jquery плагина stickUp. Нам потребуются руки и архив с нужными файлами.

     file.zip

    Для начала заливаем содержимое скачанного архива в корень форума, чтобы получилось так: форум.ru/stick_header/*файлы папки*.

    Затем переходим в АЦ > Внешний вид > Стили и шаблоны > Ваш стиль и создаем там html шаблон с такими данными:

     

    Далее в созданный шаблон добавляем это:

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <script src="{setting="base_url"}stick_header/stickUp_modified.js"></script>
    <script type="text/javascript">
      jQuery(function($) {
        $(document).ready( function() {
          $('#elSearchNavContainer').stickUp();
        });
      });
    </script>
    <link rel="stylesheet" href="{setting="base_url"}stick_header/animate.css" />
    

    Сохраняем шаблон и переходим в globalTemplate и  после:

    <title>{expression="output.getTitle( $title )"}</title>
    

    добавляем этот код:

    {template="stickMenu" app="core" group="global" params=""}
    

    Сохраняем. Переходим в шаблон navBar и после:

    <ul id='ipsLayout_mainNav' class='ipsPos_left'>

    добавляем это:

    <li data-role='navItem' class='stuck_logo' style='display: none;'>
        <a href='{setting="base_url"}'>IPS</a>
    </li>

    Код внутри тегов меняете на название своего форума.

    Там же находим:

    <div class='ipsClearfix' id='elSearchNavContainer' data-controller='core.front.core.navBar'>
    

    и после добавляем:

    <div class="sticker">

    В конце шаблона находим:

     </div>
    </nav>

    И за этим кодом добавляем

    </div>

    И напоследок переходим в custom.css добавляем эти стили:

    #elSearchNavContainer {
        z-index: 5001;
    }
     
    .stuckMenu {
        left: 0;
        width: 100%;
    }
     
    .stuck_logo > a {
        font-size: 18px !important;
        opacity: 1 !important;
    }
     
    .stuck_logo > a > i.fa {
        font-size: 20px;
    }

    В результате получим

    Авторизация  


    Обратная связь

    Рекомендуемые комментарии

    Комментариев нет



    Для публикации сообщений создайте учётную запись или авторизуйтесь

    Вы должны быть пользователем, чтобы оставить комментарий

    Создать учетную запись

    Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

    Регистрация нового пользователя

    Войти

    Уже есть аккаунт? Войти в систему.

    Войти

×