Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Feb 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Keeping Navigation Current with PHP

    This is probably a very simple way to do this but I can't work it out.

    I have used in the past this link:http://alistapart.com/articles/keepingcurrent

    This has been great becuase the previous templates I have used have had id="currentpage"

    The template I am currently working on uses class="currentpage".

    Here is my css code for the menu:

    #menu {
    background : transparent;
    font : 80% sans-serif;
    padding-top:20px;
    }
    #menu ul {
    padding : 0.75em 1em;
    }
    #menu li {
    display : inline;
    }
    #menu li a {
    color : #ffffff;
    padding : 0.75em 0.5em;
    }
    #menu li a:hover {
    background : #2b548c url(images/navbg2.gif) repeat-x top left;
    }
    #menu li.selected a {
    background : #ffffff url(images/navbg.gif) repeat-x top left;
    color : #D14023;
    border : 1px solid #2b548c;
    border-bottom : 1px solid #ffffff;

    }
    #menu li.selected a:hover {
    background : #ffffff url(images/navbg.gif) repeat-x top left;
    color : #D14023;
    }

    Could any help please so I can get this to work with the A List Apart Article.

    Thanks,

    James.

  • #2
    raf
    raf is offline
    Master Coder
    Join Date
    Jul 2002
    Posts
    6,589
    Thanks
    0
    Thanked 0 Times in 0 Posts
    welcome here!

    you're not realy saying what you need help with. are you asking what part of the (html generating) php needs changing? if so, then post the relevant php code.
    Posting guidelines I use to see if I will spend time to answer your question : http://www.catb.org/~esr/faqs/smart-questions.html

  • #3
    New to the CF scene
    Join Date
    Feb 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The website I have been referring to uses this as a suggestion:

    <div id="navigation">
    <ul>
    <li><a href="#">Page One</a></li>
    <li id="currentpage"><a href="#">Page Two</a>
    </li>
    <li><a href="#">Page Three</a></li>
    <li><a href="#">Page Four</a></li>
    </ul>
    </div>
    and then turn it into

    <div id="navigation">
    <ul>
    <li<?php if ($thisPage=="Page One")
    echo " id=\"currentpage\""; ?>>
    <a href="#">Page One</a></li>
    <li<?php if ($thisPage=="Page Two")
    echo " id=\"currentpage\""; ?>>
    <a href="#">Page Two</a></li>
    <li<?php if ($thisPage=="Page Three")
    echo " id=\"currentpage\""; ?>>
    <a href="#">Page Three</a></li>
    <li<?php if ($thisPage=="Page Four")
    echo " id=\"currentpage\""; ?>>
    <a href="#">Page Four</a></li>
    </ul>
    </div>
    however, my code uses:

    <div id="navigation">
    <ul>
    <li><a href="#">Page One</a></li>
    <li class="selected"><a href="#">Page Two</a>
    </li>
    <li><a href="#">Page Three</a></li>
    <li><a href="#">Page Four</a></li>
    </ul>
    </div>
    How do I get the <?php if ($thisPage=="Page One") echo " id=\"currentpage\""; ?> converted to class=\"selected\

    I hope that makes more sense.

  • #4
    Regular Coder
    Join Date
    Dec 2006
    Location
    In the wilderness
    Posts
    106
    Thanks
    9
    Thanked 5 Times in 5 Posts
    Changing the id to selected should do it in the php code

    PHP Code:
    <div id="navigation">
    <ul>
    <li <?php if ($thisPage=="Page One")
    echo 
    " id=\"selected\""?>><a href="#">Page One</a></li>
    <li <?php if ($thisPage=="Page Two")
    echo 
    " id=\"selected\""?>><a href="#">Page Two</a>
    </li>
    <li <?php if ($thisPage=="Page Three")
    echo 
    " id=\"selected\""?>><a href="#">Page Three</a></li>
    <li <?php if ($thisPage=="Page Four")
    echo 
    " id=\"selected\""?>><a href="#">Page Four</a></li>
    </ul>
    </div>

  • #5
    Senior Coder
    Join Date
    Feb 2003
    Posts
    1,665
    Thanks
    0
    Thanked 27 Times in 25 Posts
    Don't forget, the OP is using a class, not an id…

    Code:
    <div id="navigation">
    	<ul>
    		<li<?php if ($thisPage=='Page One') echo ' class="selected"'; ?>><a href="…">Page One</a></li>
    		<li<?php if ($thisPage=='Page Two') echo ' class="selected"'; ?>><a href="…">Page Two</a></li>
    		<li<?php if ($thisPage=='Page Three') echo ' class="selected"'; ?>><a href="…">Page Three</a></li>
    		<li<?php if ($thisPage=='Page Four') echo ' class="selected"'; ?>><a href="…">Page Four</a></li>
    	</ul>
    </div>
    Alternatively, you can add a page-specific id or class to the body element and use CSS to control the styling.

    e.g. signify active link when page is shown

    I find that using this approach gives me greater flexibility, not only over the CSS, but over any other page-specific content and DOM manipulation that I might wish to do.
    Last edited by Bill Posters; 02-06-2007 at 07:23 AM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •