Синяя полоска категорий

[Xlebosolniy]

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

 

 

Если я правильно понял, то этот участок отвечает за всю синюю полоску:

 

 

<nav id="menu" class="navbar">
    <div class="navbar-header"><span id="category" class="visible-xs"><?php echo $text_category; ?></span>
      <button type="button" class="btn btn-navbar navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"><i class="fa fa-bars"></i></button>
    </div>
    <div class="collapse navbar-collapse navbar-ex1-collapse">
       <ul class="nav navbar-nav">
        <?php foreach ($categories as $category) { ?>
        <?php if ($category['children']) { ?>
        <li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>
          <div class="dropdown-menu">
            <div class="dropdown-inner">
              <?php foreach (array_chunk($category['children'], ceil(count($category['children']) / $category['column'])) as $children) { ?>
              <ul class="list-unstyled">
                <?php foreach ($children as $child) { ?>
                <li><a href="<?php echo $child['href']; ?>"><?php echo $child['name']; ?></a></li>
                <?php } ?>
              </ul>
              <?php } ?>
            </div>
            <a href="<?php echo $category['href']; ?>" class="see-all"><?php echo $text_all; ?> <?php echo $category['name']; ?></a> </div>
        </li>
        <?php } else { ?>
        <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
        <?php } ?>
        <?php } ?>
        <?php foreach ($informations as $information) { ?>
          <li><a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a></li>
        <?php } ?>
      </ul>
    </div>
  </nav>

 

Это отвечает за вывод статей:

 

<?php foreach ($informations as $information) { ?>
          <li><a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a></li>
        <?php } ?>

 

Делаю вот так:

 

<nav id="menu" class="navbar">
    <div class="navbar-header"><span id="category" class="visible-xs"><?php echo $text_category; ?></span>
      <button type="button" class="btn btn-navbar navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"><i class="fa fa-bars"></i></button>
    </div>
    <div class = "mobmenu"><div class="collapse navbar-collapse navbar-ex1-collapse">
       <ul class="nav navbar-nav">
        <?php foreach ($categories as $category) { ?>
        <?php if ($category['children']) { ?>
        <li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>
          <div class="dropdown-menu">
            <div class="dropdown-inner">
              <?php foreach (array_chunk($category['children'], ceil(count($category['children']) / $category['column'])) as $children) { ?>
              <ul class="list-unstyled">
                <?php foreach ($children as $child) { ?>
                <li><a href="<?php echo $child['href']; ?>"><?php echo $child['name']; ?></a></li>
                <?php } ?>
              </ul>
              <?php } ?>
            </div>
            <a href="<?php echo $category['href']; ?>" class="see-all"><?php echo $text_all; ?> <?php echo $category['name']; ?></a> </div>
        </li>
        <?php } else { ?>
        <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
        <?php } ?>
        <?php } ?>
        <?php foreach ($informations as $information) { ?>
          <li><a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a></li>
        <?php } ?>
      </ul>
    </div></div>
  </nav>

 

 

 

Перед <div class="collapse navbar-collapse navbar-ex1-collapse"> добавляю <div class = "mobmenu">, при применении медиа запроса с синей полосы убираются и категории и статьи. Если применять  <div class = "mobmenu"> к другим участком, то слетают либо стили или просто сама полоска убирается при медиа запросе. 

 

 

 

 

Змінено 4 липня 2017 користувачем Xlebosolniy

[jaffagold]

Не совсем понятно, что и зачем делается.

По вашему описанию можно понять, что при определенном размере экрана вы хотите из главного меню скрыть пункты навигации ( категории товаров) и оставить только ссылки на статьи.

Возникает вопрос: как тогда будет происходить навигация по категориям?

[Xlebosolniy]

Слишком много категорий, которые не вмешаются в одну строчку, а несколько строчек выглядит не очень красиво. Использую YO MENU для вывода категорий, которые разместил в блоке слева. При просмотре с размеров монитора как на пк хочу скрыть все категории из синий полоски и оставить только ссылки на статьи, а при сжатии экрана до мобильных устройств YO MENU просто пропадает и соответственно нельзя получить доступ к категориям, поэтому при сжатии до мобильных устройств хочу возобновить показ категорий в синей полоске, как-то так

[Xlebosolniy]

Я так понял, что статьи на этой полоске определяются как категории и поэтому они скрываются вместе с категориями. Сделал следующем образом: вытащил код, который отвечает за автоматический вывод статей из класса, в котором выводятся категории, создал такой же класс и добавил туда вывод статей. Применил <div class = "mobmenu"> для скрытия категорий при просмотре с пк. Такое решение может быть правильным?

 

<nav id="menu" class="navbar">
    <div class="navbar-header"><span id="category" class="visible-xs"><?php echo $text_category; ?></span>
      <button type="button" class="btn btn-navbar navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse"><i class="fa fa-bars"></i></button>
    </div>
    <div class="collapse navbar-collapse navbar-ex1-collapse">
       <div class = "mobmenu"><ul class="nav navbar-nav">
        <?php foreach ($categories as $category) { ?>
        <?php if ($category['children']) { ?>
        <li class="dropdown"><a href="<?php echo $category['href']; ?>" class="dropdown-toggle" data-toggle="dropdown"><?php echo $category['name']; ?></a>
          <div class="dropdown-menu">
            <div class="dropdown-inner">
              <?php foreach (array_chunk($category['children'], ceil(count($category['children']) / $category['column'])) as $children) { ?>
              <ul class="list-unstyled">
                <?php foreach ($children as $child) { ?>
                <li><a href="<?php echo $child['href']; ?>"><?php echo $child['name']; ?></a></li>
                <?php } ?>
              </ul>
              <?php } ?>
            </div>
            <a href="<?php echo $category['href']; ?>" class="see-all"><?php echo $text_all; ?> <?php echo $category['name']; ?></a> </div>
        </li>
        <?php } else { ?>
        <li><a href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a></li>
        <?php } ?>
        <?php } ?>
      </ul></div>
      <ul class="nav navbar-nav">
      <?php foreach ($informations as $information) { ?>
          <li><a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a></li>
        <?php } ?>
       </div>
    </div>
  </nav>

Змінено 4 липня 2017 користувачем Xlebosolniy

[Xlebosolniy]

del

Змінено 4 липня 2017 користувачем Xlebosolniy

[jaffagold]

Таким же образом ваше yo-меню скрывается на мобильных вместе со всей левой колонкой. Если вас устраивает результат, то нормально.