Thread

Hi guys,

Purchased and installed EE today (hooray for me), initially for my own site. It’s really starting to take shape, and I’ve already managed to define my homepage template and have it pull entries from several channels through embedded templates. I’ve just finished building a “somewhat dynamic navigation” by having Query loop through all template-groups, and all was well with the world 😉. Now I’m running into something of an issue which I don’t quite know how to fix. Basically I want to add class=“active” to the active template-group. I’m pretty much stumped. My nav subtemplate looks like this:

<div class="grid_12" id="nav">
                <div id="nav-left"></div>
                <ul id="primary">
                {exp:query sql="SELECT group_name,group_order FROM exp_template_groups ORDER BY group_order ASC" }
                    <li><a href="http://www.digitaaldier.nl/{group_name}">{group_name}</a></li>
                {/exp:query}
                    <li><a href="#contact" class="anchorLink">Contact</a></li>
                </ul>
                <div id="nav-right"></div>
            </div>
            <div class="cl"></div>

Any thoughts on how I would achieve adding class=“active” to the a-element of the active template group?

Only got a moment but couldn’t you do this by URL segments?

{if segment_1 == "{group_name}"}class="active"{/if]

Or something on those lines.

http://ellislab.com/expressionengine/user-guide/templates/globals/url_segments.html

That’s what I thought too, but it doesn’t work somehow… Probably because you’re looping through the select while calling segment_1, which isn’t part of the query.

My code looks like this atm:

<div id="nav-left"></div>
                <ul id="primary">
                {exp:query sql="SELECT group_name,group_order FROM exp_template_groups WHERE group_name <> 'diensten' ORDER BY group_order ASC" }
                    <li><a href="http://www.digitaaldier.nl/{group_name}" class="active">{group_name}</a></li>
                {/exp:query}
                    <li><a href="#contact" class="anchorLink">Contact</a></li>
                </ul>
                <div id="nav-right"></div>

So segment_1 doesn’t work at all inside the query tag? If you just put {segment_1} in the code does it output anything?

Got it working! Thanks for the help (I had to pull the if-statement a bit wider, and also: I’m such an idiot, I forgot i disabled the highlighting of ul#primary a.active in my css :| ). Code looks like so:

<ul id="primary">
                {exp:query sql="SELECT group_name,group_order FROM exp_template_groups WHERE group_name <> 'diensten' ORDER BY group_order ASC" }
                    {if segment_1 == "{group_name}"}<li><a href="http://{group_name}" class="active">{group_name}</a></li>{if:else}<li><a href="http://www.digitaaldier.nl/{group_name}">{group_name}</a></li>{/if}
                {/exp:query}
                    <li><a href="#contact" class="anchorLink">Contact</a></li>
                </ul>

Only slight issue I might have is that group_name’s don’t have capitals. Is there a way to run php output-filters over certain fields? I’d have to write a plugin right?

Just a thought - but how often will top-level nav change?  I typically just hard-code primary nav because it rarely changes—so seems overkill to run queries to build it on each page.

I know, but I want to highlight the active section (better from a usability and esthetics standpoint I think). Working like a champ now on http://www.digitaaldier.nl (in Dutch, sorry 😊 ). Moreover, for the time being it’s just my own site, but I’ll hopefully be building sites for clients in EE, and I want to be able to do this properly, and what better way then to “walk you talk” 😊.

FWIW - You can still highlight the active section with static nav either using conditionals & segments or conditionals with embed variables for embedded templates.

Greetings from the “other Holland” (Michigan, USA)...😉

Haha hi there other Holland 😊 (do understand, this does *not* make you a dutchman 😉 ). I understand your point, but the whole point of implementing a CMS for me is that I can give it to the client, and that they basically can do everything by themselves. I know that this approach won’t exactly do that, but it’ll at least make it easier for me to update it (one less thing to worry about 😊 ).

Haha hi there other Holland 😊 (do understand, this does *not* make you a dutchman 😉 ).

No - but I am of Dutch descent..😉

I understand your point, but the whole point of implementing a CMS for me is that I can give it to the client, and that they basically can do everything by themselves. I know that this approach won’t exactly do that, but it’ll at least make it easier for me to update it (one less thing to worry about 😊 ).

Having built client sites on CMS (EE and others) for ~ 10 years now I understand the goals…;)

But what I see - in practice - is that if client needs main navigation changed it means most likely their business model has changed, and there will be more work needed on the site by you as the developer anyway.  Actually in thinking about it, I can think of maybe one client site in 6 years of EE work where we added to the main nav.

I also like to keep an eye on site performance - and running additional queries on every page load just to (possibly) save me ~2 mins of adding a <li> in one template seems excessive.

I would look into at least setting caching on that template so the query isn’t always having to run.