joomla!

The template is one of the most important pieces of a website. It provides the appearance, the design. It motivates new visitors to stay on your site and explore. Regular visitors and users appreciate being on a site with a beautiful and useful design. Think of other products, for instance. A car needs a good engine and tires but one of the most important reasons for buying one is often the design. Even if the design is not the main reason, it is often a trigger to contemplate the idea of purchasing and may cause a buyer to consider more tangible reasons. If the design is well-made, people expect the rest to be well-made, too. (Figure 1, Figure 2)!

IN TRANSLATION PROCESS

Joomla! has different levels of configurating options. These options are transmitted from the highest to the lowest level.

• Global configuration
• Options for articles, components, modules, plug-ins, languages and templates

Global Configuration

In the Global Configuration section you can define all the settings that are valid for the entire website. Most values of the variables are saved in the configuration.php file. Vital information like user name, database name and password for the database server, for instance, and 'lesser' parameters such as the pre-determined length of displayed lists are stored in this file. The work area is divided into four tabs:

• Site Settings
• System Settings
• Server Settings
• Permissions
• Text Filter Settings

The work area of every tab consists of dozens of fields, check boxes, switches and text areas.

The easiest way to get a glimpse is to move your mouse across the labels to read the help text, which appears in a small yellow tooltip (Figure 1).

Figure 1: Tooltips

Most of the options are self-explanatory. I'll mention a few settings that are new since Joomla! 1.6 with greater detail.

Site Settings

The Site settings have a new field for setting the default access level for new users. Configurable access levels are a new feature (see chapter Users and permissions) and the default offline page is now configurable with an individual message and an image.

The Metadata settings contain the option to add Content Right data. Joomla! will add your data to the meta declaration rights in your HTML code. Depending on your search engine optimization (SEO) 'religion', it is good or bad to have this declaration in your meta profile. Now Joomla! serves both :-)

<meta name="rights" content="© 2011 cocoate.com EURL, France" />

In SEO settings, the new options are

• Unicode Aliases 
  You set aliases for article titles. With this feature, URLs like http://example.com/所有一起 are possible.
• Include Site Name in Page Titles
  With this feature the site title will appear in the browser's document title bar.

Cookie settings are a wonderful feature for evaluating a cookie on different sub domains. You will need this feature if you have a site (example.com) and one or more sub domains (blog.example.com) and you want to offer your users the service to login on example.com and post on blog.example.com. Without this feature, the user should login again to post something on blog.example.com.

Figure 2: Site settings

System Settings

The user and media settings are no longer in this area. You will now find them in the User and Media Manager.

The cache settings are different because the underlying cache system was rewritten and now provides more possibilities. In general, a cache makes your sites faster by storing parts of the HTML in files. The web server can deliver these files extremly fast. It is possible to cache pages, component views and modules. You can purge and clear the cache in Site → Maintenance.

Server settings

All the server settings are the same as in Joomla! 1.5. Nevertheless, I'll mention the option Force SSL. This option is getting more and more attention. You can offer your users a completely secured traffic. It is necessary to have SSL configured in your web server and you need a SSL certificate.

Figure 3: Server settings - SSL

Permissions

Here is the place to set your global permissions for your user groups. Fortunately, it is not always necessary to change the default settings. If you change the setting for a group, it will apply to this and all sub groups, components and content. Basically you allow, deny and inherit the permissions Site Login, Admin Login, Super Admin, Access Component, Create, Delete, Edit, Edit State, Edit Own and Offline Access. Every group has their own set of permissions (Figure 4). 

Figure 4: Global group permissions

Text Filters

The text filters are a concept, which allows you to search contributed text for patterns like HTML tags and filter them (Figure 5). It's possible to set different filters for different groups. Let's say a registered user is allowed to post text with HTML tags inside but without an iframe. Only your individual group 'iframers' has the right to post iframes! These filters are active for content of the whole website.

Figure 5: Text Filters

Joomla! articles can be categorized. Generally spoken, categorization is the process of recognizing, differentiating and understanding something through abstraction. This may sound rather complicated but proves very useful when managing several articles.

Joomla! offers the possibility of creating as many categories as you wish. It is possible to build nested categories and an article can be related to one of these categories.

Newspapers, for example, use categories to better differentiate between their articles. Here is an example from a Joomla! template (Figure 1).

Figure 1: Gavick Template December 2009

They are using the category World News and under this category there are additional categories like Politics, World, War, Disasters and more. Sometimes two levels are sufficient like in this example; sometimes you may need more. In Joomla! 1.5 it was not possible to have more than two levels. With Joomla! 2.5 you can have as many levels as you want. Joomla! no longer has sections - only categories.

In the Category Manager (Administration → Content → Category Manager), you can manage your category tree and filter up to 10 levels (Figure 2).

Figure 2: Category Manager

Like an article, a category consists of a title, a description and many other attributes and options. It can have an additonal image that can be used in different layouts. The image can be selected in the basic settings. A category can also contain images in the description (Figure 3).

Figure 3: Category Edit Form

When you access your Joomla! website you can see exactly these categories in the example data. The navigation uses links to the categories to show all the articles and sub categories (Figure 4). Even the breadcrumb navigation reflects this structure.

Figure 4: Categories as menu links on the website

In the Menu Manager (Administration → Menu → About Joomla!), you can see these menu items, which link to the articles in a category (Figure 5).

Figure 5: Categories as menu links on the website

You can choose from different layouts for the articles. In Figure 5 you can see which layout is used for which link. You can select the layout in the edit form of a menu item (Figure 6).

Possible layouts:

• a list of all categories
• a blog layout (like on the frontpage)
• a category list

Depending on the layout you have plenty of options to configure the appearance and behavior of sub categories and articles.

Figure 6: Category layouts

A list of all categories

This layout lists all the sub categories from one chosen category (Figure 7).

Figure 7: Layout All Categories

In this case the category description from the top level category Extensions is shown. One level of sub categories with their descriptions is also shown on the page, even empty categories. The articles in the top level category are hidden. Example: Administration → Menus → About Joomla! → Using Extensions → Edit.

A blog layout (like on the frontpage)

The blog layout lists all the articles from one chosen category (Figure 8).

Figure 8: Layout Blog

In this case the category description from the category Components is shown. All the articles related to Components are shown with their teaser text in one column. More columns are also possible. The first seven articles in the top level category are hidden. Example: Administration -> Menus -> Components -> Edit (Figure 9).

Figure 9: Layout Blog settings

A category list

The category list layout lists all the articles from one chosen category in a table structure (Figure 10).

Figure 10: Layout Category List

In this case the category description from the category named Joomla! is shown. All the articles related to Joomla! are shown in a configurable table. You can choose to have parts of the table hidden and various sorting options are available. Example: Administration → Menus → Components → Article Category list → Edit.

Conclusion

The category system introduced is very powerful and easy to use. You can easily structure your entire website by using a set of nested categories in a very user-friendly way. One article can be assigned to one category.

IN TRANSLATION PROCESS
In Joomla! your content can have several statuses. Depending on the type of content there can be a minimum of three statuses: published, unpublished and trash. What does that mean? After saving your fresh content for the first time, it exists in the Joomla! database and depending on its status, it will appear (or not) in different areas of your website.
The usual life cycle of content in Joomla! is:

1. unpublished until you are finished with editing and reviewing
2. published or scheduled (and possibly featured on the frontpage)
3. still published but may be removed from the frontpage
4. archived

Sometimes it is necessary to unpublish content and sometimes you may put it into the trash. The content itself will, of course, continue to exist. It has not been deleted. You can filter most of the tables in the administration interface by the desired statuses and assign different statuses to your content as often as you would like.
Unpublished
No website visitor is able to see the content. It is the phase in which you edit and review your content.
Published
It depends on the users’ and visitors’ permissions whether they will be able to view the content but generally the content on your website should be visible because it has been published!
Featured
The featured 'feature' is a switch you can use for your most important and latest content and is usually shown at the frontpage. It is an additional status because it is only relevant to articles. This is why it is possible for an article to be unpublished and featured.
Archived
There will come a time when you'll start thinking about an archive for your articles. Just set the status to archived and you've almost created an archive. Joomla! knows the creation date of your articles and offers an archive module to be shown on your site. The archive module is included in the example data. If it is not available, just create one in Modules → New →Archived Articles. Your articles will then be shown like in Figure 1. Read more in chapter Modules.
[flickr-photo:id=5393219969,size=-]
Figure 1: Joomla! Archive
Trash
The second last status is trash. If a content item ends up here, it still exists and can be retrieved. You can place modules, menu items, categories, articles, contacts, and even more content in your trash. You can see the contents of your trash can by filtering it (Figure 2). In the filtered view the Trash icon changes to Empty trash. This is your opportunity to delete content.
[flickr-photo:id=5393817554,size=-]
Figure 2: Trash
Check-in
The Check In icon in Joomla! may not be the kind you know from Foursquare or other location-based services. It is a security feature for editing your content. As soon as a user starts editing content, Joomla! locks this content for all other users. The advantage of this behavior is that changes cannot be overwritten by another user. That's a very convient feature. One big problem, however, appears when the user editing the content accidentally closes the browser window, allows the session to expire or the power plant shuts off the power or ... you get my point :-).

