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
    Mar 2012
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    dynamic page title & description

    So I have my main php-page (ajax #!) that loads all other html-pages as dynamic content.
    When a dynamic page is loaded the title and description of my main page stays the same.
    How can I display a unique title tag and description for each dynamic page and will that show up in search results as well?

  • #2
    Banned
    Join Date
    Apr 2011
    Posts
    656
    Thanks
    14
    Thanked 69 Times in 69 Posts
    Quote Originally Posted by farout View Post
    How can I display a unique title tag and description for each dynamic page and will that show up in search results as well?
    You can use DOM methods to change the title and description of your main page for each dynamic page as it is loaded.

  • #3
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    Quote Originally Posted by farout View Post
    So I have my main php-page (ajax #!) that loads all other html-pages as dynamic content.
    When a dynamic page is loaded the title and description of my main page stays the same.
    How can I display a unique title tag and description for each dynamic page and will that show up in search results as well?
    The general consensus is that search engines don't read or run javascript when indexing a web page. This means that any dynamic page titles would not be captured. In fact, nor would your AJAX-loaded pages themselves, unless you have a non-javascript fallback - which you should do anyway. Search google for the phrase "progressive enhancement" and give a few sites a read on that topic to understand both why it is important, and why it will benefit you.

    Generally speaking for what you are describing, you would have your main landing page with actual proper links to other pages (not something like href="javascript:..." or href="#" or the like, you would actually want to link to your content like href="/someotherpage.php") so that 1) any actual user who does not have javascript available or enabled can still access your site's content, and 2) search engines can still find and index your content. Your PHP page should provide code for an ENTIRE proper page by default (including the html tags, head, and full body - absolutely everything needed to match your main page's style and serve as a completely independent web page). Then, with proper href attribtes in place on your menu anchor tags you can still use AJAX to call in the content without a page load for those users whose settings support it.

    For one example, on window load you can loop through the menu container and set onclick event handlers on all of the anchor tags present in that menu. The onclick event handler in those cases can trigger an AJAX request function that will check the href of the link that was clicked, append a $_GET variable to the URL to mark it as an AJAX request (e.g. "?ajax=1"), and then query the very same PHP file as before with that slightly modified URL. Now, when the AJAX request marker is present in the URL requested your PHP page can be set up to SKIP outputting everything (html, head, body tags, etc.) EXCEPT the page contents that you want to deliver.

    This way you still get the exact same AJAX functionality in your "best case scenario" while maintaining SEO relevance and basic functionality for the blind, for people without a mouse input device, and for people with javascript either disabled or not available. It's the best of both worlds and only requires a few minor changes on your part to implement it.
    Last edited by Rowsdower!; 03-14-2012 at 01:13 PM.
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. –G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting

  • #4
    Senior Coder DanInMa's Avatar
    Join Date
    Nov 2010
    Location
    Salem,Ma
    Posts
    1,577
    Thanks
    13
    Thanked 248 Times in 248 Posts
    awesome post Rowdowser. im more of an asp /asp.net person, but how do you setup a php page to "SKIP outputting everything except the page contents"? ( not trying to hijack that jsut sounds like a d**n good idea)

  • #5
    Senior Coder Rowsdower!'s Avatar
    Join Date
    Oct 2008
    Location
    Some say it's everything.
    Posts
    2,027
    Thanks
    5
    Thanked 397 Times in 390 Posts
    Quote Originally Posted by DanInMa View Post
    awesome post Rowdowser. im more of an asp /asp.net person, but how do you setup a php page to "SKIP outputting everything except the page contents"? ( not trying to hijack that jsut sounds like a d**n good idea)
    Basically, it would look like this:

    PHP Code:
    <?php
    if($_GET['ajax']!=1){
        
    //check for the AJAX flag being a value of "1" - if not marked as "ajax=1", then we need the html tag, the document head, the body tag, and any header/menu/sidebar items that precede the main content...we also need the main content div, since that wouldn't be included in the AJAX response version...
    ?><!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <title>Full Title of This Page</title>
    </head>
    <body>
    <div id="wrapper">
      <div id="content">
    <?php
    }
    //Now we deliver the page content, regardless of whether or not we are responding to an AJAX request...in the event of an actual flagged AJAX request this section immediately below is ALL that we will get as a response (along with the usual headers, of course)
    ?>
        <h1>This is the page content</h1>
        <p>Lorem ipsum...</p>
    <?php
    if($_GET['ajax']!=1){
        
    //now we add all the standard footer and applicable sidebar content that comes AFTER the main content along with the closing body and html tags to any non-AJAX response...
    ?>
      </div>
      <div id="footer">
        <p>This is a footer.</p>
      </div>
    </body>
    </html><?php
    }
    ?>
    ^ That way, any time the URL leading to the page contains a $_GET variable of "ajax" with a value of exactly "1" then only the page content div's inner section will be sent as response text for the AJAX to use.
    Last edited by Rowsdower!; 03-14-2012 at 10:26 PM.
    The object of opening the mind, as of opening the mouth, is to shut it again on something solid. –G.K. Chesterton
    See Mediocrity in its Infancy
    It's usually a good idea to start out with this at the VERY TOP of your CSS: * {border:0;margin:0;padding:0;}
    Seek and you shall find... basically:
    validate your markup | view your page cross-browser/cross-platform | free web tutorials | free hosting

  • Users who have thanked Rowsdower! for this post:

    DanInMa (03-14-2012)


  •  

    Tags for this Thread

    Posting Permissions

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