PHP to show current page problem.

Discussion in 'Web Design and Development' started by Dal123, Aug 8, 2010.

Most Liked Posts
Page 1 of 2
  1. Dal123, Aug 8, 2010

    Dal123 macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #1
    I've had a lot of help on another forum and I'm a bit stuck so seeing if anyone here can help (I'm on the ponce again :eek:) I have an <ul> as my nav bar, and I am using php to check whether page is the last url piece after the /.
    I had it almost working (colours wasn't changing yet) but at least I had my page loading, instead of disapeering completely. I have now turned on to display php errors. I am not sure what the problem is now, I have edited a lot and not sure what's causing it. The reason I carried on editing is that it was creating formatting issues with my css. The list was set up nicely displaying even gaps, and flush at both ends, however when I finally got my php to work it pushed it along and messed it up.
    Surely php shouldn't have created any formatting errors as I'm only using it to display html on the page. So something has gotta be up with my code, can anyone see anything obvious. I have left the <div>'s in so you can get a feel of how it is set up:
    PHP:
    <div id="nav">
    <ul id="nav-list">
    <?php
    $scriptname     = end (explode('/',_FILE_));
    echo     '<li>';
    if (    $scriptname == 'index.php') {
    echo     '<a href="index.php" class="highlight">home</a>';    
    } else{    
    echo     '<a href="index.php">home</a>';
    }    
    echo     '</li>';

    echo     '<li>';
    if (    $scriptname == 'services.php'); {
    echo     '<a href="services.php" class="highlight">services</a>';    
    } else{    
    echo     '<a href="services.php">services</a>';}    
    echo     '</li>';

    echo     '<li>';
    if (    $scriptname == 'portfolio.php'); {
    echo     '<a href="portfolio.php" class="highlight">portfolio</a>';    
    } else{    
    echo     '<a href="portfolio.php">portfolio</a>';}    
    echo     '</li>';

    echo     '<li>';
    if (    $scriptname == 'links.php'); {
    echo     '<a href="links.php" class="highlight">links</a>';    
    } else{    
    echo     '<a href="links.php">links</a>';}    
    echo     '</li>';


    echo     '<li><a href="http://www.preciseformwork.co.uk/wordpress">blog</a>';    

    echo     '<li>';
    if (    $scriptname == 'contact.php'); {
    echo     '<a href="contact.php" class="highlight no-pad">contact us</a>';    
    } else{    
    echo     '<a href="contact.php" class="no-pad">contact us</a>';}    
    echo     '</li>';
    ?>
    </ul>
    </div>
    PHP errors are showing on line
    PHP:
    } else {    
    underneath services, though I cannot see why as it is the same as its predeccessor.
     
    share
    + Quote Reply
  2. designguy79, Aug 8, 2010

    designguy79 macrumors 6502

    Joined:
    Sep 24, 2009
    Location:
    Michigan
    #2
    Well, this may not be your only problem, but this line (and others like it)

    PHP:
    if ($scriptname == 'services.php'); { 
    should be

    PHP:
    if ($scriptname == 'services.php') { 
    You don't use a semicolon on "if" "elseif" "else" "while" and the like.

    Have fun!
     
    share
    + Quote Reply
  3. angelwatt, Aug 8, 2010

    angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #3
    Instead of the complicated bit you have to get the script name, use the basename function.

    You should also work on properly formatting/indenting your code, which makes it much easier to read and find problems.

    Here's some simplification to your code, just a snippet's worth.

    PHP:
    $class = ' class="highlight"';

    ?><li><a href="services.php"<?php
            if ($scriptname == 'services.php') echo $class;
    ?>>services</a></li>
     
    share
    + Quote Reply
  4. Ezlivin, Aug 11, 2010

    Ezlivin macrumors member

    Ezlivin

    Joined:
    Aug 11, 2010
    #4
    Why use PHP at all?

    If all you are trying to accomplish is the setting of class="highlight" when that page is the active page, there is a way to accomplish this through CSS alone.

    Taking your PHP and making it into HTML gives us this:

    Code:
    <ul id="nav-list"> 
  <li><a href="index.php" class="highlight">home</a></li>
  <li><a href="services.php" class="highlight">services</a></li>
  <li><a href="portfolio.php" class="highlight">portfolio</a></li>
  <li><a href="links.php" class="highlight">links</a></li>
  <li><a href="http://www.preciseformwork.co.uk/wordpress" class="highlight">blog</a></li>
  <li><a href="contact.php" class="highlight" class="no-pad">contact us</a></li>
</ul>
    Simply add an ID to each <li> and remove the highlight classes for the a tags:

    Code:
    <ul id="nav-list"> 
  <li id="m_home"><a href="index.php">home</a></li>
  <li id="m_services"><a href="services.php">services</a></li>
  <li id="m_portfolio"><a href="portfolio.php">portfolio</a></li>
  <li id="m_links"><a href="links.php">links</a></li>
  <li id="m_blog"><a href="http://www.preciseformwork.co.uk/wordpress">blog</a></li>
  <li id="m_contact"><a href="contact.php" class="no-pad">contact us</a></li>
</ul>
    Now on each page add a unique ID to the <body> tag. For the index.php page the body tag would read (for instance) "<body id="b_home">, the services.php body tag would read "<body id="b_services"> and so on.

    In your main CSS file write your selectors like this to enable the "highlight" to indicate the current page (note: this code snippet also takes care of hovers over the menu items):

    Code:
    #nav-list li#m_home a:hover,
#nav-list li#m_services a:hover,
#nav-list li#m_portfolio a:hover,
#nav-list li#m_links a:hover,
#nav-list li#m_blog a:hover,
#nav-list li#m_contact a:hover,
#b_home #nav-list li#m_home a,
#b_services #nav-list li#m_services a,
#b_portfolio #nav-list li#m_portfolio a,
#b_links #nav-list li#m_links a,
#b_blog #nav-list li#m_blog a,
#b_contact #nav-list li#m_contact a
{
	YOUR HIGHLIGHT STYLE
}
    There's no need for extensive PHP scripting when you can use CSS. And if you need to add a page it only takes a second to modify the CSS.

    Unless you are using the class "no-pad" elsewhere, you can also simply use the ID of the associated <li> to take care of the padding and you can drop the class declaration in the contact us anchor tag:

    Code:
    #nav-list li#m_contact a { YOUR no-pad STYLE }
     
    share
    + Quote Reply
  5. angelwatt, Aug 11, 2010

    angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #5
    No, the highlight class would only ever be applied to one of those li tags on any given page.

    So you trade some extensive PHP (which is very simple really) for extensive CSS and HTML modifications to get the effect. Not seeing the benefit. With the PHP you only have to modify the navigation section of code. With your code, you have to modify not only the navigation, but every single page, adding a new attribute to the body tag. Then you have a really large CSS selector to manage. So I simply don't see why to use your approach. I'm not saying the given technique is bad or wrong, I just don't see the benefit here.
     
    share
    + Quote Reply
  6. Ezlivin, Aug 12, 2010

    Ezlivin macrumors member

    Ezlivin

    Joined:
    Aug 11, 2010
    #6
    PHP Only Solution

    Code:
    <div id="nav"> 
<ul id="nav-list"> 
<?php 
$scriptname = end (explode('/',_FILE_));
// create associative array with filenames as keys
$class = array('index.php' => '',
                     'services.php' => '',
                     'portfolio.php' => '',
                     'links.php' => '',
                     'contact.php' => '');

$class[$scriptname] = ($scriptname == 'contact.php' ? 
                                ' class="highlight no-pad"' : 
                                ' class="highlight"');

echo <<<EOT
  <li><a href="index.php"{$class['index.php']}>home</a></li>
  <li><a href="services.php"{$class['services.php']}>services</a></li>
  <li><a href="portfolio.php"{$class['portfolio.php']}>portfolio</a></li>
  <li><a href="links.php"{$class['links.php']}>links</a></li>
  <li><a href="http://www.preciseformwork.co.uk/wordpress">blog</a></li>
  <li><a href="contact.php"{$class['contact.php']}>contact us</a></li>
EOT;

?> 
</ul> 
</div>
    Using an associative array with the filename (scriptname) as the key and empty values, you can then assign a class by referring to the array element by the scriptname. Then just include the individual array values in the HEREDOC. (Note the use of curly brackets.)
     
    share
    + Quote Reply
  7. Dal123, Aug 12, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #7
    Thanks a lot for help on this people.
    I want to learn php, and would really like to integrate it on this site. Thanks :D.
     
    share
    + Quote Reply
  8. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #8
    It's all gone FUBAR!

    Been trying this for quite a while now and cannot seem to get it back to normal.
    What I think is happening is that my css is not applying the 'class' tag. From my amateur eye my php looks good, it's not showing errors and my page is loading :). However the script is not showing what page we are currently on in the nav bar at the top, and since incorporating the script the final item in my list, which has a class 'no-pad' applied to it - which removes all the padding out of the item and floats it to the right to make the nav-bar seem neat and universal.
    Since using this script the nav-bar is ruined and contact us goes on the next line. So it's gotta be an issue of applying class tag. Am I applying it correctly with my script? I have noticed with the developer toolbar that we have an empty list (pictured) <li> but I think this may be the final list item just where it overlaps on next line, I have checked my code and there are no empty li tags.
    Can anyone see anything wrong with my code? I can't be trying new methods now as I've spent over a week on this and need to get it done.
    PHP:
    <?php
    $scriptname     = end (explode('/',_FILE_));
    echo     '<li>';
        if (    $scriptname == 'index.php') {
            echo     '<a href="index.php" class="highlight">home</a>';    
        } else {    
            echo     '<a href="index.php">home</a>';
        }    
    echo     '</li>';
    echo     '<li>';
        if (    $scriptname == 'services.php') {
            echo     '<a href="services.php" class="highlight">services</a>';    
        } else {    
            echo     '<a href="services.php">services</a>';}    
    echo     '</li>';
    echo     '<li>';
        if (    $scriptname == 'portfolio.php') {
            echo     '<a href="portfolio.php" class="highlight">portfolio</a>';    
        } else {    
            echo     '<a href="portfolio.php">portfolio</a>';}    
    echo     '</li>';
    echo     '<li>';
        if (    $scriptname == 'links.php') {
            echo     '<a href="links.php" class="highlight">links</a>';    
        } else {    
            echo     '<a href="links.php">links</a>';}    
    echo     '</li>';
    echo     '<li><a href="http://www.preciseformwork.co.uk/wordpress">blog</a></li>';
    echo     '<li>';
        if (    $scriptname == 'contact.php') {
            echo     '<a href="contact.php" class="no-pad">contact us</a>';    
        } else {    
            echo     '<a href="contact.php" class="no-pad">contact us</a>';}    
    echo     '</li>';
    ?>
    </ul>
    </div>
    CSS
    Code:
    .highlight {
color:#FF3300;
padding:0;
margin:0;
}

#nav-list li{
position:relative;
display:inline;
padding:0 2.5em 0 0;
margin:0;
font-family: "Lucidia Grande", "Lucida Sans Unicode", "Verdana", sans-serif;
font-size: 25px;
}
#nav-list li a{
text-decoration:none;
color:#FFFFFF;
margin:0;
padding:0;;
}
#nav-list li a:hover{
color:#999999;
}
#nav-list li a no-pad {
padding:0 0 0 0;
margin:0 0 0 0;
float:right;
}