Then the content is locked and no one else can edit it!
No one else (except a user with proper permission, e.g. you as the administrator) can check in the content again to allow others to edit it. Unfortunately, you will only notice unchecked content by a small lock being displayed near the title (Figure 2) or by a cry for help from one of your users :-).
[flickr-photo:id=5393220301,size=-]
Figure 3: Check In

With a contact form the following question arises: "Is this content?". I think it is, which is why I have written it as a sub chapter of managing content.

On a contact form it first becomes obvious that something like a CMS is being used. Manually created HTML pages cannot send emails as this requires a script language like PHP, for example, and a configured server. PHP scripts can be embedded as contact forms into HTML pages, but then that part of the website will often look different from the rest of the site. In Joomla! the contact form is already integrated and you "only" have to configure it.

Ususally, if your Joomla! is running on a web server at your provider, you won't have problems with sending emails. Locally, it's a bit more difficult because you would have to set up a mail server first. Generally, this is not a problem but it isn't really necessary. ;-)

Joomla! sends emails in different ways. You will see an overview of this in Global Configuration → Server (Figure 1). Naturally, you would use the standard activated PHP Mail function. (see chapter Website and content configuration).

Figure 1: Mail Server Settings

Creating a contact

In order to include a contact on your site you need at least:

• a contact category
• a contact
• a link in a menu

Maybe you still have a category from the example data (Sample-data contact). If not, go ahead and create one. In the next step you will create a new contact. To do so, open Components → Contacts in your administration area and click on the icon New. Then fill in the appearing form (Figure 2). I have labeled some areas in the screenshot for better orientation.

Figure 2: Create contact

1. The first and last name of the contact person, or the name of the department or company if it is not a person. The contact can be connected with an existing user account. It has to be assigned to a category, should be public (State = Published) and presumably not appear on the frontpage (Featured = No).
2. The text area can be used for additonal information, e.g. opening hours or jurisdiction.
3. The Publishing Options relate to the user who can later make changes to that content, who created the content, and the timing for publishing. The latter is used rather seldomly for 'normal' websites.
4. In Contact Details there are numerous fields available, which you can choose to fill in or leave blank.
5. In Display Options you decide which fields will be displayed. This area is important as you specify here whether a contact form will be shown or not (Show Contact Form). You can also specify whether the sender should receive an email copy and you'll be able to configure some spam protection settings (Banned E-Mail, Banned Subject, etc). Against "real" spammers, however, this protection is rather "pathetic".
6. In the field Contact Redirect, you can enter another email adress to which the contents of the form should be sent.
7. The Metadata Options are, like the Publishing Options, available on each single page (see chapter Search engine optimization).

Creating a menu item

You now have a contact but still no form on your website. That is exactly what we are going to create in this next step. Due to the fact that you can link nestable categories to contacts, you may either have a single contact form or many of them. It is definitely possible to create a contact form for each employee of a big company like Volkswagen (approx. 370,000 employees). How does such a dynamic CMS display this on a website?

To manage this, Joomla! has its own Menu Manager with different layouts. In the Menu Manager, you get to decide whether you want to have a list of contacts or categories or just a single contact form. At first glance this may seem somewhat confusing but it is well thought out and helpful.

Let's link a single form in the menu for the contact we have just created. Open Menus - Top and click the New icon. You need three things for a menu link:

1. the Menu Item Type (type of link) for displaying the site and, depending on your choice, a contact or a category
2. a text displayed as a link
3. the menu, in which the link should appear

For number 1, click on the Select button next to the field  Menu Item Type. A window will open and you will see a choice of types. Click Single Contact (Figure 3).

Figure 3: Choice of menu types

The window will close again. Since you only want one contact, you will now have to choose the contact in Required Settings (Figure 4).

Figure 4: Choose contact

At last, insert the text for the link (Menu Title) and then save everything. The menu is already registered correctly by opening the form. On your website, an additional link in the Top Menu should be appearing, which is linked to the corresponding contact (Figure 5). You can get to the actual contact form by clicking the plus sign in the right field. Now you can send messages via your website.

