Как разместить лого по центру меню?

[boulingist]

Уважаемые знатоки, подскажите, как разместить лого по центру горизонтального меню в opencart 2.3.0.2.5?
т.е. Горизонтальное меню из 8 пунктов: я хочу четыре пункта сделать справа от логотипа и четыре пункта слева от логотипа.
Но в файле header.tpl не могу найти как прописать class для каждого li ( хотел прописать li class="float_ left" и li class="float_ right")
Хотел сделать разметку по другому:

<nav>
        <div class="container">
            <div class="row">
                <div class="my_memu_left col-sm-4">
                    <ul>
                        <li>меню1</li>
                        <li>меню2</li>
                        <li>меню3</li>
                        <li>меню4</li>
                    </ul>
                </div>
                <div class="my_logo col-sm-4">
                    <div id="logo" class="logo">
                        <?php if ($logo) { ?>
                        <a href="<?php echo $home; ?>"><img src="<?php echo $logo; ?>" title="<?php echo $name; ?>"
                            alt="<?php echo $name; ?>" class="img-responsive" /></a>
                        <?php } else { ?>
                        <h1><a href="<?php echo $home; ?>"><?php echo $name; ?></a></h1>
                        <?php } ?>
                    </div>
                </div>
                <div class="my_memu_right col-sm-4">
                    <ul>
                        <li>меню5</li>
                        <li>меню6</li>
                        <li>меню7</li>
                        <li>меню8</li>
                    </ul>

                </div>
            </div>
        </div>
    </nav>

Но опять же не разобрался как это реализовать...
Сейчас разметка такая:

<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 } ?>
                </ul>
              </div>


              <div class="col-md-2 col-sm-3">
                <div id="logo" class="logo">
                  <?php if ($logo) { ?>
                  <a href="<?php echo $home; ?>"><img src="<?php echo $logo; ?>" title="<?php echo $name; ?>"
                      alt="<?php echo $name; ?>" class="img-responsive" /></a>
                  <?php } else { ?>
                  <h1><a href="<?php echo $home; ?>"><?php echo $name; ?></a></h1>
                  <?php } ?>
                </div>
              </div>


            </nav>

Читал, что есть способ разбиения  массива $categories на два равных массива

list($first_cat, $second_cat) = array_chunk($categories, ceil(count($categories)/2));

Но как правильно применить этот способ, не могу понять... 

Подскажите, как реализовать мою задумку относительно текущего кода?
Спасибо.

[Vetroff]

через flex order

и не нужно ничего разбивать

[boulingist]

16 минут назад, Vetroff сказал:

через flex order

и не нужно ничего разбивать

Если не сложно, объясните подробнее, спасибо.

[Vetroff]

ок, гугл

[boulingist]

12 минут назад, Vetroff сказал:

ок, гугл

Спасибо.

Но как задать каждому "li" класс или id?

Быть может в opencart есть файл где можно внести соответствующие правки для меню?

Просто не могу понять как добраться до li, что бы применить flex order.

 

[Vetroff]

3 минуты назад, boulingist сказал:

Просто не могу понять как добраться до li, что бы применить flex order.

 

Через :nth-child()

[boulingist]

От души благодарю! 

Но увы, понятнее не стало...

 :nth-child() надо где то прописать, а где в толк не возьму...

[Vetroff]

.navbar-nav li:nth-child(1) - первый элемент списка

.navbar-nav li:nth-child(2) - второй

и так далее.

соответственно, делаете элемент с лого первым элементом списка (за пределами цикла, разумеется)

и разукрашиваете фломастерами как указано выше.

 

Подробнее уж извините, разве что самому за вас делать.

[boulingist]

Спасибо