Make video slideshow for website

Public album gallery player and carousel slideshow widget now support videos. This is good news if you can present video slideshows on your websites. In beta testing version has some limits but in next release will come to other controls and features.

Video slideshow with Gallery player widget generated from Google photos.

These features are available since version 1.2.32. In this time is a beta only with some limits and testing all functions to the best performance. If you have some tips to improve, please send me a message or comment. I will be glad for suggestions.

There are two existing ways of how to use these features.

Self-writing HTML code to embed.

Since the new version, decorator not using img elements but objects. This is more universal to setup MediaItems frames.

Use handwrite code to decorate carousel slideshow or gallery player with videos. This is easy and quick when you have public file links.

Only one thing which you must add to element is the attributes type. Here is a small example:

<script src="https://cdn.jsdelivr.net/npm/publicalbum@latest/embed-ui.min.js" async></script>

and code to decorate:

<div class="pa-gallery-player-widget"
  style="width:100%; height:480px; display:none;"
  data-show-download-button="true"
  data-title="Video slideshow demo"
>
  <object data="https://www.publicalbum.org/media/video/demo1.mp4"
    type="video/mp4"></object>
  <object data="https://www.publicalbum.org/media/video/demo2.mp4"
    type="video/mp4"></object>
  <object data="https://www.publicalbum.org/media/video/demo3.mp4"
    type="video/mp4"></object>
</div>

Finally, the result of video slideshow:

Here is a final result of code. Demo using three MP4 videos stored on publicalbum.org server and Gallery player widget any without special features.

Generate code from Google photos album with videos.

Another easier way is using my tool to grab Google photos files from a shared album. If your album contains videos, it will automatically detect the type attribute for the video link objects.

In case, if you use grab tool, the video will be playing directly from Google services. If you want to use HD video from Google photos check this post:
https://support.google.com/photos/thread/116996.

For single video embedding, is better to use this tool: Embed Google Photos video with player into website.

Good to know.

  • MP4 video format supported.
  • The integrated player has basic controls without audio volume.
  • You can make video slideshow only or videos combine with images.
  • Be careful when using videos to generate more website traffic.
  • Player now not optimizing video size SD/HD, 480p/1080p or etc.

3 thoughts on “Make video slideshow for website”

  1. Looks nice. How would you start the player dynamically, like if the source objects were loaded via ajax? What javascript function would you call to start the player?

Leave a Reply

Your email address will not be published. Required fields are marked *