Как расширить выпадающее меню?

Тема в разделе "Дизайн, оформление и шаблоны", создана пользователем Zhezkazganetcs, 30 июн 2015.

  1. Zhezkazganetcs

    Zhezkazganetcs Продвинутый пользователь

    Сообщения:
    819
    Симпатии:
    108
    Собственно вопрос в заголовке
    хочу чтобы слово Аккумуляторы 180-225Ah (0) и все остальные были каждый в одну строку
    opencart выпадающее меню.JPG
     
  2. Ravilr

    Ravilr Специалист

    Сообщения:
    3.863
    Симпатии:
    1.059
    в stylesheet.css
    исправить min-width для #menu .dropdown-inner a
     
    Zhezkazganetcs нравится это.
  3. Zhezkazganetcs

    Zhezkazganetcs Продвинутый пользователь

    Сообщения:
    819
    Симпатии:
    108
    а как расширить подкатегорию?
    product.tpl
    category.tpl
    stylesheet.css
    облазил, но не нашел
     
  4. Romans

    Romans Administrator Команда форума

    Сообщения:
    1.434
    Симпатии:
    780
    а разве не для подкатегории выше описано??
     
  5. Zhezkazganetcs

    Zhezkazganetcs Продвинутый пользователь

    Сообщения:
    819
    Симпатии:
    108
    выпадающее меню да
    а вот там где Выберите подкатегорию - нет
    Код:
    #menu > li > ul {
        position: absolute;
        left: 50px;
        top: 0px;
        width: 210px;
        background-color: #444444;
        visibility: hidden;
    210 изменил на 300 и ничего
     
  6. Romans

    Romans Administrator Команда форума

    Сообщения:
    1.434
    Симпатии:
    780
    смотрите файл category.tpl
    ниже
    Код:
    <?php if (count($categories) <= 5) { ?>
    есть разметка bootstrap и ее классы col-sm-3
    вот ее и измените напимер на col-sm-6
     
    Zhezkazganetcs нравится это.
  7. Zhezkazganetcs

    Zhezkazganetcs Продвинутый пользователь

    Сообщения:
    819
    Симпатии:
    108
    а еще шире как сделать?
     
  8. Ален

    Ален Эксперт

    Сообщения:
    2.056
    Симпатии:
    640
  9. Zhezkazganetcs

    Zhezkazganetcs Продвинутый пользователь

    Сообщения:
    819
    Симпатии:
    108
    спасибо конечно, но я в бутстрапе вообще не силен
    возможно ли написать на что изменить?
     
  10. Zhezkazganetcs

    Zhezkazganetcs Продвинутый пользователь

    Сообщения:
    819
    Симпатии:
    108
    в общем потыкал
    почти устраивает
     
  11. Zhezkazganetcs

    Zhezkazganetcs Продвинутый пользователь

    Сообщения:
    819
    Симпатии:
    108
    как вот здесь сделать так, что бы Жидкость для гидроусилителя руля (0) была в одну строку?
    может отступы слева справа уменьшить? или как?
    потому что col-sm изменял, но это в данный момент лучше всего, но не идеально
     
    Последнее редактирование: 2 июн 2017
  12. tsap

    tsap Продвинутый пользователь

    Сообщения:
    230
    Симпатии:
    131
    а вам не кажется что вы сильно заморачиваетесь, а если появится категория длиннее чем Жидкость для гидроусилителя руля, что делать будете?
     
  13. Ален

    Ален Эксперт

    Сообщения:
    2.056
    Симпатии:
    640
    а причем силен или нет. Я дал конкретно ссылку на принципы сетки. Уж прочитать (один абзац) что сетка состоит из 12 колонок и цифра это ширина колонки, думаю труда не составляет. ? Если в бутстрапе не сильны, то с чтением наверно все в порядке?
     
  14. Zhezkazganetcs

    Zhezkazganetcs Продвинутый пользователь

    Сообщения:
    819
    Симпатии:
    108
    Ален, я же написал, что потыкал и немного разобрался, даже установил 3 столбца, а не 4, и даже там где 5 подкатегорий в 1 столбец сделал в 3 столбца, и категория масло пока самая некрасивая из-за этой жидкости, и даже там h3 изменил на h2
    tsap, длиннее ее только Зарядное устройство для автомобильного аккумулятора, («"!зарядное устройство для автомобильного аккумулятора"» — 8 629 показов в месяц)
    но я пока до нее не дошел
    можно и жидкость гур, но
    «"!жидкость для гидроусилителя руля"» — 620 показов в месяц
    «"!жидкость гидроусилителя руля"» — 263 показа в месяц
    «"!жидкость гур"» — 388 показов в месяц
    из этого всего делаем вывод, что жидкость для гидроусилителя руля самый ВЧ запрос
     
  15. Ален

    Ален Эксперт

    Сообщения:
    2.056
    Симпатии:
    640
    разделите на два столбца по sm-6
    У меня все красиво выглядит. У всех же ширина монитора разная, поэтому чтобы всегда в одну строку, надо как минимум 2 стобца или вообще один. Но тогда не красиво. Уж лучше пусть в две строки пункт будет.
    Количество пунктов регулируется в (count($categories) / 4))
     
  16. Zhezkazganetcs

    Zhezkazganetcs Продвинутый пользователь

    Сообщения:
    819
    Симпатии:
    108
    с количествами столбцов и шириной я поигрался и только после написал
     
  17. Александрavega

    Александрavega Новичок

    Сообщения:
    5
    Симпатии:
    0
    Добрый день!
    Подскажите, как сделать несколько колонок в выпадающем меню.
    Все меню не влазит, так как там 36 категорий.
    Желательно разделить на 4 столбца.
    Помогите пожалуйста, никак не могу разобраться...
    Сайт avega-group.ru
    Прикрепляю код css и код вывода меню.
    css
    #menu{margin-top:1px;width:200px;position:relative;top:0;}
    #menu ul{list-style:none;margin:0;padding:0;}
    #menu > ul > li{text-align:right;background:url("../image/textures/subtle-pattern-2-2s.jpg") repeat scroll 0 0 rgba(0, 0, 0, 1);border-top:1px solid #CCCCCC;border-bottom:1px solid #CCCCCC;border-left:1px solid #CCCCCC;border-right:1px solid #CCCCCC;margin-top:-1px;}
    #menu > ul > li:hover{}
    #menu > ul > li > a{background-color:rgba(255, 255, 255, 0.6);}
    #menu > ul > li > div > a{border:none;}
    #menu > ul > li > a{border-top:1px solid #FFFFFF;border-bottom:1px solid #FFFFFF;font-size:13px;color:#000000;line-height:14px;text-decoration:none;display:block;padding:9px 15px 9px 5px;z-index:4;position:relative;text-transform:uppercase;-webkit-transition:all 300ms ease-out 0s;-moz-transition:all 300ms ease-out 0s;-o-transition:all 300ms ease-out 0s;-ms-transition:all 300ms ease-out 0s;}
    #menu > ul > li.children:hover > a.expan:after{content:"";position:absolute;left:97%;bottom:9px;width:0;height:0;border-top:9px solid rgba(0, 0, 0, 0);border-left:9px solid rgba(0, 0, 0, 0);border-right:9px solid #757575;border-bottom:9px solid rgba(0, 0, 0, 0);}
    #menu > ul > li > a.active,
    #menu > ul > li:hover > a{background-color:rgba(0,0,0,0.5);color:#FFF;}
    #menu > ul > li > div{display:none;position:absolute;left:211px;z-index:5;/*padding-left:12px;*/margin-top:-71px;}
    #menu > ul > li:hover > div{display:table;}
    #menu > ul > li > div > ul{background:#757575;display:table-cell;}
    #menu > ul > li ul + ul{}
    #menu > ul > li ul > li > a{background-color:#757575;text-decoration:none;padding:8px 12px;color:#FFFFFF;border-bottom:1px solid #353D42;display:block;white-space:nowrap;min-width:186px;}
    #menu > ul > li ul > li > a:hover{background:#22282B;color:#993333;}
    #menu > ul > li > div > ul > li > a{color:#FFFFFF;text-align:left;}
    #menu .menu-item.menu-item_59 > div{margin-top: -35px;}

    код
    <?php foreach($categories as $category){ ?>
    <?php
    $count_children = count($category['children']);
    $item_classes = "menu-item menu-item_$category[category_id]" . ($count_children ? ' children' : '');
    ?>
    <li class="<?=$item_classes?>">
    <?php if($category['active']){ ?>
    <a href="<?php echo $category['href']; ?>" class="active expan"><?php echo $category['name']; ?></a>
    <?php }else{ ?>
    <a class='expan' href="<?php echo $category['href']; ?>"><?php echo $category['name']; ?></a>
    <?php } ?>
    <?php if($count_children){ ?>
    <div style="margin-left: 0;">
    <ul>
    <?php foreach($category['children'] as $child){ ?>
    <li><a href="<?=$child['href']?>"><?=$child['name']?></a>
    <?php } ?>
    </ul>
    </div>
    <?php } ?>
    </li>
    <?php } ?>

    Также прикрепляю картинки, как сделано сейчас и как было бы в идеале.
    Похожая реализация сделана на сайте gigant-dveri.ru
    Буду благодарен за любую информацию!!!


    [​IMG]

    [​IMG]
     
  18. Ален

    Ален Эксперт

    Сообщения:
    2.056
    Симпатии:
    640
    вопрос больше подходит к платным услугам, а не к данной теме.
     
  19. Александрavega

    Александрavega Новичок

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