Figure 5: Contact at website

Figure 6: Contact form

The media manager is Joomla!'s little Digital Asset Management System (DAM). If you are managing content, you will need a place to store the files. Files are all the images, PDFs and whatever you decide to mention in your content. Usually these digital assets consist of the file and additional meta data. In this case, we need an easy-to-use tool to manage our files. Let's have a look at what is possible with the Joomla! core media manager.

How it works

To me it looks more like a file manager. Everyone knows the Windows explorer or the OSX finder. In Joomla! they call it "media manager". It has a base directory where all the files are stored. You can look at your files in two different ways using your browser: via a Thumbnail View (Figure 1) and a Detailed View (Figure 2). It is possible to navigate through the folders by clicking on them.

Figure 1: Media Manager - Thumbnail View

Figure 2: Media Manager - Detailed View

You can create as many additional folders as you wish. In the Detailed View, you are able to delete folders and files. You’ll find the same structure in the Joomla! administration backend as you can see in your FTP client (Figure 3), but you have to be careful: In core Joomla! you will also find a media directory. This directory is NOT the home of the media manager.
The home of the media manager in core Joomla! is the images directory.

Figure 3: Media manager directory in ftp client

When you look in the toolbar you will discover the Options icon - go ahead and click on it (Figure 4). 

Figure 4: Media manager options

If you go through the options, you will notice that you can limit file types by extension, maximum size of a file and you can also separate images from files. Well, an image is a file, too, but I like the idea of separating them. The thumbnail view, e.g., makes a lot more sense for images but not for non-image files. The biggest advantage of that separation is the possibility to Restrict Uploads to users lower than the manager role. You can allow registered users to upload images but you do not have to give permission to upload other files. This is, in some cases, very useful. The next options you see are MIME types, nowadays often called Internet Media Type. If you are a Windows user, you usually only distinguish different file types by their extension. Internet Media Type is another way to recognize the type of a file even without a file extension. You can permit or forbid as many file types as desired.

The Flash Uploader is one of the most sophisticated features that is often forgotten about. In Joomla! 1.5 it didn't always work properly but the version coming since Joomla! 1.6 is excellent for uploading more than one file at a time. The Flash Uploader simply works and is easy to use, even in 2.5 :)! Try it! (Figure 5).

Figure 5: Media manager Flash Uploader

As you notice, the Joomla! media manager is no rocket science but it is a reliable, easy to use tool to manage your images and other files.

If you need a more sophisticated product, Joomla! offers other solutions in the extension directory in the category File Management.

Media manager and the editor

Now you know about the central place of your files but how can you manage to connect them to your content?

Anywhere you see an editor in Joomla!, it is usually possible to add media from the media manager by clicking the image button below. We have already talked about this when we created a typical article with a photo (Figure 6).

Figure 6: Media manager in content areas

Media Manager in other places

There are other places where the media manager plays a role, like in categories. It is possible to link an image to a category (Figure 7).

Figure 7: Media manager in category

This image will appear in a list of categories if you configure it in the Menu Items Options.

The following items usually have to be taken into consideration when it comes to creating an article on your website:

1. a text with one or more images
2. a teaser text for list views with a read more link pointing to the full article page
3. the article should appear on the front page and needs no menu link
4. nice to have: a scheduled publication date
5. nice to have: a printer-friendly version for visitors who would like to print the article
6. nice to have: an option to forward the article by email

Start

The article should appear on the front page of your website. If you deleted, did not install or change your sample data, your Joomla! front page will look like the one in Figure 1. It is, of course, not a bad thing if posts should appear. :-)

Figure 1: Empty website

When you log into the administration area, you will see an icon called Add New Article.
You may either click on this icon or access the form via the main navigation Content → Article Manager → Add New Article (Figure 2)

Figure 2: Administration area

Article form

You are now in the article form, in which you will probably write all articles you will ever write in Joomla!. A very important place! The form is structured as in Figure 3.

Figure 3: Entry form for contributions

The minimum requirement for an article is a title (1), a category (2), and a text (3). If you look at the form more closely, you will notice the help texts that appear when you move the mouse across the description of a field. I have marked the areas in the form in Figure 3 with six digits.

1. Title