#nav-list .no-pad {
padding:0 0 0 0;
margin:0 0 0 0;
float:right;
}
     

    Attached Files:

    share
    + Quote Reply
  9. designguy79, Aug 13, 2010

    designguy79 macrumors 6502

    Joined:
    Sep 24, 2009
    Location:
    Michigan
    #9
    I think your problem is that the browser gives precedence of the styling to the contextual rules.

    Change

    HTML:
    .highlight {
    to

    HTML:
    #nav-list li a.highlight {
     
    share
    + Quote Reply
  10. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #10
    Thanks, I did try that originally, and can see that is how it needs to be applied, but it is not working. Even more alarming than that, is the class 'no-pad' is not being applied and it's ruining my nav bar :(.
     
    share
    + Quote Reply
  11. angelwatt, Aug 13, 2010

    angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #11
    The no-pad isn't working because you forgot the . in front of it and it's not joined to the a selector.

    Code:
    #nav-list li a[B][COLOR="Red"].[/COLOR][/B]no-pad {
     
    share
    + Quote Reply
  12. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #12
    Thanks, I've corrected li a.no-pad and still not working. I just can't see where this problem is coming from.:confused:
    Like I said in previous post or two ago, I'm a little concerned that an extra <li> is being inserted but examining my code it doesn't look like it's being inserted. :confused:
     
    share
    + Quote Reply
  13. angelwatt, Aug 13, 2010

    angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #13
    I recommend using Firebug to see what is up. Go to the tag in question and see what styles are being applied to it and overwritten. This will also let you see the current HTML structure that the page has.

    If that doesn't lead you to any results it would help to see your latest code with what you are trying so we can see if there are any other typos.
     
    share
    + Quote Reply
  14. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #14
    Thanks angelwatt, I'm checking it on firebug now.
     
    share
    + Quote Reply
  15. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #15
    I can't see nothing sinister in firebug.
    The nav bar was fine before I started trying to work out the current page. Tried all logical things with this :confused:.
    I have the whole site uploaded as it is at the moment on my current website under the directory new; site is here
    http://www.preciseformwork.co.uk/new/index.php
    I have just bought hosting for the .com but am awaiting my authentication code to transfer the domain from my current hosting provider.
     
    share
    + Quote Reply
  16. angelwatt, Aug 13, 2010

    angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #16
    The CSS is working, you're just not getting the desired effect you want. The Contact Us bit is ending up a line down. Move the class no-pad to the li element.
     
    share
    + Quote Reply
  17. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #17
    Thank-you so much :D :) :)
     
    share
    + Quote Reply
  18. eponym, Aug 13, 2010

    eponym macrumors 6502

    Joined:
    Jul 2, 2010
    #18
    I know very little PHP, but what I've used in the past was pretty effective and a lot simply than a million if statements.

    First you need a function for doing tests in general. It can based on an ID, a parameter, a page whatever...in your case something like this:

    PHP:
    <?php

            $scriptname     = end (explode('/',_FILE_));

            function     testActive($fileName) {
                if(    $scriptname == $fileName) {
                    echo     " class=\"highlight\"";
                }
            }
            ?>
    Then in you nav list:

    PHP:
    <li><a href="index.php"<?php testActive('index.php'); ?>>Home</a></li>
    <li><a href="sales.php"<?php testActive('sales.php'); ?>>Sales</a></li>
    <li><a href="links.php"<?php testActive('links.php'); ?>>Links</a></li>

     
    share
    + Quote Reply
  19. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #19
    Thanks eponym, that looks like a very efficient way of doing it. Unfortunately I cannot get my script to work in seeing what page I'm on. I'm getting an error
    Notice: Use of undefined constant _FILE_ - assumed '_FILE_' in localhost/new/top.php on line 33 and it's not working :(
     
    share
    + Quote Reply
  20. angelwatt, Aug 13, 2010

    angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #20
    There's suppose to be 2 underscores on either side of FILE.
     
    share
    + Quote Reply
  21. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #21
    Thanks, unfortunately still can't get the list page to change colour when the page is being viewed :(.
     
    share
    + Quote Reply
  22. angelwatt, Aug 13, 2010

    angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #22
    You'll need to be more specific if you want help on that. What specifically does not work mean? What is happening? And what code are you currently trying with?
     
    share
    + Quote Reply
  23. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #23
    I want the link in my nav bar to change colour to show what page it is on. So have assigned a.highlight to a different colour and the theory is that it should change colour what page it is on but somethings up.
    I currently have my code:
    PHP:
    <?php
    $scriptname     = end (explode('/',__FILE__));
    echo     '<li>';
        if (    $scriptname == 'index.php') {
            echo     '<a href="index.php" class="highlight">home</a>';    
        } else {    
            echo     '<a href="index.php">home</a>';
        }    
    echo     '</li>';
    echo     '<li>';
        if (    $scriptname == 'services.php') {
            echo     '<a href="services.php" class="highlight">services</a>';    
        } else {    
            echo     '<a href="services.php">services</a>';}    
    echo     '</li>';
    echo     '<li>';
        if (    $scriptname == 'portfolio.php') {
            echo     '<a href="portfolio.php" class="highlight">portfolio</a>';    
        } else {    
            echo     '<a href="portfolio.php">portfolio</a>';}    
    echo     '</li>';
    echo     '<li>';
        if (    $scriptname == 'links.php') {
            echo     '<a href="links.php" class="highlight">links</a>';    
        } else {    
            echo     '<a href="links.php">links</a>';}    
    echo     '</li>';
    echo     '<li><a href="http://www.preciseformwork.co.uk/wordpress">blog</a></li>';
    echo     '<li class="no-pad">';
        if (    $scriptname == 'contact.php') {
            echo     '<a href="contact.php" class="no-pad">contact us</a>';    
        } else {    
            echo     '<a href="contact.php" class="no-pad">contact us</a>';}    
    echo     '</li>';
    ?>
    CSS
    HTML:
    #nav-list {
position:relative;
padding:0;
margin:0;
}



#nav-list li{
position:relative;
display:inline;
padding:0 2.5em 0 0;
margin:0;
font-family: "Lucidia Grande", "Lucida Sans Unicode", "Verdana", sans-serif;
font-size: 25px;
}
#nav-list li a{
text-decoration:none;
color:#FFFFFF;
margin:0;
padding:0;
}
#nav-list li a:hover{
color:#999999;
}
#nav-list li a.no-pad {
padding:0;
margin:0;
float:right;
}

#nav-list .no-pad {
padding:0;
margin:0;
float:right;
}

#nav-list li a.highlight {
color:#33FFFF;
}
     
    share
    + Quote Reply
  24. angelwatt, Aug 13, 2010

    angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #24
    I think it's related to the first line because the highlight class doesn't get applied to list item.
    PHP:
    $scriptname = end (explode('/',__FILE__));
    I suggested a better way earlier for getting at the file name.
    PHP:
    $scriptname = basename(__FILE__);
     
    share
    + Quote Reply
  25. Dal123, Aug 13, 2010

    Dal123 thread starter macrumors 6502a

    Dal123

    Joined:
    Oct 23, 2008
    Location:
    England
    #25
    I did try writing basename earlier but had no idea on how to write it. I spent a couple of hours this evening trying to understand it, and various different commands but unless you have an idea of certain components and how they work it's like trying to read japanesse for me :eek:.
    I have it now exactly how you suggest but it still not highlighting. Thanks for trying though :). Appreciated.
     
    share
    + Quote Reply
(You must log in or sign up to post here.)
Page 1 of 2

Share This Page