Меню в InstantCMS 2//

#61 30 октября 2015 в 09:39
Atid — Gorec, все правильно подметил поменял местами скрипты блок начал разворачиваться.

Я выводил пытаюсь вывести меню как в первом вашем варианте
  1. <?php if($this->hasWidgetsOn('top')) { ?>
  2. <nav class="navbar navbar-inverse navbar-static-top" role="navigation">
  3. <div class="navbar-header">
  4. <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1">
  5. <span class="icon-bar"></span>
  6. <span class="icon-bar"></span>
  7. <span class="icon-bar"></span>
  8. </button>
  9. <a class="navbar-brand visible-xs-block" href="#">Меню</a>
  10. </div>
  11. <div class="collapse navbar-collapse" id="navbar-collapse-1">
  12. <?php $this->widgets('top', false, 'wrapper_plain'); ?>
  13. </div>
  14. </nav>
  15. <?php } ?>
Вот получился порядок js и css файлов
  1. <?php $this->addMainCSS("templates/{$this->name}/css/theme-text.css"); ?>
  2. <?php $this->addMainCSS("templates/{$this->name}/css/theme-layout.css"); ?>
  3. <?php $this->addMainCSS("templates/{$this->name}/css/theme-gui.css"); ?>
  4. <?php $this->addMainCSS("templates/{$this->name}/css/theme-widgets.css"); ?>
  5. <?php $this->addMainCSS("templates/{$this->name}/css/theme-content.css"); ?>
  6. <?php $this->addMainCSS("templates/{$this->name}/css/theme-modal.css"); ?>
  7. <?php $this->addMainCSS("templates/{$this->name}/css/bootstrap.css"); ?>
  8. <?php $this->addMainCSS("templates/{$this->name}/css/font-awesome.min.css"); ?>
  9. <?php $this->addMainJS("templates/{$this->name}/js/jquery.js"); ?>
  10. <?php $this->addMainJS("templates/{$this->name}/js/bootstrap.js"); ?>
  11. <?php $this->addMainJS("templates/{$this->name}/js/jquery-modal.js"); ?>
  12. <?php $this->addMainJS("templates/{$this->name}/js/core.js"); ?>
  13. <?php $this->addMainJS("templates/{$this->name}/js/modal.js"); ?>
  14. <?php $this->addMainJS("templates/{$this->name}/js/messages.js"); ?>
  15. <?php $this->addMainJS("templates/{$this->name}/js/scroll.js"); ?>
Блок начал раздвигаться, но меню показывается в стандартном виде, что дальше делать? ковыряться в CSS?
#62 30 октября 2015 в 13:39
Теперь нужно меню стилизовать и разделить ее на мобильную и дескоптную. На сайте бутстрапа в стилях навигации прописано следующее
  1. @media (min-width: 768px) {
  2. .navbar-nav {
  3. float: left;
  4. margin: 0;
  5. }
  6. .navbar-nav > li {
  7. float: left;
  8. }
  9. .navbar-nav > li > a {
  10. padding-top: 15px;
  11. padding-bottom: 15px;
  12. }
  13. }
Здесь идет условие, если экран больше этого размера то применять эти стили, если размер меньше указанного то стили скрыть. А теперь глянем на ваш сайт и находим там
/css/theme-layout.css 174 строка
  1. nav .menu {
  2. float: left;
  3. height: 60px;
  4. line-height: 59px;
  5. position: relative;
  6. z-index: 5;
  7. }
184 строка
  1. nav .menu > li {
  2. float: left;
  3. }
Эти стили нужно применить только для больших экранов, тоесть оборачиваем их в @media (min-width: 768px) { }
Можно вместе можно отдельно
  1. @media (min-width: 768px) {
  2. nav .menu {
  3. float: left;
  4. height: 60px;
  5. line-height: 59px;
  6. position: relative;
  7. z-index: 5;
  8. }
  9. nav .menu > li {
  10. float: left;
  11. }
  12. }
Так как мы убрали line-height: 59px; у нас ссылки стали очень узкими, нам нужно задать им внутренний отступ 15px по высоте 192 строка после
  1. nav .menu > li > a {
  2. color: #fff;
  3. display: block;
  4. font-weight: bold;
  5. padding: 22px 15px;
  6. text-decoration: none;
  7. text-transform: uppercase;
  8. }
Добавить
  1. @media (max-width: 767px) {
  2. nav .menu > li > a {
  3. padding: 15px;
  4. }
  5. }
https://yadi.sk/i/tYc474Jkk7wLV
#63 30 октября 2015 в 14:42
Получилось!!! А что дальше делать с подпунктами меню?
#64 30 октября 2015 в 15:49
Дальше позже расскажу, пока времени нет. В пункты меню нужно добавить кнопку для открытия под меню.
#65 3 ноября 2015 в 22:44
У меня следующий вопрос: как из под
  1. <select>
запускать ajax-modal.
Т.е. при выборе пункта меню "Сообщения"
кидает на 404.
#66 4 ноября 2015 в 00:40
Никто не сможет помочь?
#67 11 ноября 2015 в 17:03


У меня следующий вопрос: как из под
Код PHP:
<select>
запускать ajax-modal.
Т.е. при выборе пункта меню "Сообщения"
кидает на 404.
Никто не сможет помочь?

DELLитант
Решено. Хочу выразить особую благодарность neomaster за оказанную помощь.
#68 26 февраля 2016 в 03:06


Дальше позже расскажу, пока времени нет. В пункты меню нужно добавить кнопку для открытия под меню.

Atid — Gorec

А будет продолжение?!
#69 24 февраля 2017 в 13:18
я создал пункт меню — ПОИСК
назначит ему ссылку search

как повесить виджет "теги" в этот раздел открывающийся по ссылке поиск?
Вы не можете отвечать в этой теме.
Войдите или зарегистрируйтесь, чтобы писать на форуме.
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.