The most important part is the title or headline. The title appears as a headline on the website (usually in the biggest size of the HTML headline tags <h1>) and in the browser bar at the top (you can enable or disable this behavior). The title is the foundation for the alias field below. The alias is automatically generated by Joomla! when you save the article and and its appearance can be changed as well. Basically, the purpose of an alias is to have a simple, short and legible URL in the browser address bar, which can easily be used in e-mails or chats as well. In the example of http://example.com/first-article - first-article is the alias.

2. Category

This is about the classification or categorization of the article. Every item MUST be assigned to a category. If you explicitly do not want to categorize the article, you can assign the category uncategorized. This is especially useful for more static content pages like legal notices and the About Us page. In this area, other important attributes can be configured, including State (published or not), who has Access (Access, Permission depends on various settings), Language and Featured. Featured replaces the former attribute frontpage and ensures that the items are in a predefined blog layout for your website frontpage. The article ID is created after saving and consists of a serial number.

3. Text

In this section you can write your text, which should be of value to your audience. Sounds really easy, doesn't it?! :-)
Technically, you are dealing with a WYSIWYG editor (What You See Is What You Get) here. The editor converts your written text into HTML text format. Joomla! uses the TinyMCE editor as default configuration. TinyMCE is an independent open source project, which has so many functions that you could write a separate book about it. (May not be a bad idea.)
It basically works like any other word processor: write text, highlight text, then click on a toolbar icon and the function is applied or a dialog box opens.
The buttons below the input area are unusual and can be confusing at times. These buttons are Joomla! specific and only have an indirect relationship with the editor. The Joomla! core comes with five of these very practical additional buttons.
You can add more buttons by adding Joomla! extensions:

1. Article: allows you to link to other existing Joomla! articles
2. Image: You can insert an existing image or photo from the Media Manager or upload a new image.
3. Pagebreak: inserts a pagebreak in your article
4. Read More: allows you to stipulate where to place the read more link
5. Toggle Editor: switches the editor on and off. If it is off, you will see the HTML code of your article.

4. Options

What was called Parameter in Joomla! 1.5, is now called Options since Joomla! 1.6, like, for example, the Publishing Options. Here you can specify who wrote the article (Created by). The user who created the article is usually allowed and responsible for making changes to the article later. Which name is really shown below the title at the webpage is configured in Created by Alias. The three fields below allow you to schedule the publishing. Simply enter the appropriate dates and Joomla! takes care of the rest.

5. More options

In this section you can configure many options by switching them on and off. You can change the article layout to suit the reader's and search engine's needs. Just start experimenting - it's the best way to learn.

6. Permissions

The sixth and final area concerns the permissions for this article. This selection will help us in many places in Joomla! 1.7 and I will cover this in chapter Users and permissions.

Sample article

Let's create the article outlined above together:

A text with one or more images

Just write your text. To add an image or images, there are numerous possibilities:

1. The image is already available online, for example, on Flickr.
In this case, click the image icon in the editor toolbar and copy the image URL to the dialog box.

2. The image is already in the Joomla! Media Manager.
In this case, click the image button below to select the image and insert it into your text (Figure 4).

Figure 4: Insert Image from media field

3. The picture is on your hard disk.
This is the most complex case. Basically, you will also use the image button below the text. There you will find an upload dialogue through which you can upload your image "easily". Remember that Joomla! will NOT resize the image. If you upload a photo from your digital camera, it will be displayed in its full original size (width > 3000 pixels). You have to resize the image before uploading.
If all goes well - congratulations!
If it doesn't work, this could be due to many things, such as lack of permissions in the directories of the media manager. At best, you will get an error message. If it still doesn't work, try posting a comment here. :-)

Once you have inserted the image from the media, you can select and format it by clicking the image icon in the editor's toolbar.

A teaser text for list views with a read more link to the full article

This is easy. Move the cursor to the position at which the read more link should appear and click on the read more button below the text area.

The article should appear on the frontpage and needs no menu link

Select Yes in the field Featured in Area 2.

A scheduled publication would be nice

Avoid this at first, so you don't have to wait for the article to appear on your website :-). If you would like to try it later with a different article, simply fill the fields Start Publishing and Finish Publishing with the appropriate information or select the dates by clicking the calendar icon.

A printer-friendly version of the article

In area 5, you may switch the Show Printer icon to 'show'.

Forwarding of the article by e-mail

Simply set the options in area 5, switch the Show Email Icon to show.

Result

After saving you can reload your site and will see your article on the frontpage as in Figure 5.

Figure 5: Article on the frontpage

