Blog

/ home for news, views, resources & tutorials.

This tutorial will show you how to add videos from a  variety of sources to your Joomla articles using a popular free Joomla plug-in named AllVideos.

AllVideos is a Joomla plug-in. A Joomla plug-in is an additional feature which can be added to the Joomla content management system to provide extra functions.

How to Install AllVideos

The plug-in can be installed from the Joomla v3 administrator system by opening Extensions/ Manage/ Install, selecting the Web option and searching for 'Allvideos'. Click the extension name when it shows in the search results then the Install button.

How to Add a Video

It is possible to upload videos to the Joomla Media Manager and insert them into articles using AllVideos, however, we would not recommend this for two reasons.

  1. Space Usage: Video always uses more space than images and while unlimited hosting accounts are available making the storage of video on your website possible we would not see this as a viable option unless your videos are only intended for a specific audience, perhaps subscription based membership holders.
  2. Search Engine Performance: While it is possible to tag videos and provide descriptions which can help with search engine indexing, this will not be as effective as making use of a service such as Youtube or Vimeo.
    Using one of these or another service will increase the chance that a video will be viewed by a greater audience. This can help by providing valuable back-links to a website and increasing the availability of content across more than one stream.

If there is a need to upload videos to the website rather than use a service such as Youtube this can be done via Joomla's Media Manager.

Upload Video using Joomla Media Manager

Open Media Manager by selecting the Media Manager link from the central menu on the Administrator home screen.

Joomla-Media-Manager-Link

This will open the Media Manager and display the folders already created.

Joomla-Media-Manager-View

Left-click the Create New Folder button top of the screen to enable the following dialogue above the main folder window.

Joomla-Media-Manager-Create-Folder-Dialogue

In this example we are creating a folder named videos. When the name has been entered left-click the create folder button to make the new folder. Once complete the view will refresh to show the new folder.

Left-Click the new folder to open it. Next left-click the green upload button located top-left of the Media Manager. This will enable the upload dialogue.

Joomla-Media-Manager-Upload-Dialogue

Left-click the Browse button. This will open your operating system’s standard file system.

Use this to navigate to the folder where the required videos are stored. Access the folder and select all the videos you want to upload.

Note: Hold the Ctrl (Cmd on Mac) button down while clicking on all the needed videos. They should be highlighted as you select them.

When all the videos have been selected, release the Ctrl /Cmd button and left-click Open, bottom right of the window. This will return you to the Joomla Media Manager, however, there should now be ‘x’ files selected next to the Browse button where ‘x’ should reflect the number of files you selected.

Left-click the blue Start-Upload button to upload the files to the folder. When the upload is complete, the screen will refresh to show the videos in your folder.

You can now exit the Media Manager by clicking the icon top-left of the Joomla administrator window.

Joomla-Return-to-admin-panel-icon

Upload Video to YouTube, Vimeo & Other Sources

If you decide to use a video delivery system such as YouTube you will need to visit the relevant website, create an account and use this to upload videos to the service. Creating an account and uploading video to a service such as YouTube is not covered in this article.

Add Video to Article

The next step is to add your video to the relevant article.

Open the article manager by selecting the Edit Articles option from the central menu of options, or, the Joomla administrator menu displayed left side of the screen.

Joomla-Article-Manager-Link

This will display a full list of articles within the website. Locate and left-click the required article's title to open it.

Joomla-Article-List-View

This will open the main article editor. Locate the position at which the video needs to be inserted and left-click to place the mouse cursor at this position.

Enter the shortcode for the video. There are many available options, however, the most common are the following.

  1. Youtube video: {youtube.}video code{/youtube}. The video code can be obtained from the share link supplied by Youtube. The video code is the 11 character code after youtu.be/.
  2. Vimeo Video: {vimeo.}video code{/vimeo}. The Vimeo video code is the last 8 digit number shown after vimeo.com/ in the video details.

Multiple shortcodes can be added to an article.

A full list of the services supported by AllVideos and the shortcode for each can be obtained from the following link: Allvideos Shortcodes.

Save the changes using the Save or Save & Close buttons and check the page on the website to confirm the video is working.

If you selected save & close, or, use the close button after checking the changes the article manager will be displayed.

Left-click the icon top-left of the Joomla window to return to the main Joomla administrator home screen.

This concludes the tutorial, Joomla 3: Adding Videos with AllVideos.