1

I am using twitter bootstrap and was wondering if it is possible using EE's native category channel tags, to append a class="dropdown-toggle" to any parent category that contains children, and apply class="dropdown-menu" to the children's unordered list.

<ul class="nav nav-stacked products_nav">
    <li><a href="products.php">All products</a></li>
    <li class="dropdown">
        <a class="dropdown-toggle" data-toggle="dropdown" href="#">Corn Tortillas</a>

        <ul class="dropdown-menu">
            <li><a href="products_corn_tortilla1.php">Tortilla 1</a></li>
            <li><a href="#corn_tortilla2">Tortilla 2</a></li>
            <li><a href="#corn_tortilla3">Tortilla 3</a></li>
        </ul>
    </li>
    <li><a href="products_better-for-you-tortillas.php">Better-For-You Tortillas</a></li>

    <li><a data-toggle="tab" href="#">Artisan Style Tortillas</a></li>
    <li><a href="products_wraps.php">Wraps</a></li>

    <li><a data-toggle="tab" href="#">Tortilla Chips</a></li>
    <li><a data-toggle="tab" href="#">Tostadas</a></li>
    <li><a data-toggle="tab" href="#">Taco Shells &amp; Kits</a></li>
    <li><a data-toggle="tab" href="#">Chicharrones</a></li>
    <li><a data-toggle="tab" href="#">Salsa, Dips, Toppings</a></li>
    <li><a data-toggle="tab" href="#">All Others</a></li>
</ul>

enter image description here

I took a look at this add-on, but from looking thru the examples, it doesn't seem to do what I need: http://gwcode.com/add-ons/gwcode-categories

2

Brad, i've got something similar working on a local site. Was able to achieve what you're trying to do using a similiar addon by the same developer GWcode CatMenu

You can use my code as a starting point..

<nav id="menu">
{exp:gwcode_catmenu cat_url_title="{segment_1}" }
{if no_results}<!-- if no valid category was provided in the URL segment show only root categories as our menu-->
{exp:channel:categories
channel="demo"
parent_only="yes"
disable="member_data|pagination"
}
<a href="{path='{category_url_title}'}" title="{category_name}"><span>{category_name} {if category_name !=""}<i class="fa fa-caret-down"></i>{/if}</span></a>
{/exp:channel:categories}
{/if}
<a href="{path='{complete_path}'}"{if active} class="current"{/if} title="{cat_name}">{if gw:open} class="current"{/if} {cat_name} {if has_children} <i class="fa fa-caret-down"></i>{/if}</a>
{/exp:gwcode_catmenu}
</nav>
| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.