IN TRANSLATION PROCESS
To give you a first real challenge, let's create a first page on your new website. It will be an about us page on which you can write about your company, your project, or yourself. Most of the time, a page like this contains a title, text and perhaps a few images. 
Static vs. dynamic content
An "about us" page is usually created once, is accessible via a menu link, and in the future all you will have to do is change it as you go. It has a static character. A press release or blog entry, however, has a dynamic character.

• For static pages, in contrast to dynamic pages, the creation date and author do not really matter.
• Static pages are usually accessible via a menu link whereas dynamic pages can be accessed through lists.

The plan
The 'about us' page should consist of the following components:

• a title,
• a text,
• an image.
• The page should not appear on the front page.
• We want a link to the page in the top horizontal menu (top).

This may sound simple at first :-). Go ahead and log into the administration interface!
Step 1 - Create content
Go to the Article Manager (Content -> Article Manager). There you might still see your unpublished sample data (Figure 1).
[flickr-photo:id=6721269793,size=-]
Figure 1: Article manager
Click the icon to get to the appropriate form and then add the title and text. In the upper pane, below the title, select "uncategorized" as a category. This category was created by installing the example data. The field Featured indicates whether the content should be displayed in the featured blog layout, which is mostly used as the front page. This still works in Joomla! 2.5 but the terms can easily be misunderstood. Select No. In the editor window, you may now enter your text. Joomla! comes with the default editor TinyMCE (Figure 2).
[flickr-photo:id=6721270011,size=-]
Figure 2: Article edit form
Inserting an image from a URL
As a first example we are going to use an already existing image on the web.

For example, this one: http://farm2.staticflickr.com/1198/898250237_78a0e75cba_m_d.jpg (Figure 3)
[flickr-photo:id=898250237,size=m]
Figure 3: Example image
Move the cursor to the position in the text at which you would like to insert the image. Click on the image icon in the editor toolbar and paste the URL of the image to the pop-up window. Configure the image with a left alignment and use 10 pixels vertical and horizontal space (Figure 4).
[flickr-photo:id=6721270367,size=-]
Figure 4: Insert image
The image will appear in your editor window. Click Save and your item is stored. There are several ways to save it:

• Save - Item is saved. Form is not closed. Used for saving when you still want to continue working.
• Save & Close - Item is saved and form will be closed.
• Save & New - Item is saved, form will be closed and a new empty article form is called.

Exit the form.
Step 2 - Creating a Menu Link
The post has been created but is not appearing on the website. For it to appear, we need a link!
Click the New icon in the Menu manager in the top menu (Menu → Top).
Hint: Top is the name of the position in the default template. If you are not using the default template and the example data the Top menu doesn't exist or may have another name.
Click the 'Select' button next to the field Menu item type. A window with various links will pop up. Click on the link single article (Figure 5).
[flickr-photo:id=6721270569,size=-]
Figure 5: Select a menu item type
Now you need to choose the desired article. Click the button Select / Change in the right pane (Select Article) to select it. You will see a search box with all articles. In case you can't find your article on the page right away, you can filter the list by typing a part of the article's title in the search box and then clicking on the title of the correct article in the result list (Figure 6).
[flickr-photo:id=6721270717,size=-]
Figure 6: Menu type - single article - select article
Enter a title for the link "About us" and make sure that top is selected in the menu location. We can leave the remaining options with their settings for now.
Step 3 - 'About us' on the website
If you now load the frontend website, you will discover the new link in the top menu. Click it and you will see the about us content - congratulations on having created your first page (Figure 7).
[flickr-photo:id=6721271067,size=-]
Figure 7: About us page
Step 4 - Image Upload
If your image is not already available on the Internet, you will need to upload it from your PC. Let's go through the example together. Go to the Article Manager (Content → Article manager). If you can't find your article, locate it easily by using the search box. Select the article's title and the edit form will open. Delete the linked image from the text.
Below the editor window you will find the Image button. This button launches a dialog box to upload an image. You can choose between existing images or upload new ones (Figure 8).
[flickr-photo:id=4963620535,size=-]
Figure 8: Image upload
Once the image has been inserted into the text, the formatting can be changed by using the image icon in the editor's toolbar. This separation of functions in Joomla! was purposely chosen because you have the possibility to use different editors. The Joomla! Image button will always remain the same but the image formatting in the editor might differ.
Attention: Joomla! uses the images as they are. The images will not be resized!
To solve this issue, have a look at Brian Teemans blog entry: Making Joomla Idiot Proof - May be FBoxBot is available for Joomla! 2.5 too when you read these lines.