800,000+ WordPress sites are already using MetaSlider!

How to Add the Date and Time to MetaSlider Slideshows

We had a request from a MetaSlider user this week. They wanted to add the date and time to their slideshow. They were showing slides in a large screen in their offices and wanted visitors to see some great images and the time of day.

This is possible with MetaSlider Pro and a third-party plugin. In this guide, I’ll show you how to add the date and time to your MetaSlider slideshow.

Introducing Layer Slides

If you use the Layer Slides feature in MetaSlider, you can add almost anything in WordPress as a layer on top of images. With Layer Slides, you can add text, video, colors, animations and even other images on top of your first image. And, you can add shortcodes.

This is the solution we came up for this customer. We recommended using the WP Date and Time Shortcode plugin to add date and time data over their slides.


Creating Slides with the Date and Time

  • Start with with MetaSlider Pro and the WP Date and Time Shortcode plugins installed on your site.
  • Go to “MetaSlider Pro” in your admin menu.
  • Click the “New” button in the top toolbar. This will create a new slideshow.
  • Click “Add Slide” in the top toolbar.
  • Choose the “Layer Slide” option.
  • Click the blue “Add to slideshow” button.
    Adding a Layer Slide to MetaSlider
  • You will see a new slide created with a “Layer Slide” heading.
  • Click the “Launch Layer Editor” button.
A new Layer Slide in WordPress
  • There will be a layer box on top of your image. In this screenshot below, I’ve dragged it into the bottom-right corner of the image.
  • Add the time and data shortcode into the layer. In this screenshot, I’m using the most basic version of the plugin’s shortcode.
  • Click “Save”.
Adding a shortcode to a Layer Slide
  • Repeat this process for other images, adding the shortcode into the same place for each slide.
  • Publish your slideshow and you’ll be able to see the date and time on every slide, as in this screenshot below.
Added the data and time to a slideshow

More Possibilities with MetaSlider

If you want to show this on large screen you want to use this full-screen approach for your slideshow. There are also other ways to add elements on top of sldieshows without using Layer Slides. For example, this guide shows how to add a button over your slides. You could also add animation so that the date loads on the screen after the main image.


Leave a Comment

Start Using Your Slider Today!

Create and publish WordPress slideshows in minutes… What are you waiting for?