Guides & Tutorials

Technology tutorials, technology guides and more

Joomla Beginner Mistakes and How to Avoid Them

Joomla is great because it empowers even non-designers to manage their sites themselves. The problem is that those customers, in their effort to run the site without bothering you, make mistakes.

Links to outside sites open in the same window

There’s a very simple rule here: all links to external sites should open in a new window, not the same window. You don’t want to lose that person forever. All HTML editors have the capability to choose “new window” when creating links. If you are linking inside the site however, you should usually open the link in the same window (this is the default).

External site: New window.
Your own site: Same window.

File names should be descriptive

Also a great way to get free traffic from Google when people search for images of a mickey mouse -> mickey_mouse.jpg

Do not call the images “1.jpg”, “2.jpg”, "mickey_1.jpg". It will make it hard to find, and search engines won’t know what to make of them. It’s also easy to know what the image is without having to open it, and a great way to get free traffic from Google when people search for images of a mickey mouse.

Resizing images

One big flaw of Joomla is no ability to resize images; that’s your job. Of course, you don’t need to resize the image. You could upload a gigantic image and resize it on the HTML Editor interface by dragging the corners. But large images take longer to load, and that picture will still load as a large image. Speed is important, so if you want to keep your site speed down, you must resize the image before you upload. There are many tools for resizing images. www.shrinkpictures.com is a good one for beginners but any image editing software, such as Fireworks, can do the job too.

Having spaces in file names

mickey_mouse.jpg and not mickey mouse.jpg

When you create a file, any file, be sure to use underscores instead of spaces.

Use a space and it will be replaced with “%20“ when the browser reads the file. This creates a messy code and can create unpredictable problems.

Placing all images in the same folder

Joomla allows you to create new folders according to topic under the images/stories directory. Keep your images organized by topic. And of course, no spaces in the folder names!

Some HTML editors will let you do this on the spot, when adding an article, but the default HTML editor that comes with Joomla, won’t. So you’d have to go to site->media manager and add a new folder there.

Not using the available heading for text formatting

Every template has a style sheet file (CSS file) with headings for formatting. The title of your article is already formatted by Joomla but the rest of the article usually needs some more headings to break the block of text.

The wrong way is to highlight the title, choose a font, choose a color, choose a size, click the bold button, and center it. It works but it creates messy code and it’s hard to maintain. If you wanted to make all the titles inside the articles green, not bold and in Arial font, for example, you’d have to open each article and make each change manually. That could take a while.

The right way to format text inside your articles is to use headings. This will create clean code and if you decide to change the way the headings look, all you’d have to do is open the CSS file and make the change once. (That’s not for beginners but you will get there eventually).

Typing directly into Joomla

When you login to your Joomla admin, you start a session. The length of the session is set to 15 minutes by default but can be changed on the global configuration page. Start typing an article directly into Joomla then and your session will end before you’re finished writing. When you try to save your work, you’ll lose it. The solution is simple: write it in Word, save it, then copy and paste it into Joomla.

Copying directly from a Word document to Joomla

This is a very big mistake that can take your site down. Creating your site’s copy in Word is a very good idea but copying from Word directly into the Joomla HTML editor produces messy, bloated code that Google hates and which can mess up your site. The solution is simple: strip out the code by copying the text into Notepad first, then copy from Notepad into Joomla. Notepad is easy to find on your PC under “accessories”.

Adding underline to text that is not a link

Text should only be underlined if it’s a link. People are used to clicking on underlined text. They see an underline so they assume it’s a link. If you need emphasis, use bold, italics, a different color, all caps, or a bigger size. But don’t use underline.

Hard coding links

The wrong way is to find the article on your site, copy the URL from the browser window and use this link when creating a hyperlink. It’s messy, and if you move your site, change the article’s title or change your SEF extension, you’ll be in trouble.

The right way is to use the HTML editor to link to the article or menu item. The HTML editor will know the right URL to use in a way that doesn’t mess up your site. Make sure you always choose “relative” in the HTML editor settings, if available. The basic Joomla HTML editor doesn’t allow you to do this the right way, choose an HTML editor that does.

If you follow these practices when working on your Joomla website, you’ll be in an excellent shape, and in time, all this will become second nature. Remember, we all started at the same place you are today, and we all made the exact same mistakes.