Playback full video with sound and controls directly in the slideshow

Playback full video with sound and controls directly in the slideshow

You can play the videos directly on the slide without opening them in the modal window. Depending on what fits you best you can use one of the methods (in a slide or in modal/popup window).

Step #1 - Create the Album

First, you need to create the new Album (you can also modify any of the existing albums if needed, but in this tutorial, we will focus on creating the new Album). To do this go to DJ-MediaTools -> and click " New Album " and fill all the fields that you may find required for your setup. You can learn more about creating new Albums from the documentation article:  Creating new Album

Step #2 - Add videos to the album 

Videos can be added to the album in two ways: directly in the Album settings or in Custom items view.

When adding the videos in the album settings you simply need to paste the video URL (it can be YouTube.com, Vimeo.com, Dailymotion.com, Metacafe.com, LiveLeak.com, Yahoo Movies or direct URL to the local/remote MP4 video) in the Full video field and it will be automatically added to the Album as a custom item.

Add video-mt

If you want to add the videos as custom items (more control over the settings) you need to go to DJ-MediaTools -> Custom items and filter the Album you want to add the videos to and start adding videos as custom items one by one. Learn more about Creating the new custom item.

Step #3 set up video playback in the slide

Now you need to change a setting responsible for playing the video in the slide. Open the Album and go to the Basic album options. 

Choose your Album layout and set Video playback option to: " In the slide". 

Joomla-gallery-video-playback-in-slide-settings

These settings are essential to get the video in slide running. You can make other changes as needed for the Album. 

Save the Album to store the settings.

Please note: Video in the slide feature is supported in the following album layouts: Slideshow, Slideshow with Thumbnails, Tabber, Modern Slider, Gallery Grid and Masonry. Other layouts can not support this feature, because of their design/script limitation.

Step #4 Check the album on the front end

This is a short video presenting how the slides with videos can look like. This is just an example. Remember that you can do much more with all the available layouts and rich settings of DJ-MediaTools.

The videos will stop playing when you change the slide and will start playing again when you get back to the slide. So the video is played back only when the slide is active so you do not need to worry about audio being played one on another.

Example of the videos played in the slides of Modern Slider layout:


      • Related Articles

      • How to use video background instead of image in the slideshow?

        If you want to create a more eye-catching slideshow on your website you can now use YouTube, Video or MP4 video in the slideshow instead of a static image.  Background Video option is available since DJ-MediaTools 2.12+ . It's applicable only for ...

      • An easy trick to bring life to the adverts or products

        If you're tired of static images in the products or classifieds pages, there's an easy trick to make it dynamic (and I do not mean adding videos). The effect Let's start from the final effect, so you know what we are after. Once you have integrated ...

      • Watermarks in DJ-MediaTools [VIDEO]

        I will explain how Watermarks in DJ-MediaTools works. Watermarks will let you protect your images from being downloaded and used on other websites without credits to you or your website. This feature allows you to choose the watermark image you want ...

      • How to create full-width slider in DJ-MediaTools ?

        You can set up the slideshow to display on whole window width. First of all, you need to choose proper module position in your Joomla template which is 100% wide. If you are not sure if there is such module position you can contact your template ...

      • DJ-Messages – сообщения в Joomla