Thread

Hi homEEs,

Anybody been using something similar to Solspace’s Selected on a EE2 install yet to dynamically select and highlight list items with css yet?

I kind of went ahead with EE2 for this client because all of Pixel Tonic add-ons were there but I didn’t realize Selected was not ported over yet. Yes, I totally took it for granted.

Please help, and thanks!

More info for Selected:

http://www.solspace.com/software/detail/selected/

“The Selected plug-in allows you to dynamically select the state of form elements and CSS objects at page load time. Some possible uses include highlighting a user’s current site location in the nav, or dynamically selecting form content based on user profiles.”

Considering the amount of code “Selected” uses, it doesn’t seem too wordy to just use if statements:

{preload_replace:active="class='selected'"}
<ul id="nav">
    <li id="nav1"><a href="/">Home</a></li>
    <li id="nav2"><a href="/topics">Topics</a></li>
    <li id="nav3"><a href="/news">Daily News</a></li>
</ul>

HMMM - the if statements are being stripped out…

Let’s try again

{if segment_1="topics"}{active}{/if}

You can email me: jacktse the at symbol gmail dot com

I’ve never seen this method… thanks for helping.

@Aaron Fowler -

Thank you first of all.

But it looks like that is a hard-coded list. So I may come back to this if I give up but I want it to dynamically evaluate the segment and replace.

Boyink has a way that I’m looking at… I’m trying to figure it out still.

Hi Boyink…

I have been testing and I have no idea what your “trigger” is to make it only apply to the active page.

Your Example: http://www.train-ee.com/images/weblog/active_class_nav.txt

<div id="sidebar-a">
<a href="/courseware/static/">Static Section Index</a>
<!-- <li{if segment_3==url_title} class="active"{/if}><a href="http://{url_title_path=static/test}">{title}</a></li>   -->
<ul>
{exp:weblog:entries weblog="static"  sort="asc" offset="1" dynamic="off"}
<li{if segment_3==url_title} class="active"{/if}><a href="http://{url_title_path=static/active_class}">{title}</a></li>
{/exp:weblog:entries}
</ul>
</div>

My code:

<h3>About</h3>
<p><ul><br />
{exp:channel:entries channel="services" dynamic="no" offset="1" sort="asc" disable="pagination|member_data|categories|category_fields"}<br />
<li {if segment_2=="{url_title}"}class="leftNav_current"{/if}><a href="http://{url_title_path=">{services_headline}</a></li><br />
{/exp:channel:entries}<br />
</ul>

This approach assumes you are using a weblog:entries (or channel:entries) loop to generate nav, and the URL is displaying the url_title from an entry.

{if segment_2=="{url_title}”}  would only apply to one of the entries being returned by the loop.

The list doesn’t have to be hard coded.  You can output a nav list dynamically and compare segments to url_titles as well. 

-Aaron

This approach assumes you are using a weblog:entries (or channel:entries) loop to generate nav, and the URL is displaying the url_title from an entry.

{if segment_2=="{url_title}”}  would only apply to one of the entries being returned by the loop.

Does this line of code do anything? What does it mean?

<!-- <li{if segment_3==url_title} class="active"{/if}><a href="http://{url_title_path=static/test}">{title}</a></li>   -->

Thanks for helping BTW…

Mike beat me to it 😊

Jack, doesn’t your code example work?

<h3>About</h3>
<p><ul><br />
{exp:channel:entries channel="services" dynamic="no" offset="1" sort="asc" disable="pagination|member_data|categories|category_fields"}<br />
<li {if segment_2=="{url_title}"}class="leftNav_current"{/if}><a href="http://{url_title_path=">{services_headline}</a></li><br />
{/exp:channel:entries}<br />
</ul>

Mike beat me to it 😊

Jack, doesn’t your code example work?

<h3>About</h3>
<p><ul><br />
{exp:channel:entries channel="services" dynamic="no" offset="1" sort="asc" disable="pagination|member_data|categories|category_fields"}<br />
<li {if segment_2=="{url_title}"}class="leftNav_current"{/if}><a href="http://{url_title_path=">{services_headline}</a></li><br />
{/exp:channel:entries}<br />
</ul>

No it doesn’t that’s why I’m incredibly frustrated!  :gulp:

When I first started building EE websites 2 years ago, I remember struggling through this and discovering it doesn’t work. That’s why I use Selected. If this worked for everybody, why would Selected exist? I think I started using Selected from a 47media/longnecker blog post.

However, I’m astounded by looking at Boyink’s example and flabbergasted that it works for him so easily… I’m trying everything here to try to get his results!

Post your template code and the URL the page is displaying with.

Post your template code and the URL the page is displaying with.

http://website/index.php/services

<div class="grid_3 alpha omega leftNav">
                <h3>About</h3>
<p>                <ul><br />
                    {exp:channel:entries channel="services" dynamic="no" offset="1" sort="asc" disable="pagination|member_data|categories|category_fields"}<br />
                    <li {if segment_2=="{url_title}"}class="leftNav_current"{/if}><a href="http://{url_title_path=">{services_headline}</a></li><br />
                    {/exp:channel:entries}<br />
                </ul><br />
            </div>

Latest EE2 build
No plug-ins or modules or any add-ons installed

Thanks!

Is services a template group name, and this is in the index template?

Is services a template group name, and this is in the index template?

Yes,

“Services” is an individual template group and the code for the left nav is in a chunked out template in the Services group named “leftnav”