7 Quick Joomla! Tips for Developers

02.11.2014
photo by Castles, Capes & Clones/Flickr

If you're doing custom design and development with Joomla! you need all of the tips and tricks you can get your hands on to streamline your development process and make sure you're doing things the correct way.

Here are a few tips & tricks for my Joomla! developer friends.

1. Add CSS stylesheet into the <head> from your template override

JHTML::stylesheet('PATH/TO/STYLESHEET.css');

Ever needed to add a stylesheet from a template override? Probably often, right? The code above will insert a <link> to your stylesheet. You can also link to stylesheets that don't live on your server (e.g., files hosted on a CDN).

2. Add a JavaScript file into the <head> from your template override

JHTML::script('PATH/TO/JAVASCRIPT_FILE.js');

Like stylesheets, you may run into instances where you'll need to add an external JavaScript file to the <head> from within a template override (or custom component view).

NOTE: Make sure to take a look at your source code to see if items are ordered correctly. Many times, you'll need to place a call to the JavaScript Framework that your script depends on just before the call to your script.

For example, if the script that I am including depends on the jQuery framework, my code might look like this:

...

echo JHTML::_('jquery.framework');
echo JHTML::script('components/com_mycomponent/assets/js/my_script_that_depends_on_jQuery.js');

...

Don't worry if you've called the jQuery framework elsewhere in your code, Joomla! will only render it once.

3. Add JavaScript frameworks via JHTML

Joomla! 3.2 has added a bunch of JavaScript Frameworks that you can include in your template.

We'll use some of these directly in our index.php file of our template if we know that every page will need it. Otherwise, you can include these in your custom modules and components—also in any of your template overrides!

//Bootstrap Framework (This will also automatically enable the jQuery Framework in noConflict mode)
JHtml::_('bootstrap.framework')


//jQuery Framework in noConflict mode
JHtml::_('jquery.framework');


//jQuery in normal mode
JHtml::_('jquery.framework', false);


//jQuery UI framework
JHtml::_('jquery.ui');


//jQuery UI with sortable enabled
JHtml::_('jquery.ui', array('core', 'sortable'));


//MooTools Core framework
JHtml::_('behavior.framework', 'Core');


//MooTools More framework
JHtml::_('behavior.framework', 'More');
	

There are a slew of other frameworks that you have access to through Jhtml, check out the Joomla! Docs for more.

4. Display a relative date with JhtmlDate::relative

JHtmlDate::relative($this->item->created);

You'll use this when you want to display a relative time instead of the standard date format. There are two optional arguments that you can pass in (unit and time)—check out the Joomla! API Documentation for additional info.

5. Standard Joomla! form field types

Bookmark this page!

This list comes in handy when you're building that custom module or component. I reference this page a ton.

6. Things to know when upgrading your Joomla! site

Bookmark this page, too!

Ever since Joomla! released version 3, we've been updating our clients' sites. A very tedious task when a site has a ton of custom extensions.

The above page will help you transition your old Joomla! site to a beautiful Joomla! 3 site. I find myself referencing this page constantly during an update.

And as always, BE SURE TO BACKUP YOUR SITE BEFORE UPDATING.

7. Joomla! Component Creator

http://www.component-creator.com/en/

If you haven't already, you need to give this generator a try.

This thing will get you building your new component, literally, in seconds. This has helped us skip all of the legwork that comes with building a template and lets us get into the meat of the development.

Trust me, this tool will help you get started on building a component a million times faster.