Working with Media Manager in Joomla

The Media Manager is a component that enables you to manage all the images used in your web site in articles, menus, categories, sections, and so on. Using this manager, new images can be uploaded, existing images can be edited, and new directories can be created.

All the images in your web site are stored in the joomla_root/images folder, except for the images for any extensions, which are stored in their respective image directories. The term extensions refers collectively to the components, modules, plug-ins, and templates that are installed in a Joomla web site to enhance its features. A template is a collection of styles for giving a dynamic appearance to your web site. The remaining types of extensions—components, modules, and plug-ins—are closely related:

  • A component is an independent application with its own functionality, database, and Installing a component in a web site is like adding an application to the site. A forum, shopping cart, newsletter, and guest book are all examples of components, which may consist of one or more modules.
  • A module is used to add new functions (features) to a component (application) of a web site—for example, a login module, a sign-in module of a guest book component, or a subscription module of a newsletter A module isn’t a stand-alone application; it is an application’s running unit.
  • A plug-in is a function that can be applied to a particular component or complete web site—for example, a search plug-in that visitors can use to search a forum or a bookmark plug-in to place bookmarks on the desired contents of a Joomla web site.

1. Making a Client Banner, Step by Step

Let’s look at an example that combines all three extensions. A shopping cart is a component that has several modules, including those for maintaining inventory, storing payment information, and printing bills. Plug- ins can be added to this component, such as a plug-in to change the price of a particular product or a search plug-in to search for a desired product from the shopping cart.

To open the Media Manager, point the browser to the Administrator interface: the address http://localhost/joomlasite/administrator. In the Administrator interface, select Content ➤ Media Manager from the menu bar or Media Manager from the Quick Icons on the Dashboard; the Media Manager will open (see Figure 4-1). It already contains images in the banners, headers, and sampledata folders.

Joomla provides these images in the default web site, and you can use them directly in your web site.

Note      The camera1.png, camera2.png, and electronics1.png images that you see in Figure 4-1 are not the default images; you uploaded them in Chapter 3.

You can also upload new images. To do that, the first step is to create a folder in the Media Manager, which is discussed next. Remember that moving or copying images between folders is not possible in the Media Manager, however. In the next sections, you will learn to create a folder, copy image(s) in it, and display a banner ad using them.

2. Creating a Folder

It is best to create a separate folder for any new images uploaded in the Media Manager. To create a folder within the joomla_root/images folder, do the following:

  1. Click the Create New Folder button from the Type the name of the new folder in the text box to the right. Call your folder trialimg.
  2. Click the Create Folder button, as shown in Figure 4-2.

A new folder named trialimg will be created and will appear in the Folders list of the Media Manager. To upload images to the trialimg folder, make it the active folder by clicking it in the Folder list. Because it currently contains no images, it will appear blank, as shown in Figure 4-3.

3. Uploading a File

To upload an image from your computer to the Media Manager’s active folder (in this case, trialimg, which is a subdirectory of the joomla_root/images directory), use the Upload button shown at the top in the toolbar. Besides using the Upload button, you can also use an FTP program to upload media to the desired folder.

  1. Click the Browse button to locate an image (in JPG, GIF, BMP, or PNG format) on your computer and then click the Start Upload button to transfer a copy of the file from your computer to the active trialimg directory (I’m using an image named cellphone1.jpg from the some directory on the D: drive). Click the Start Upload button (see Figure 4-4).

You’ll see a preview of the image and an Upload Complete message if the transfer is successful (see Figure 4-5).


Upload one more image file (in this example, I’m using an image named cellphone2.jpg from a directory on the D: drive) and click the Start Upload button. You now have two images, cellphone1.jpg and cellphone2.jpg, uploaded in the trialimg subdirectory of the joomla_root/images folder, as shown in Figure 4-6.

These images can now be easily inserted into any article, menu, or category. If you did not upload the file to the proper directory, you can always delete it, navigate to the correct directory, and reload it. When you create the contents of your web site via the Administrator interface, you’ll see a button for inserting images. When clicked, the button will display only the images found within the Media Manager, so if you want to add an image to your site, you have to first add it to the Media Manager, as you did here.

4. Displaying a Banner Ad

Web sites have become a good source of advertisements, and many organizations look for high-traffic sites that can display their banner (an image that carries the logo of the organization and advertises its products or services). Organizations pay web site owners to display their banners because visitors to the site who click the banner will be sent to that organization’s web site, hence increasing the awareness of their products or services and eventually increasing their business. The organizations whose banners you will display on your site are called clients. There can be more than one banner for a client, and you can choose to display the banners of several clients.

Before you proceed with displaying banners on your web site, you need to understand the following terms:

  • A banner is an image file (with a hyperlink pointing to the client’s URL) that is displayed on a web site. If, for example, an organization named Chirag that deals with cameras and camcorders wanted you to display the banners of both these products randomly, you would make two banners named, for example, Chirag Camera banner and Chirag Camcorder Similarly, if an organization named Johnny Electronics also wanted you to display the banner for its product, Camera, you could name that banner Johnny Camera banner. (You can assign any name to a banner.)
  • A banner category is used to categorize similar banners. For example, all banners related to the Camera product (of any organization) can be assigned to a banner category named Camera Banner. Similarly, all banners related to luxury hotels can be assigned to a banner category named Luxury Hotels. The idea behind keeping the banners categorized is to make it easy for you to find specific banners while assigning them to different Also, you can display several banners randomly, one by one, by placing them all in one category and setting the Banners module to display banners of that category.
  • A banner client refers to the name of an organization whose banner will be displayed on your site. For example, if you’re displaying a banner of the organization Chirag Camera Store, you create a banner client by the same name. Similarly, if you display a banner for the client Johnny Electronics, you create a banner client named Johnny (Note that a banner client can have multiple banners.)

Source: Harwani B M (2015), Foundations of Joomla!, Apress; 2nd ed edition

Leave a Reply

Your email address will not be published. Required fields are marked *