Chapter 6: Working with Editors and Media 129 FIGURE 6.4 The article editing interface shown in Joomla! 1.5.x with Global Configuration set to No Editor. Tip If you have multiple content contributors, I recommend that you enable at least one of the WYSIWYG editors and set it to the default role. Those users who prefer to work with the HTML code can always toggle the view to show the HTML editing window. Also, do not forget that it is possible to allow registered users to select which editor they can use and therefore it may be desirable to enable more than one. This ability only applies to users assigned to the group Authors or higher. Cross-Reference Enabling the ability for users to select their preferred editor is discussed in Chapter 11. Overview of the Media Manager The Media Manager provides Joomla! site administrators with the ability to add images and other media files to the system and to help keep those files organized. After you have added the files to the system, you can use the Media Manager to preview images and discover the paths to files so that you can insert them into the articles on your site. Part II: Working with Content and Users 130 Although it is possible to manage your media files via FTP, the helpful interface and features of the Media Manager make it an attractive alternative. For those who lack FTP access to their server, the Media Manager is indispensable. Either method results in the display of the Media Manager interface, as shown in Figure 6.5. FIGURE 6.5 The Media Manager interface shown in the default Thumbnail View with the sample data loaded. The toolbar at the top of the Media Manager provides quick access to the Delete and Help functions: l Delete: Select one or more items from the list and then click this icon to delete the items permanently. l Help: Click to access the online help files related to the active screen. Below the toolbar and above the list of items are two text links used for changing the view shown in the Media Manager. The default view is Thumbnail View, which shows a larger image and less information. The Detail View, in contrast, shows a smaller image but more information about each file, as shown in Figure 6.6. In either view, the workspace of the screen contains a list of all the items in the Media Manager and the controls to view them. Chapter 6: Working with Editors and Media 131 FIGURE 6.6 The Menu Media Manager interface shown in Detail View with the sample data loaded. Note By default, the Media Manager shows you the contents of the /images directory. The contents are not affected by the decision whether to install the sample data. The Folders area on the left of the workspace displays a directory tree that shows all the Media folders in your system. The folders shown are the contents of the /images directory on your server. In addition to the images files located in the root directory, the default system includes the follow- ing directories: l M_images: Contains small images commonly used for controls and field labels that appear on pages. l banners: The default Joomla! banner ads that are loaded into the Banner Manager Component. l smilies: A set of generic smilies (also known as emoticons). l stories: Images used to illustrate sections, categories, and articles. There are two sub- directories here, food and fruit. The sub-directories contain sample images that can be used in articles. Part II: Working with Content and Users 132 Clicking on the names of any of the directories in the Folders area displays the contents of the directory in the Files area on the right of the workspace. At the top of the Files area, the path of the directory is displayed. Underneath the path is a set of thumbnails representing the contents of the active directory. The green arrow at the top left of the set of thumbnails is a navigation tool that lets you move up to a higher directory, where one exists. The other thumbnails in the Files area show the sub-directories inside the active directory, if any, and the media files, if any. Note Inside the default Media Manager installation there is a directory named /smilies that contains a set of graphi- cal smilies, or “emoticons.” Note that the emoticons in the smilies folder are different from the ones you see in the TinyMCE WYSIWYG editor. The emoticons shown under the WYSIWYG editor’s Insert emotion control are not managed by the Media Manager, instead they are located at /plugins/editors/tinymce/jscripts/tiny_mce/ plugins/emotions/images. Where the thumbnails indicate image files, clicking on the thumbnail causes the image to open in a light box for you to view. You can close the light box by clicking anywhere on the screen. Where the thumbnail represents other types of media files, for example, a PDF or a PowerPoint document, you cannot open a view of the file, and the thumbnail that is shown is a generic image used to rep- resent the file type. Below each thumbnail you can see a red circle with an x inside and a checkbox. Clicking the red circle with the x deletes the file. Clicking inside the checkbox selects the file, which enables you to select multiple items and delete them all simultaneously by using the Delete icon on the top-right toolbar. At the very bottom is the name of the file. You can click on the name to view the file inside the workspace, without a pop-up window. Two other controls appear on the page. At the top right of the Files area is a blank text field next to a button labeled Create Folder. You use this control to add new sub-directories to the system. Below the Files area is the Upload File function, which enables you to add additional media files to the system. Both are discussed later in this chapter. Clicking the Detail View text link changes the view of the Media Manager, shown in Figure 6.6. This view option changes the format of the Files area to display the following columns: l Preview: Opens a light box view of the image. Note this only functions if the file is an image file. l Image Name: The name of the file. Though the column is labeled Image Name, it shows the name of all media files, regardless of whether they are in fact images. l Dimensions: The width and height of the image in pixels. This is only relevant where the file is an image file. l Size: The size of the file. This is expressed in bytes or kilobytes (Kb). l Delete: Click either the red circle to delete the file immediately or click the checkbox and then the Delete icon on the top toolbar. Chapter 6: Working with Editors and Media 133 Working With Media Files The primary purpose of the Media Manager is to move files onto the server so that you can use them on your site. To enable this ability, you want to preview images, obtain file dimensions and sizes, and eventually obtain the paths to the files so that they can be added to your site articles. All of these functions are possible within the Media Manager. Viewing file information The Detail view (refer to Figure 6.6) provides the most information at a glance. You can preview files, find the filenames or discover the file paths in either Thumbnail or Detail view. If you need the file dimensions or size, you can find that information easiest with Detail view. Uploading files Additional media files can be added to your system either by accessing the server directly via FTP or by using the upload function in the Media Manager. Although FTP may be preferable in situa- tions where you need to move large numbers of files, the default uploader function in the Joomla! Media Manager is fast and convenient for single file uploads. In addition to the default uploader, the system also includes an optional Flash uploader that can be enabled through the Global Configuration Manager. The Flash uploader enables you to designate multiple files for upload and then upload them all simultaneously. If you are looking to move large numbers of files into your system and do not want to use FTP, or if you plan to frequently upload more than one file at a time, you should consider enabling the Flash uploader because it will save you time over the default uploader. The Flash Uploader is shown in Figure 6.7. Cross-Reference The Global Configuration Manager is discussed in Chapter 4. To add a new file to your system using the Media Manager, follow these steps: 1. Log in to the admin system of your site. 2. Access the Media Manager by clicking on the option Media Manager under the Site menu. The Media Manager opens in your browser. 3. Click the Browse button on the Upload File area at the bottom of the Media Manager interface. A pop-up window opens. 4. Navigate through the pop-up window to locate the file you want to upload and then click the Open button on the pop-up window. The name of the file appears in the text field to the left of the Browse button. 5. Click the Start Upload button. The system uploads the file to the active directory and return to the Media Manager. A confirmation message and a thumbnail for the file should be visible in the Media Manager. Part II: Working with Content and Users 134 FIGURE 6.7 The optional Flash Uploader in action. Note By default, the system accepts not only all common image file types but also other common file types, includ- ing Flash files, PowerPoint files, and various document formats. The maximum file size in the default system is set to 10MB. Permissible file types and maximum file sizes can be modified by changing the settings in the System section of the Global Configuration Manager. Alternatively, if you want to add media files via FTP, place the files inside the /images directory on your server. Any files placed inside the directory will show up in the Media Manager. Similarly, if you use FTP to create any sub-directories inside /images, your new directories will show up in the Media Manager. Files and directories uploaded via FTP to those locations can thereafter be man- aged by the Media Manager without limitation. Organizing files By default, the files included in the default system are organized into the directories you see in the Folders area of the Media Manager. You can create new sub-directories and upload new files to any of the directories in the Media Manager. It is also possible to delete files and directories from within the Media Manager. Chapter 6: Working with Editors and Media 135 Unfortunately, files in the system cannot be easily moved from one directory to another. The only way around this limitation is to download the file and then upload it again to the directory of your choosing. Although a download option is not included in the Media Manager you can easily down- load image files in the system by following these steps: 1. Access the Media Manager and find the image file you want to download. 2. Click on the file’s name. The file appears alone in the Files area of the Media Manager. 3. Right click on the file. A menu appears. 4. Select the Save File As option. A dialogue window opens. 5. Navigate to where you want to save the file on your local computer and then click Save. The system downloads the file to your local machine and then returns you to the Media Manager. After the file is on your local machine, you can upload it to the directory of your choice by using either the uploader in the Media Manager or by using FTP, as discussed in the preceding section. Deleting one or more files is easy to do. To delete files one at a time, simply click the red circle with the x that appears on each file. To delete multiple files, click the checkboxes next to the files and then click the Delete icon on the top-right toolbar. Caution Be cautious deleting files. Deletion is instantaneous — there is no confirmation or warning dialogue. Deletion is also permanent — files are removed from the system, not moved to the Trash Manager. New directories can be added to the system using the Create Folder control on the Media Manager. Each new directory will be a sub-directory of the /images folder. To create a new sub-directory to hold your media files, follow these steps: 1. Access the Media Manager. 2. In the Folders area of the Media Manager, click the name of the directory you want to be the parent directory. The contents displays in the Files area. 3. Type a name for the new sub-directory in the text field next to the Create Folder button. 4. Click Create Folder. The system creates a new directory. The new directory appears in the Folders area of the Media Manager. Adding files to articles The most common reason for adding files to a system is to make them available for use in the site’s articles. Although getting files into the Media Manager takes care of one important task, that is, adding files to your Joomla! system, it does not enable you to automatically place the files inside your site’s articles. Part II: Working with Content and Users 136 Depending on what you are trying to accomplish, you want to either insert the file into the article or simply display a link to the file. To make an image visible, for example, you want to insert it into the article. If, on the other hand, you wish to enable visitors to download a file, you can insert into the article a link to the file. In either event, you must first discover the path the file. After you know the path to the file, you can use the WYSIWYG editor of your choice to insert the file or the URL. To obtain the path to an image file, simply right-click on the file’s name in the media manager and copy the link. Typically, this is done by selecting from the right-click menu the option Copy Link Location. You can now either paste the link into the appropriate place in the WYSIWYG editor or into an external document for later reference. To obtain the path to a non-image file type, you need to look at the path information at the top of the Files area and append to the end of that path the name of the file. Summary In this chapter, we have covered the use of the system’s various default Editor options and the use of the Media Manager. You learned the following: l How to use the TinyMCE editor l How to use the XStandard Lite editor l How to edit Articles without a WYSIWYG editor l How to view files with the Media Manager l How to upload files to the Media Manager l How to organize files in the Media Manager l How to delete files from the Media Manager l How to add files in the Media Manager to articles . Chapter 6: Working with Editors and Media 12 9 FIGURE 6.4 The article editing interface shown in Joomla! 1. 5 .x with Global Configuration set to No Editor. Tip If you have. thumbnail you can see a red circle with an x inside and a checkbox. Clicking the red circle with the x deletes the file. Clicking inside the checkbox selects the file, which enables you to select. to open in a light box for you to view. You can close the light box by clicking anywhere on the screen. Where the thumbnail represents other types of media files, for example, a PDF or a PowerPoint