Chapter 9 [ 307 ] The hwdVideoShare component is a big one, and full of video features as are displayed on the author's demonstration site. It is possible to create a full-blown video hosting service such as YouTube (within your Joomla! site), or you can simply offer videos nicely categorized and lock down frontend uploading features. I would love to spend more time populating this component and adding video features, but I feel that the supporting documentation explains all the features of this extension. For now, we need to carry on and add some more multimedia features to our project. Videos within articles using FlowPlayer For the majority of you, being able to place videos within your articles is probably a technique that you will require often. The FlowPlayer uses a Flash-based video player that plays a video le easily in your articles by using the plugin tag: {flowplayer}URL_Video{/flowplayer} The FlowPlayer is available as a Joomla! Plugin so you can add to your articles, or also as a module to place in any module position you require. To add the FlowPlayer into Joomla!: 1. Search the Joomla! Extensions area for "FlowPlayer" at http://extensions.joomla.org. 2. Visit the extension developer's website and download the extensions to your computer. 3. Upload both the video and plugin extensions to Joomla! using the Extension|Install / Uninstall feature. 4. Navigate to the Extensions|Plugin Manager and publish the Content – FlowPlayer plugin: There is another plugin called Flow Player that was installed for use with the hwdVideoShare component. Make sure you enable the Content – FlowPlayer plugin which is the one we just installed. This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Joomla! Multimedia Project [ 308 ] The plugin also contains additional parameters, so you might want to take a look at these while enabling the plugin: Once the plugin has been enabled, navigate to Content|Article Manager and create a new Joomla! Article named "Videos". Select the Section labeled Video and Category labeled General Video; this simply helps with the organization of our content and media. We need to enter in some text for the article, and then enter the following code to activate FlowPlayer and link to your video le: {flowplayer}URL to Video{/flowplayer} This le can reside within your website le system: {flowplayer}images/video/dog.mov{/flowplayer} Make sure you save your article, and head over to create a new menu link to display this article. I am going to make this a submenu link of the Video Gallery link, similar to what we did for the audio link, and call it "Video Page". This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Chapter 9 [ 309 ] Want to do something similar but link to a YouTube video instead? Unfortunately due to a licensing issue, the FlowPlayer cannot play YouTube content, but we have other options. Using the QTube extension to display YouTube videos As you are now aware, there are a number of multimedia extensions that provide the exibility of displaying multiple media types. These are very useful because you only require one plugin or extension to cater for numerous situations. A simple but specialist plugin worth mentioning though is the QTube plugin. If you think that all of your video content is going to come from YouTube hosted videos, then take advantage of the small footprint that this plugin creates. It does what it says on the tin, and that is playing YouTube videos within your Joomla! Articles. Like the FlowPlayer, QTube offers a module and a plugin, so you can play videos from YouTube either in module positions or within articles. To install these extensions, follow these steps: 1. Search the Joomla! Extensions area for "QTube" at http://extensions.joomla.org. 2. Visit the extension developer's website and download the extension to your computer. 3. Upload both the extensions to Joomla! using the Extension|Install / Uninstall feature. 4. Navigate to the Extensions|Plugin Manager area and click on the QTube plugin title to edit. Here you can congure the plugin parameters you require, and make sure the plugin is enabled. Click on Save and we are ready to roll! Here is the plugin syntax required in its simplest form: {qtube vid:=xxx} This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Joomla! Multimedia Project [ 310 ] In place of xxx, you must put the unique identier assigned to the video from YouTube.com. To obtain it, simply visit the YouTube site and look at your browser's address bar while you are watching the video you want to include. You will see a URL like this: The CQzUsTFqtW0 part is the unique movie identier, so our QTube code will become: {qtube vid:= CQzUsTFqtW0} All we need to do now is to insert this into our article, so let's head back to our Video Page with the FlowPlayer video in it and insert our QTube code in also. Checkout the documentation for the QTube player; you can adjust player size, add border and color, among other features. Let's quickly publish a video using the QTube module. Navigate to the Extensions|Module Manager screen and click on the QTube module. You can congure this as you wish. I have placed it to the left, under my RokBox module, and have congured a width and height so that my video ts into the left column. I have chosen to show it on all pages and have saved the module. This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Chapter 9 [ 311 ] When we now view the frontend of the site, you can see the new QTube module playing a video in the left-hand side column: There are numerous other parameters and features for styling and playing videos using the QTube plugin and module. It really is a simple, but very easy, way to embed YouTube videos into our Joomla! site. Adding audio features Audio tools for Joomla! are a fantastic way of not only offering music and interviews to your site visitors, but it can be utilized to help offer content to users with disabilities. There are some great audio extensions available and we will add a few to our project now. This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Joomla! Multimedia Project [ 312 ] MP3 Browser The MP3 plugin will create a table containing all of the MP3 les that are present in any directory you specify. The plugin displays the ID3 tag information for title, album name, track length, and size. It produces a link to download the MP3 les and an embedded MP3 player to play each MP3 le. It really is a neat bit of kit! To install this feature: 1. Search the Joomla! Extensions area for "MP3 Browser" at http://extensions.joomla.org. 2. Visit the extension developer's website and download the extension to your computer. 3. Upload the extension to Joomla! using the Extension|Install / Uninstall feature. 4. Navigate to the Extensions|Plugin Manager area and click on the MP3 Browser plugin title to edit it. You can congure the Plugin Parameters you require (you will probably re-visit them once you have seen it in action), and make sure the plugin is enabled. Click on Save and then navigate to the Content|Article Manager menu to create a new audio article. Create a new article, calling it "Audio" and place it within the Section Audio and Category General Audio. Enter in any text you wish, and then the following plugin tag syntax to activate the MP3 Browser plugin: {music}directory path to the music folder{/music} The way the MP3 Browser works is, it picks up any MP3 les residing within a directory you point it towards. You can play one le or 20 les, and options are available within the Plugin Parameters to help with limitations. Assuming you had some MP3 les within a directory called /audio/, the code will look like this: {music}/audio/{/music} This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Chapter 9 [ 313 ] You will need to click on Save on your article and create a new top-level menu link to it, and you should now see something similar to the following: Simple MP3 Player Simple MP3 Player is an easy to congure MP3 player module that uses a Flash-based audio player. It has various styling options and can be used as a multiplayer with playlists as well as a single player with only control buttons. The module comes with language support, with English and German language les included. Simple MP3 Player is a versatile player that we can put into any module position, so let's add it: 1. Search the Joomla! Extensions area for "Simple MP3 Player" at http://extensions.joomla.org. 2. Visit the extension developer's website and use the download link on the right-hand side of the page. This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Joomla! Multimedia Project [ 314 ] 3. Upload the extension to Joomla! using the Extension|Install / Uninstall feature. 4. Navigate to the Extensions|Module Manager area and click on the Simple MP3 Player module title to edit it. The module has not only been well designed, but the author has considered putting documentation into the module, so you have an easy reference guide to all of the Module Parameters. The main elds to populate are the following: You can enter details to your audio directory into the server path, enter the MP3 lenames into the MP3 le (separating them with a pipe, |, symbol), and then enter in some MP3 titles for the tracks (separated with a pipe symbol). There are plenty of other adjustments this module allows, such as player color and layout, but for now make sure it's enabled and published in the right column. Then click on Apply and you will see the results shown on your site: You may want to revisit the module to customize it, and the supporting documentation will make this job easy. RokBox for audio You can use RokBox to play audio les also with the nice JavaScript pop-up box that the viewer's audio player will play within. To use it, head back to your RokBox module in the administration and enter the following syntax: <a href="PathToAudio" title="Audio Title :: Audio Description" rel="rokbox[200 100](audio)">Link to RokBox Audio File</a> This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Chapter 9 [ 315 ] We have done exactly the same as our image and video les, except adjust the values for the audio le. I am going to save this module and view my updated side module: Adding podcasts There are numerous ways to add podcasting capabilities to your Joomla! project, and more details on this can be found in Chapter 5, Using Audio in Your Joomla! Website. For now, there is one very important and wonderful extension we will add to our project. The Joomla! Podcast Suite by Joseph LeBlanc contains a component, module, and plugin and is a great bit of kit to offer easy podcasting capabilities. Here is how to install and use it: 1. Search the Joomla! Extensions area for "Podcast Suite" at http://extensions.joomla.org . 2. Visit the extension developer's website and download the component, module, and plugin to your computer. (Download links are clearly listed on the developer's site.) 3. Upload the extensions to Joomla! using the Extension|Install / Uninstall feature. 4. Navigate to the Extensions|Plugin Manager area and enable the Content – Podcast plugin (there are no Plugin Parameters to set). 5. Navigate to the Components Menu|Podcast Suite|Manage Clips. You will see that a notice informs you that you will need to upload some audio MP3 content into the following directory: /components/com_podcast/media/. This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Joomla! Multimedia Project [ 316 ] It is possible to change this to any path you wish through the Parameters button on the Manage Clips screen. Once you have uploaded a le (or several) into your repository (usually via FTP if it's to a remote server), refresh this page and you will see your audio content: The Podcast Suite is unique in that the component generates a new Joomla! Article and places a tag to the audio le within this. Then it uses RSS capabilities in order to produce the podcast feed. To create the rst podcast, click on the title of one of your audio tracks. You will see the following screen: This material is copyright and is licensed for the sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 . tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Joomla! Multimedia Project [ 314 ] 3. Upload the extension to Joomla! using the Extension|Install / Uninstall feature. 4. Navigate. sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Joomla! Multimedia Project [ 310 ] In place of xxx, you must put the unique identier assigned to the video from. sole use by jackie tracey on 23rd February 2010 953 Quincy Drive, , Brick, , 08724 Joomla! Multimedia Project [ 312 ] MP3 Browser The MP3 plugin will create a table containing all of the MP3 les