Andres Gallo Software Engineer

Add custom content fields to Joomla (Pt 2. On the Front End)

As promised, here is part 2, to the article “add custom content fields to Joomla.” Last monday we discussed the first aspect of adding custom content fields to Joomla which involved all of admin side steps. These steps included adding a field(s) to the administration’s add/ edit article pages, and connecting the new field(s) so that they write to our joomla database. In part two of the tutorial, I am now going to expand on what was covered last time so that we can actually output the information from our new fields.

For those of you who missed part one, you can find the link here.

Please don’t freak out, sections 1 through 4 are on part 1 hehe

Retrieving data from new fields for output

5. Begin by modifying the content component’s view. As this time will be modifying it on the front end, you will need to go to components\com_content\views\article\default.php

An override can be done instead of altering the original file. This is done in your site template where this override is to take place. You can follow the steps for overriding in part one of the tutorial. The only things that will be different are the paths. This time we are creating an override for components\com_content\views\article\default.php instead

Near the end in the default.php file, we find the lines which output the data entered in the articles’ content field.

1 2 3

<?php if ($params->get('access-view')):?>    <?php echo $this->item->text; ?>    <!-- item->text is the default textbox which will duplicate with our field name-->

Lets add our new field right before the default field.

1 2	<?php echo $this->item->japaneseText; ?> <!-- notice I used japaneseText which I have been using for my textbox -->    <?php echo $this->item->text; ?>

If you have other languages installed you can even display one or the other with using a conditional, which is easier to maintain in many circumstances than the built in method of managing languages.

1 2 3 4 5

if(preg_match('/japan/', strtolower($lang->getName()))){     echo $this->item->japaneseText;    } else {     echo $this->item->text;    }

6. Allow Joomla’s front end to read our new field from the database. For this we edit the model in components\com_content\models\article.php

In this file there is a select statement that hooks up the fields for output. Add your new field with prefix ’a.’ In my case for example I add ‘a.japaneseText.’

1 2 3

$query->select($this->getState(     'item.select', 'a.id, a.asset_id, a.title, a.alias, a.title_alias, a.introtext, a.fulltext, a.japaneseText,'   //notice at the end I added 'a.japaneseText'

7. Do the same to the template at components\com_content\views\featured\tmpl\default_item.php, as well as to the model at components\com_content\models\article.php

In the template echo the new field, and on the model add the field to the select statement just as we did on steps 5 and 6.

At this point you are ready to add content to your new fields.

In the xml file we edited on part one of the tutorial, there are other types of fields you can use. Check out some of the other available types of fields to see what else can be added

I look forward to hearing your feedback and suggestions on this topic as well as any tricks on web design.

Share this: