Inserting a Canonical Tag with Joomla

While building my website, I faced a severe issue like you probably are right now. That issue being that there was no way to correctly handle the canonical link tag.  Maybe we should discuss why you need one before I show you how to implement it.

The canonical link tag allows you to specify a preferred page to be displayed during search actions.  While this may sound insignificant, the canonical link tag also tells a search bot that the page you want it to crawl and index is actually the canonical url.  This is important because search engines severely penalize you for duplicate content on multiple pages.  Whenever you have a CMS like Joomla with SEF URLS turned on, each article is accessible through multiple URL's that the search bot may discover including internal redirects or non SEF friendly URLS's.

If you noticed, Joomla has a function to enable the canonical URL function.  This function is broken, or incomplete at best.  Some may argue that it works as designed, but it does not.  The only thing it will accomplish is you have multiple domains.  You can only set the canonical link at the domain level so that you can specify the preferred domain but each webpage is going to incorrectly canonical link itself to the current address.

I have come up with an easy way to add a canonical URL that you have direct control over.  This method requires you to know what you are doing and avoiding mistakes because it may force Google to stop searching and indexing your webpages if applied incorrectly.  We can accomplish this by taking over a relatively unused data field that every article incorporates under the "Publishing" tab.  Under the META DESCRIPTION field you will find the KEY REFERENCE field.  This field is originally intended to store information pertaining to your page's reference. (do not use the external reference field).

By inputting the URL we desire for the article page here, we can control the canonical reference with code later.  You should be aware that you must put a known good URL here.  By adding a URL here, it does not create a new URL for you.  In order to determine what URL to put into this field, you will want to go to your website home page and naturally find this article in a way that most of your visitors do.  If that means you just click a menu item, great do that, but if you have to go to another article to find the link, that's ok too.  Once you naturally end up on the webpage of the article you want to set a canonical link for, just copy the URL and paste it in the KEY REFERENCE data field for that article.  Please keep in mind that a natural link you achieve through a menu item will only be valid for as long as that menu item is still active.  If you delete the menu item that points to your article, you will effectively eliminate the URL used by the menu item and it will no longer be a valid URL.

Once you have the canonical URL set, we need to take care of the code to get it to work correctly.  This code will need to be entered in the article view override stored in your template's folder.  You can generally find it by looking in templates/yourtemplate/html/com_content/article/default.php.

Once you found your file, you can then add the canonical reference code to the top of the file inside of PHP scripts.

$absoluteURL = substr_replace(JURI::root(),'',-1) . $_SERVER['REQUEST_URI'];
$canonicalURL = $this->item->xreference;
if (!empty($canonicalURL) && $canonicalURL != $absoluteURL && stripos($absoluteURL, '?showall=') === FALSE && stripos($absoluteURL, '?start=') === FALSE ){ $doc = JFactory::getDocument(); $doc->addCustomTag( '<link href="' .$canonicalURL . '" rel="canonical" />' ) ; }


Let's breakdown what is happening in that code.  We first define the variable $absoluteURL by running some code to fetch the current url displayed.  Then we define $canonicalURL as the data it collects from the key reference field we mentioned above.  Then perform an if statement to check if $canonicalURL is not empty, if true it goes on to compare the defined canonical url to the current url.  If the two variables do not match, then we check to make sure it is not a url to a particular page of a paginated article.

If the complicated if statement is true, we then call upon JFactory, and use a command to add a tag to the head section of the article webpage.  Bam, just like that you have a working canonical link that YOU can control.  This code will correctly output the canonical url link only if doesn't match the current URL.  Just be sure you extensively test your webpages to be sure it works correctly in your situation.  You can use something like firebug to check the head tags and look for the canonical link.  I would advise to check using GoogleBot as well.  Access the article through different URL's to be sure it works properly.  We can now call upon the canonical url variable to provide direct links for social buttons as well.