SitePoint Sponsor

User Tag List

Results 1 to 16 of 16

Hybrid View

  1. #1
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    PHP active links

    how do I make a link show as active using php

    I have an image for the rollover, and image for the page

    I know I need to put this at the top:
    <?php $pageName = "fire"; ?>


    But then how do I get an image to change when it gets to the "fire" page?

    <a href="fire.php" <?php if ($pageName=="fire") echo 'id="imagegoeshere?"'; ?>></a>
    Opportunity favors the prepared mind.

  2. #2
    SitePoint Zealot
    Join Date
    Dec 2006
    Posts
    182
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Rollovers would be handled by JavaScript. For the image you want to change, is it an actual <img src=""/> or is it in CSS? Can you provide you code as it is?

  3. #3
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by funkdaddy View Post
    Rollovers would be handled by JavaScript. For the image you want to change, is it an actual <img src=""/> or is it in CSS? Can you provide you code as it is?
    I'm not confused about a rollover. I want the active link. change from image1 to image3 when at the page

    image2 is the rollover, and isn't part of the argument here
    Opportunity favors the prepared mind.

  4. #4
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by funkdaddy View Post
    Rollovers would be handled by JavaScript. For the image you want to change, is it an actual <img src=""/> or is it in CSS? Can you provide you code as it is?
    Yes, it would be <img src="images/image3.gif"/>
    Opportunity favors the prepared mind.

  5. #5
    SitePoint Zealot
    Join Date
    Dec 2006
    Posts
    182
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Something like this might be what you're looking for:
    PHP Code:
    <?php
    $page_name 
    'home';
    ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
        <head>
             <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>Test Page</title>
            <style type="text/css" media="screen">
                #nav.li {
                    list-style: none;
                    padding-left: 30px;
                    background: url(images/default.png) no-repeat 0 50%;
                }
                body.home      #nav .home,
                body.aboutus   #nav .aboutus,
                body.contact   #nav .contact {
                    background-image: url(images/selected.png);
                }
            </style>
        </head>
        <body class="<?php echo $page_name ?>">
            <ul id="nav">
                <li class="home"><a href="home"></a></li>
                <li class="aboutus"><a href="aboutus"></a></li>
                <li class="contact"><a href="contact"></a></li>
            </ul>
        </body>
    </html>

  6. #6
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by funkdaddy View Post
    Something like this might be what you're looking for:
    PHP Code:
    <?php
    $page_name 
    'home';
    ?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
        <head>
             <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
            <title>Test Page</title>
            <style type="text/css" media="screen">
                #nav.li {
                    list-style: none;
                    padding-left: 30px;
                    background: url(images/default.png) no-repeat 0 50%;
                }
                body.home      #nav .home,
                body.aboutus   #nav .aboutus,
                body.contact   #nav .contact {
                    background-image: url(images/selected.png);
                }
            </style>
        </head>
        <body class="<?php echo $page_name ?>">
            <ul id="nav">
                <li class="home"><a href="home"></a></li>
                <li class="aboutus"><a href="aboutus"></a></li>
                <li class="contact"><a href="contact"></a></li>
            </ul>
        </body>
    </html>
    Hi- I tried this with css and couldn't get it to work. Why the list? I guess this is way harder than I thought
    Opportunity favors the prepared mind.

  7. #7
    Twitter: @AnthonySterling silver trophy AnthonySterling's Avatar
    Join Date
    Apr 2008
    Location
    North-East, UK.
    Posts
    6,111
    Mentioned
    3 Post(s)
    Tagged
    0 Thread(s)
    Maybe this is what you're looking for?
    PHP Code:
    <?php $sCurrentPage basename($_SERVER['SCRIPT_FILENAME']); ?>
    <ul id="nav">
        <li class="home" <?php if($sCurrentPage === 'home.php') echo 'id="active"'?>>
            <a href="home.php"></a>
        </li>
        <li class="aboutus" <?php if($sCurrentPage === 'aboutus.php') echo 'id="active"'?>>
            <a href="aboutus.php"></a>
        </li>
        <li class="contact" <?php if($sCurrentPage === 'contact.php') echo 'id="active"'?>>
            <a href="contact.php"></a>
        </li>
    </ul>
    @AnthonySterling: I'm a PHP developer, a consultant for oopnorth.com and the organiser of @phpne, a PHP User Group covering the North-East of England.

  8. #8
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by SilverBulletUK View Post
    Maybe this is what you're looking for?
    PHP Code:
    <?php $sCurrentPage basename($_SERVER['SCRIPT_FILENAME']); ?>
    <ul id="nav">
        <li class="home" <?php if($sCurrentPage === 'home.php') echo 'id="active"'?>>
            <a href="home.php"></a>
        </li>
        <li class="aboutus" <?php if($sCurrentPage === 'aboutus.php') echo 'id="active"'?>>
            <a href="aboutus.php"></a>
        </li>
        <li class="contact" <?php if($sCurrentPage === 'contact.php') echo 'id="active"'?>>
            <a href="contact.php"></a>
        </li>
    </ul>
    Yes, probably something like this but I don't know how to put in an image unless the image is defined in css style "active", which I'd rather not do, or at least was thinking I wouldn't have to do
    Opportunity favors the prepared mind.

  9. #9
    SitePoint Addict
    Join Date
    Apr 2007
    Posts
    300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is what I would do. Use the nav images as background set in css and not as inline images. Use css and not js for this. Setup styles for normal state and then over ride them by introducing an id say id="active" for the active state using another set of rules. That will be it for css.

    Now for php have a multidimensional array which contains information about the links for each pages as below.

    Code:
    $pages = array(
    
                           'index' => array('href' => 'index.php', 'title' => 'Home', 'text' => 'Home')
    
    );
    The primary key will be the name of the page. The loop through this array and build the nav on the fly and insert id="active" when the primary key matches with the name of the page and print it.

    Advantages of this script is that you DO NOT need to add anything to individual pages apart from including this script in all pages. It gives you one spot from where you can control the nav on all pages that is truly independent.

    Let me know if you need any further clarification on anything.

  10. #10
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by semantic7 View Post
    Here is what I would do. Use the nav images as background set in css and not as inline images. Use css and not js for this. Setup styles for normal state and then over ride them by introducing an id say id="active" for the active state using another set of rules. That will be it for css.

    Now for php have a multidimensional array which contains information about the links for each pages as below.

    Code:
    $pages = array(
    
                           'index' => array('href' => 'index.php', 'title' => 'Home', 'text' => 'Home')
    
    );
    The primary key will be the name of the page. The loop through this array and build the nav on the fly and insert id="active" when the primary key matches with the name of the page and print it.

    Advantages of this script is that you DO NOT need to add anything to individual pages apart from including this script in all pages. It gives you one spot from where you can control the nav on all pages that is truly independent.

    Let me know if you need any further clarification on anything.
    Thanks. I guess my confusion lies in why I would need to make the images in the css. I was trying to avoid that. I actually do have code working for a css but it seemed more complicated than necessary, and worst of all, I could not edit in a page layout program (css doesn't display nicely in layout view).
    Opportunity favors the prepared mind.

  11. #11
    SitePoint Addict
    Join Date
    Apr 2007
    Posts
    300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Two reasons.

    Many people have js disabled for security reasons. Your site navigation would fail under such circumstances. The navigation of a site should be able to survive under very minimal support.

    The images should not be included inline unless they are part of the content. All styling should be moved to css. This will help with complete separation of styling and content. This is good because lets say you decide to reskin the site you don't have to touch the html. The second being accessibility. When the site is accessed by search engines or interpreters for disabled people it will be a lot easier for them since they don't use css and will be able to access content only without any hindrance from styling.

  12. #12
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by semantic7 View Post
    Two reasons.

    Many people have js disabled for security reasons. Your site navigation would fail under such circumstances. The navigation of a site should be able to survive under very minimal support.

    The images should not be included inline unless they are part of the content. All styling should be moved to css. This will help with complete separation of styling and content. This is good because lets say you decide to reskin the site you don't have to touch the html. The second being accessibility. When the site is accessed by search engines or interpreters for disabled people it will be a lot easier for them since they don't use css and will be able to access content only without any hindrance from styling.
    Thank you. I didn't know that about js. But do you find it odd that of the 100 or so sites I've created using js, I haven't had one complaint about navigation not working?
    Opportunity favors the prepared mind.

  13. #13
    SitePoint Wizard
    Join Date
    Nov 2005
    Posts
    1,191
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Chri View Post
    But do you find it odd that of the 100 or so sites I've created using js, I haven't had one complaint about navigation not working?
    No, but I do find it strange that you've created 100 sites and not yet learned something so basic as if()

  14. #14
    SitePoint Evangelist
    Join Date
    May 2005
    Location
    Houston, Texas, USA
    Posts
    418
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by hash View Post
    No, but I do find it strange that you've created 100 sites and not yet learned something so basic as if()
    What ARE you talking about?
    Opportunity favors the prepared mind.

  15. #15
    SitePoint Wizard bronze trophy
    Join Date
    Jul 2008
    Posts
    5,757
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Chri View Post
    Thank you. I didn't know that about js. But do you find it odd that of the 100 or so sites I've created using js, I haven't had one complaint about navigation not working?
    Don't make the assumption those users care enough to tell you. Most of them made an active decision to disable javascript, and sites which fail to work get the back button.

  16. #16
    SitePoint Addict
    Join Date
    Apr 2007
    Posts
    300
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No because when your site is broken people will leave and not look around for a means to inform you. If you have a good tracker installed you can precisely see how many people surf with js disabled.

    Quote Originally Posted by Chri View Post
    Thank you. I didn't know that about js. But do you find it odd that of the 100 or so sites I've created using js, I haven't had one complaint about navigation not working?


Bookmarks

Posting Permissions

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