Exponent CMS Tutorial - Change link class for current page in navigation.

With this simple Exponent CMS tutorial, you can change the link class for the link in the navigation bar for the current page. For example, if you are on the page "contact", the link to "contact" will be a different style (color for example), then the rest, so users know where they are on the site.

First, open up the page exponentbase/modules/navigationmodule/views/Top Nav.tpl in a text editor. If you cannot edit them directly on the server, first download this file, make your changes, save it again, and upload it. I recommend that you use Filezilla as your FTP client.

Find the line:

<a class="navlink" href="{$section->link}">{$section->name}</a>

Replace that code with:

{if $section->name == $current->name}
<a class="current_navlink" href="{$section->link}">
{$section->name}</a>
 {else}
<a class="navlink" href="{$section->link}">
{$section->name}</a>
 {/if}

Now, in your style.css for your theme, you can change the style of the link for the current page in the navigation bar.

For example, add the following lilne to style.css

.current_navlink { font-weight: bold; }

That's it. You can do many other hacks by going to the modules/modulename/view/something.tpl. These names are defined in index.php (for your theme). Hope this helps.

Rate this Tutorial

Rate this Tutorial:

Current Rating:

4.5 out of 54.8/ 5.00 with 5 votes.

Current Comments

3 comments so far (post your own)

Of course this will only work while you are on the top level..

Working on solution..

GB

Posted by gboerman on Wednesday, 04.6.05 @ 07:42pm | #439

after installing ver 96.2, I found this file in
modules/navigationmodule/views/Top\ Nav.tpl

Posted by Andy on Thursday, 04.7.05 @ 01:39pm | #440

You shouldn't change that file in de exponentbase. What you have to do is make a subdirectory in your theme directory with the samen path's and names to the file.tpl as what you want to change. In your manifest.php file you have to add this path and file. Now you can change the file in your theme without changing the codebase. Give the file different names and you can use different layouts at the same time.. They will appear in the box of a module.

Posted by Lars on Tuesday, 05.3.05 @ 03:33pm | #523

Leave your comment:

Learn how to add this comment form to your site with our comment form tutorial!

Name:

Email:

URL:

Comments:


 
Guess the letters and numbers
(passphrase riddle)
--
3 chars before E
;
'B'
-
-Z-,
'V' +2 letters
;
"u"
and
2 chars before small U;
→ retype that here
Enter the correct letters and numbers from the image into the text box. This small test serves as access restriction against malicious bots. Simply reload the page if this graphic is too hard to read.
 

Note: Emails will not be visible or used in any way, and are not required. Please keep comments relevant. Any content deemed inappropriate or offensive may be edited and/or deleted.

No HTML code is allowed. Line breaks will be converted automatically. URLs will be auto-linked. Please use BBCode to format your text.