Home arrow PHP arrow Page 3 - Standards-compliant Link Targets with Wordpress

JavaScript link targets - PHP

Wordpress is an extremely popular site blogging software written in PHP. It does a great job of creating standards-compliant web sites. Plus it’s a good idea to continue with that effort when adding modifications.

TABLE OF CONTENTS:
  1. Standards-compliant Link Targets with Wordpress
  2. Dynamically adding rel=’no follow’
  3. JavaScript link targets
  4. Putting it all together
By: Nilpo
Rating: starstarstarstarstar / 4
December 19, 2007

print this article
SEARCH DEV SHED

TOOLS YOU CAN USE

advertisement

Recent XHTML standards have depreciated the use of the target attribute for controlling link targets.  Pages containing this attribute will no longer validate.

The reasoning is that modern browsers give the user the ability to open links wherever they want and that web developers should leave the decision up to the reader.  While I don’t completely disagree with that philosophy, I choose not to send my visitors away when sending them to other sites.

As a courtesy, you might consider notifying readers whenever a link opens a new window.

To get around the limitations imposed by the new standards, you can use a JavaScript to target your links.  This prevents hard coding the target attribute into your page.  The validator is happy and your links still target wherever you want them to.

The JavaScript that performs this task is actually pretty simple.  To begin, you need to create a function and gather all of the links on your page.

/*<![CDATA[*/

function outboundLinks() {

   if (!document.getElementsByTagName) return;

   var anchors = document.getElementsByTagName("a");

The first line of the function checks to make sure that the getElementsByTagName function is supported by the current browser.  If it isn’t, the function simply exits before any errors are generated.  The second line searches the document tree for any link elements (<a>) and returns those objects as an array.

   for (var i=0; i<anchors.length; i++) {

       var anchor = anchors[i];

       if (anchor.getAttribute("href") &&

          anchor.getAttribute("rel") == "nofollow") {

              anchor.target = "_blank";

       }

Next, a "for" loop iterates through each of the array elements and checks for any links that contain both a valid destination and a rel=”nofollow” attribute.  It also adds the target attribute that we need.  Because of our Wordpress plugin, this code will only change external links (since they are the only ones with the rel=”nofollow” attribute.

   }

}

window.onload = function() {

   if (document.body) outboundLinks();

};

/*]]>*/

Finally we close our function and add it to the document’s onload event, so that it is executed whenever the page is fully loaded.

Save this file as external.js and upload it to your web site.



 
 
>>> More PHP Articles          >>> More By Nilpo
 

blog comments powered by Disqus
escort Bursa Bursa escort Antalya eskort
   

PHP ARTICLES

- Hackers Compromise PHP Sites to Launch Attac...
- Red Hat, Zend Form OpenShift PaaS Alliance
- PHP IDE News
- BCD, Zend Extend PHP Partnership
- PHP FAQ Highlight
- PHP Creator Didn't Set Out to Create a Langu...
- PHP Trends Revealed in Zend Study
- PHP: Best Methods for Running Scheduled Jobs
- PHP Array Functions: array_change_key_case
- PHP array_combine Function
- PHP array_chunk Function
- PHP Closures as View Helpers: Lazy-Loading F...
- Using PHP Closures as View Helpers
- PHP File and Operating System Program Execut...
- PHP: Effects of Wrapping Code in Class Const...

Developer Shed Affiliates

 


Dev Shed Tutorial Topics: