Adding Joomfish functionality to custom components

The "J1.5" namespace is an archived namespace. This page contains information for a Joomla! version which is no longer supported. It exists only as a historical reference, it will not be improved and its content may be incomplete and/or contain broken links.

This tutorial shows how make your custom components work with Joomfish 2.0. Joomfish is an extension for Joomla, that allows you to manually translate all your Joomla content. When installed, it works with all native Joomla content, but if you develop a custom component, you have to code a little bit yourself.

I will use the custom component from the Developing a Model-View-Controller Component as example. Install the component available for download in part 4 of the tutorial, and we're ready to go.

Creating the Content Element XML file for Joomfish

Joomfish uses XML files to know how to translate content elements. These content element XML files are located in administrator/components/com_joomfish/contentelements. All you have to do is make a new XML file and save it into this directory, and Joomfish will know how to translate the component. Let's explain how to build this new XML file step-by-step:

First, create a new XML file in your favourite code editor and save this as hello.xml in the contentelements folder. It is important that the XML file is named exactly as the component, and because our component is called com_hello, we call the file hello.

Write the following in the new XML-file:

<?xml version="1.0" ?>
<joomfish type="contentelement">
<author>Rune Skjoldborg Madsen</author>
<description>Definition for the Hello World component</description>
<reference type="content">
    <table name="hello">
        <field type="referenceid" name="id" translate="0">ID</field>
        <field type="titletext" name="greeting" translate="1">Greeting</field>

The first 6 lines are just simple information to Joomfish. We declare the XML version, tell Joomfish that it's a new content element to translate, Tell the name of the component, the author name the version of the component, and a small description.

It is inside the <reference> tags we tell Joomfish what to translate. Inside the reference tags, we tell Joomfish what table to translate from. In our example, the Hello Component use a table called jos_hello, and therefore we write the following:

<table name="hello">

Inside the table tag, we have 2 field tags. The first tells Joomfish, that our column "id" is the primary key, and we set translate to 0, because we don't want the use to be able to translate the id of the greeting:

<field type="referenceid" name="id" translate="0">ID</field>

The next field tag is of the type "titletext", which tells Joomfish two things: 1) that the "greeting" column in our MySQL table holds data from a simple input field 2) That the "greeting" column should be used as the "title" field in the Joomfish component in the admin section. Offcourse we set the name corresponding to our MySQL column "greeting" and we also set the translate property to true:

<field type="titletext" name="greeting" translate="1">Greeting</field>

To get a definition of which fielstypes are available in Joomfish (such as "titletext, "text", so on), read the Creation of Content Elements tutorial. Now our component is ready for Joomfish translation, and we just need to fix some MySQL queries to make everything work.

Fixing MySQL queries in the hello component

When dealing with Joomfish, you always have to select your primary field when you do a query. Even though you don't actually use it, Joomfish needs it to be able to do the translation.

Open up the model file located in components/com_hello/models/hello.php. Find the following line:

$query = 'SELECT greeting FROM #__hello';

And replace it with:

$query = 'SELECT * FROM #__hello';

By doing this we also select the "id" column that Joomfish needs to translate the greeting.

And that's it! All you need is to go into the Joomfish Admin section and translate the greetings to whatever languages you have installed and activated. It's as easy as that.

Remember that the component only selects and shows the first greeting no matter what. If you want to see all greetings, you have to use the loadAssocList() function instead of the loadResult() function in the same model file as above. Then you're able to loop through the rows array in your view template file.