OpenSourceVarsity

pdf icons

Using Joomla 3.X Media Manager

Website content, (i.e. pages or Blog posts) consist of several different content types. For example, the HTML content of the Joomla webpage can have images, audio, or video embedded within them. Hence, it is necessary to upload the images, audio, or video (or other) content type to a folder within Joomla prior it is being displayed within a Joomla web page.

This can be done in one of two ways:
Using a File Transfer Protocol (FTP) tool such as FileZilla, CuteFTP to upload these assets into a folder within Joomla
OR
Use Joomla’s Media Manager to upload these assets into a folder within Joomla

This tutorial focuses on the use of Joomla’s Media Manager to upload these assets into a folder within Joomla folder structure on its Web host. Joomla normally stores all such website assets within a folder named /images.

/images is normally found within the root directory of the Joomla website – /public_html/images

To access Media Manager under Global Configurations, click System à Media Manager. The screen as shown in diagram 1 will be displayed in the Browser.

diagram1 Diagram 1

NOTE: The path to the folder /images is set at installation time and is visible within Joomla Global Configuration user interface as shown in diagram 1.

When these global settings are completed, Click Save & Close in the top menu, to save the settings permanently and return to the Admin dashboard as shown in diagram 2.

diagram2 Diagram 2

There are two ways to access Joomla’s Media Manager.

  1. Click the Media Manager link on the right hand side of the Admin dashboard.
  2. Click Content à Media Manager

 

As shown in diagram 3.

diagram3 Diagram 3

The Joomla Media Manager User interface will be displayed in the Browser as shown in diagram 4.

diagram4 Diagram 4

The Top Menu items available in Media Manager are as shown in diagram 5.

diagram5 Diagram 5

Uploading A File

To upload a file to the /images folder in your Joomla installation, click the green Upload button in the Media Manager, top menu. The screen as shown in diagram 6 will be displayed in the Browser.

diagram6 Diagram 6

In this user interface click Choose Files. A file Browser will be displayed. Use the file Browser and navigate to a folder where the file you want to upload to Joomla is stored.

When the file to be uploaded to /images has been identified, Click Open in the file Browser. The file will be assigned to the Media Manager User interface ready for upload as shown in diagram 7.

diagram7 Diagram 7

Click Start Upload. The file selected will be uploaded to /images folder within Joomla. As shown in diagram 8.

diagram8 Diagram 8

The Upload Complete message will be displayed at the top left hand side and the file itself will be visible in the right hand side section as shown in diagram 8.

Deleting A File

Joomla’s Media Manager User interface also permits the deletion of folder and or files which are within /images.

To delete a file, simply click on the Checkbox visible adjacent to the file name and then click the Delete Top menu item as shown in diagram 9. This will delete the selected file.

diagram9 Diagram 9

This is a two click process. To delete a file using a single click, simply click the ( x ) visible in the top right hand corner of the file name and the file will be deleted. The Delete complete will be displayed in the top left hand side of the Media Manager User interface as shown in diagram 10.

diagram10 Diagram 10

NOTE: Whether one uses the Delete top menu item or the ( x ) to delete a file this message is displayed.

Creating A New Folder Under /images

On occasion instead of uploading all content file types within the /images folder, one may want to create a different folder under /images and place the content files types there. Here is how to do it.

Click the Create Folder Top menu item.

A User interface will be displayed in your Browser as shown in diagram 11

diagram11 Diagram 11

The path to the folder is displayed as /public_html/images. Adjacent there is a text box in which the new folder name can be entered. Once done, Click Create Folder as shown in diagram 11.

The folder will be created and will be immediately visible within the folder structure within Media Manager as shown in diagram 12.

diagram12 Diagram 12

Deleting A Folder Under /images

To delete a folder using Media Manager, click the Checkbox adjacent to the folder name to identify the folder for deletion to Media Manager. Then Click the Delete Top Menu item to delete the folder selected.

diagram13 Diagram 13

This is a two click system for deleting a folder using Media Manager. For a one Click process for deleting a folder in Media Manager, simply Click the ( x ) displayed within the folder icon. The folder will be deleted and the Delete Complete message will be displayed as shown in diagram 13.

Uploading Multiple Files At One Go Using Media Manager

To upload multiple files at one go using Joomla’s Media Manager, simply Click the green Upload Top Menu Item. In the file Browser that opens up, keep the Ctrl key pressed and Click on multiple file names in the file Browser. Then Click Open in the file Browser.

These multiple files will be immediately assigned to the Joomla Media Manager User interface. In this example we’ve chosen two files for upload as shown in diagram 14.

diagram14 Diagram 14

Click Start Upload. The files selected will be uploaded to /images folder immediately.

Deleting Multiple Files At One Go Using Media Manager

In Media Manager simply click on as many Check boxes, adjacent to the files, which must be deleted. Once these files are marked for deletion, Click the Delete Top Menu item to delete all the files selected.

The files will be deleted immediately and the Delete Complete message will be displayed in the top left hand side of Media Manager as shown in diagram 15.

diagram15 Diagram 15

Changing The Limits Of The File Size Being Upload

Joomla’s Media Manager automatically limits the file size being uploaded to 10 Megabyte. This is actually set in the Global Options of Joomla. The file upload size limit can be User defined when required.

In the Joomla Media Manager User interface Click the Options Top Menu item. The Media Manager Options User interface will be displayed in the Browser as shown in diagram 16.

diagram16 Diagram 16

As can be seen in diagram 16, 10 Megabyte is the file size set. Enter a new file size required and click the green Save Top Menu item. One can either increase or decrease the size of the files uploadable using the Media Manager User interface using this technique.

Once done, Click the Save & Close Top Menu item to return to the Media Manager User Interface.

Limitations Of File Type Uploads Using Media Manager

For security reasons, Joomla’s Media Manager limits the types of files that one can upload. The Media Manager has been configured to only allow upload the following file types:

.bmp     .csv        .doc       .gif          .ico         .jpg        .jpeg      .odg       .odp       .ods
.odt        .pdf        .png       .ppt        .swf       .txt         .xcf         .xls

Changing The Limitations Of File Type Uploads In Media Manager

If one would like to upload a file type that is not in the Media Manager list, simply add the extension for the file type in the Legal Extensions (File Types) within the Media Manager Options area.

Click the Options Top Menu item in the Media Manager toolbar.

Next, add the desired file extension to the end of the list in the Legal Extensions (File Types) text box as shown in diagram 17.

diagram17 Diagram 17

NOTE: The file extension must go in alphabetical order. The file extension must be entered in both lowercase and uppercase.

For example, if a Microsoft Word 2010 document required to be uploaded then add:
.doc
.docx
.DOC
.DOCX

NOTE: Make sure that a comma is used to separate each file extension in the list.

Click Save & Close Top Menu items when done.

NOTE: To further restrict the file types being uploaded via Media Manager, simply delete the file type extension from the list visible and Click the Save & Close Top Menu item.

April 5, 2016
Design by Ivan Bayross and Meher Bala © 2016 All Rights Reserved
X