Tech Tee Shirts Explained »

Tutorial on How to create a Simple Joomla Plugin

For the purpose of this tutorial example, we will create a Joomla plugin that will alter the title tag of pages of a Joomla website.

The text surrounded by the title tags in the HTML code is what the browser will display in the browser window frame and browser tabs.

By default, Joomla sets the title tag to be the title of the article being displayed. We want to create a plugin that will append our site name at the end of the title as in ...

For the purposes of this example, the site name is "Demo Joomla Site".

Do Not Modify Core Joomla Code

The core Joomla code that controls the output of the title tag is found in ...
libraries/joomla/document/html/renderer/head.php
as described in previous tutorial.

However, it is not considered good practice to alter this file here. Because an Joomla upgrade may wipe out your changes to that file. Altering core Joomla files to get the behavioral changes you want is sometimes known as a "hack".

Better to Create a Joomla Plugin

Instead a better way is to create a Joomla plugin that will add our site name to this output without modifying the Joomla core code. Because we are inserting new files into the system and not altering any existing Joomla files, this is known as an "non-invasive" method. We will call our plugin "SiteNameInTitle".

1. Plugins can be in any of the nine plugin groups shown below in the Joomla file system.

We will put our plugin into the "system" group. So we create two files (sitenameintitle.xml and sitenameintitle.php within the system folder on our local computer (not on the webhost yet). I like to keep all the characters of the filename in lowercase.

2. The sitenameintitle.xml is the plugin installer file. Make it look similar to the following with your own relevant information.

The name of our plugin is high lighted in the above. Also note that we put group="system" and the reference to our second file sitenameintitle.php

3. For our second file sitenameintitle.php, we put the following ...

We create a class plgSystemSiteNameInTitle which extends JPlugin. The class name is constructed by convention to start with plg to indicate a plugin followed by the plugin group and by the plugin name.

4. Inside the class, we have a function onAfterDispatch() to handle the event.

First we get our document object by ...
$document = & JFactory::getDocument();
We need this to access our title.

We handle the event onAfterDispatch by setting the document title to whatever the document title is currently suffixed by the site name ...

$document->setTitle($document->getTitle() . ' - ' . $mainframe->getCfg('sitename'));

We use $document->getTitle() to get our current title. We concatenate it with a hypen. And we get the site name as configured in the Joomla administrator via $mainframe->getCfg('sitename')

Then we use $document->setTitle to set the new title.

5. Now zip the two files up into a zip file called sitenameintitle.zip

6. In your Joomla Administrator -> Extensions -> Install, browse to pick up the sienameintitle.zip and click Upload File and Install

7. You should see "Install Plugin Success". Note the plugin description from the XML file is also shown here.

Joomla has just unzipped the two files sitenameintitle.xml and sitenameintitle.php into the plugins/system folder on your webhost.

8. In Extensions -> Plugin Manager, find your new plugin and enable it.

9. Refresh your browser and see that site name is now added to the title tag...

Notes:

We can not remove the text "Mozilla Firefox" that you see in the browser frame because that is put there by the browser and not controlled in the title tag HTML code.

This tutorial refers to Joomla version 1.5.14.

Download Example Joomla Plugin

You can download the sitenameintitle.zip by right-clicking on the link and saving to disk. We make no warranties and assume no liability. This plugin is for Joomla version 1.5.14.

Practice Exercise

Since LearnWebDesignOnline is a learning site, here is an exercise for you to try. See if you can modify the above Plugin to also display the Section and Category in the title tag. Hint: See this tutorial for how to retrieve the category and section of an article. Answer to this exercise is found at the bottom of this page.

More Resources on Creating Joomla Plugins and Extensions

  • Chapter 6 "Plugin Design" from the book Mastering Joomla 1.5 Extension and Framework Development
  • Chapter 9 "Behind the Scense: Plug Ins" from the book Learning Joomla! 1.5 Extension Development
  • Chapter 13 "Creating Extensions" from the book Beginning Joomla!, Second Edition (Beginning from Novice to Professional)

Answer to Practice Exercise

To modify the plugin in order to display the category and section in the title tag, make the following changes...

Here is the complete code for the plugin class ...


class plgSystemSiteNameInTitle extends JPlugin
{
function onAfterDispatch() {
global $mainframe;

$document = & JFactory::getDocument();
$docType = $document->getType();

// Only modify site pages that are html docs (no admin, install, etc.)
if ( !$mainframe->isSite() ) return;
if ( $docType != 'html' ) return;

// get article id
$articleId = JRequest::getVar('id');
if ( strpos($articleId,':') > 0 ) {
$articleId = substr($articleId,0,strpos($articleId,':'));
}

// find section and category of this article
$sectionTitle = '';
$categoryTitle = '';
if ( $articleId != '' ) {
$query = 'SELECT s.title as sectiontitle, cat.title as cattitle FROM #__categories AS cat, #__content AS c, #__sections AS s WHERE c.id = ' . $articleId . ' AND c.catid = cat.id AND c.sectionid = s.id';
$db =& JFactory::getDBO();
$db->setQuery($query);
$dbResult = $db->loadAssoc();

$sectionTitle = $dbResult['sectiontitle'];
$categoryTitle = $dbResult['cattitle'];

}

$document->setTitle($document->getTitle() . ' : ' . $categoryTitle . ' : ' . $sectionTitle . ' - ' . $mainframe->getCfg('sitename'));
return true;
}

}

In the results, you should see the category and section in the title as in here ...