Anna's Joomla tips

Tuesday, 03 January 2006
Article Index

Anna's Joomla tips

1-How to think about content management
2-How to organize your site
3-Designing the look of your site
4-Modules and pages
5-Adding text and images
7-Blogs andáYour front page
8-Modules, Components, and Mambots
9-Where is it?

When I say “adding text & images” I’m talking about the central part of the page, not any menu bars, not any of the boxes on the side (like polls, sign-up forms, or news items). Just the central content pane (the “mos_mainbody” you placed in your template). You already organized your site Joomla-style (tip #2), so now you want to create content in the Categories you already have (which are inside Sections you already have).

TinyMCE. Joomla comes with a wysiwyg editor called TinyMCE. To activate it, got to Mambots -> Site Mambots. Unpublish the “No WYSIWYG Editor” and publish “TinyMCE WYSIWYG Editor.” If you know html, I highly recommend putting the TinyMCE editor in “advanced” mode. From Mambots -> Site Mambots, click on the TinyMCE WYSIWYG Editor. On the right, under parameters, you should see a Functionality option – basic means you see no code, while advanced gives you the option of editing the html code directly (and gives you a few more editing icons). I really *highly* recommend the advanced option because of bugs in TinyMCE (for example, hitting B will bold text, but not unbold it, so I once had to go into the html and delete about 57 <strong></strong> tags from a frustrated user).

You can add text & images by adding content (Content -> All Content Items [or choose the category]). The page title will appear at the top of that page. Page alias will appear in the url (if you have sef404 or another search engine friendly component). Your text is split into two panes, the “intro text” and the “main text”. Here's RedSoxCoder's explanation of the two panes:


There are two panes for two reasons: First is the most common one, which is that you can use it to split the article in two parts: intro part for the front page and the real article that links to the 'read more' link, which is the intro + the main content merged together.

BUT there is also an option that lets you split these to all together. That means that you could use the intro part for a seperate piece of text on your front page and the main part for the real article.

Example: You have a site that reviews movies and you have various people writting reviews, but one person editing the front page content. You could write a frontpage(intro) text like "Our critic Mr. X went to see movie XYZ and wrote an exclusive review for our more"
And when you click read more, you'll get the actual review.
Just select 'hide intro text' on the parameters.

Very exciting option that gives much more functionality to the two panes concept.

Thanks, RedSoxCoder! (Go Sox!)

Images. I once spent two hours just trying to place an image in the content. I couldn’t find it anywhere in the Mambo help pages; no one would answer my question in the forum; everything I tried didn’t work. So I will save you that pain – read on!

First you need to upload your images into the Media Manager. It’s under Site -> Media Manager, and it’s pretty obvious how to use it to upload files. Just remember that while the “browse” button is below the files icons, the “upload” button is above in the toolbar. Same with creating directories – create below, hit the “create” button above.

Once you have your images uploaded, you can insert them from any content item. Things not to do:

• Don’t use TinyMCE to insert pictures. To do that you have to go back to the Media Manager, get the address, copy/paste it into the box, and in my version there’s a bug, so once you do all that the html code is garbled and you have to go into the code and fix it.
• Don’t try to drag and drop images from the “images” tab into your wysiwyg editor. Though this appears to work, what you see is not what you will get. It only inserts thumbnails into the content, so when you look at the actual page on your site, tiny little images will appear instead of the regular image.

There is a MAGIC BUTTON that you have to click for anything to work. That magic button is – not in the editor, where you might think, and not in the “images” tab either. Below the editor, there are two little flowers, one with an “I” and one with a “P”. When you mouse over them, there is no help text to tell you what they’re for. Click on the “I”. It will insert the following text into your content: . Once you do that, the “images” panel on the right is suddenly useful! Thank the gods. Now go to that panel and find your image. When you click on the “add” button, that image is listed below under “Content Images.”

Each time you click the MAGIC “I” button, will appear in the text editor. It will not show the image, or tell you which image is there. If you have more than one image, the images will display in the order they are listed under “Content Images.”

What is ?As I understand it, mos_image is a mambot that places images in the content. For more on mambots, see tip #8. According to tudorilisoi, there is also another mambot called mosthumb for doing this that you might want to use -- for more info, visit his post at

A tip from Vizar:


After much testing and searching, i found a perfect solution: use MosCE instead. Using this u can include images directly to the text and see them as they will appear in the end result (unlike the {mos_img} place-code), and it has a lot of extra options. U can even adjust the look and feel of the editor via its config component.

To make this work, u have to upload you pictures with the image manager (or rather use JoomlaExplorer) to the images/stories folder (and optional subfolders under that) to see and use the pictures in MosCE

Thanks for the tip!

So now you have content – great! Now on to linking up your pages.
Next tip: Linking.

Comments (5)
RSS comments
1. thanks22-02-2007 23:13

This was a great guide, why couldn't it have been part of the official Joomla documentaion! I learned enough to finish off quite a few things that I missed since I didn't know the context and conventions of Joomla. Thanks again!

2. Excellent17-10-2007 14:00

When is your book coming out?  
"joomla/mambo EXPOSED"....really.  
Please let me know. 
Thanks for your "unique" real world approach as well as  
your great insight.

3. Thanks!26-10-2007 15:21

I appreciate you taking the time to provide "traditional hand-crafted web pages" vs. Joomla perspective. I am beginning to get my head around Joomla thanks to your time and efforts.

4. Nice tutorial.26-11-2007 10:57

HI Anna ! 
This is anand, last two days i am following your tutorial. 
It is very good for the beginner, It is very useful to me. Now I joomlafying 
a website, already well designed and running. Can you tell be the better approach ? 
And one more question for you, how can i place my 
menu in a desired location, sorry if my question is wrong. 
Thx in Advance, 
Anand kumar.

5. Thank a lot18-04-2008 08:28

I am a new címer and I have a lot of confusions on PAGE/Front page. 
After reading, now I understand more how Joomla works. 
Thank you for your writing! 
Good Job! 
Adidaphat :(

Write Comment
  • Please keep the topic of messages relevant to the subject of the article.
  • Please don't use comments to plug your web site. Links are rel='nofollow'-ed
  • Please refresh the page if you're having trouble with the security image code

:) :grin ;) 8) :p
:roll :eek :upset :zzz :sigh
:? :cry :( :x
Code:* Code

Powered by AkoComment Tweaked Special Edition v.1.4.2

Last Updated ( Saturday, 05 January 2008 )
Post and Bid on Joomla/PHP projects! Join for free!


Subscribe to TeachMeJoomla's newsletter

Joomla books

Auto tags


joomla menu bars

add button tinymce joomla

joomla editor readon button

joomla how to add text to image

joomla pane tab activate

no wysiwyg insert image mambot joomla

TinyMCE not working on main text joomla

"intro text" code joomla