Double Tap to Play or Pause the WordPress Audio Player on Touch Devices

Plugin:

Wonder Audio Player

Tutorial:

In the tutorial Use the Space Key to Play or Pause the WordPress Audio Player, we learned how to use the space key to control the audio player. However, on touch devices, there isn't a keyboard available. This tutorial will guide you on how to play or pause the WordPress audio player on touch devices by double-tapping the webpage in mobile web browsers. This tutorial also provides code to support double-click on regular desktop and laptop computers.
Continue reading

How to Modify Grid Gallery Items Before the Gallery Is Rendered on the Page

Plugin:

Wonder Grid Gallery 18.4 or above

Tutorial:

You can use the Wonder Grid Gallery plugin to create a WordPress posts gallery or a custom posts gallery. This plugin allows you to add multiple categories or custom post types to a single gallery.

By default, the gallery displays the posts one category by one category or one custom post type by one custom post type, according to the order in which you have added them to the gallery.

In some instances, you may want to mix all posts or custom post types in a specific order. For example, you may want to display them alphabetically by post title.
Continue reading

Download a Different File Than What is Being Played in the WordPress Audio Player

Plugin:

Wonder Audio Player

Tutorial:

In the Wonder Audio Player plugin, you can easily create a player with download buttons in the playlist. When clicking the button, it will download the audio file that is being played.

However, in some cases, you may want to download a different file than what is being played. For example, you might want to download a PDF script file or a larger WAV file instead of the smaller MP3 file. This tutorial will guide you on how to do it.

Continue reading

How to open a different lightbox gallery by clicking buttons in Wonder Slider

Product:

Wonder Slider, Wonder Grid Gallery

Tutorial:

In the tutorial available at https://www.wonderplugin.com/wordpress-lightbox/how-to-open-a-lightbox-gallery-popup-on-clicking-a-link/, we learned how to open a lightbox gallery popup by clicking a button or text link.

In this tutorial, we will add buttons to an image slider created with Wonder Slider and open a different lightbox gallery upon clicking the buttons in the slider.
Continue reading

Use the Space Key to Play or Pause the WordPress Audio Player.

Plugin:

Wonder Audio Player

Tutorial:

This tutorial will guide you on how to enable the space key to play or pause the WordPress audio player created with Wonder Audio Player. It will also provide the code to use the left arrow key for playing the previous track and the right arrow key for playing the next track.

Continue reading

How to display the current slide number and the total number of slides in the carousel title

Product:

Wonder Carousel

Tutorial:

Wonder Carousel supports macro variables in the content template, which are dynamically replaced by the properties of the current slide when the carousel is rendered.

This tutorial will guide you on how to use macro variables to display the current slide number and the total number of slides in the carousel title.
Continue reading

How to save the current slide ID of the carousel to a web browser cookie and navigate to the slide when the user returns to the page

Product:

Wonder Carousel

Question:

We are using Wonder Carousel with more than 50 text content frames to aid our users in a study program.

We would like to know if there is a way to automatically set a cookie at the most current frame so that when a user returns to the page (same device and browser, of course), the most recent frame will open. Right now, the user has to use the arrow to advance a few or may dozens of pages to get back to where they were in their prior session (if the user even remembers).

Continue reading

How to display a WooCommerce downloadable product in a lightbox popup after purchase

Product:

Wonder Lightbox

Tutorial:

In WooCommerce, you have the option to sell digital products, like PDF ebooks or images. Once customers make a purchase, they can directly download the PDF or image file from their account dashboard.

In certain situations, rather than initiating a direct download upon clicking the download button, you might prefer to display the PDF file or image file directly in a lightbox popup.

This tutorial will provide guidance on implementing this approach.

Continue reading

Open a video lightbox popup on page load and autoplay then close the popup automatically on video end

Product:

Wonder Lightbox

Tutorial:

This tutorial will guide you on how to open a video lightbox popup upon page load, play the video, and then automatically close the popup after the video has finished playing.

At the end of the tutorial, it will also discuss how to redirect to a URL when the lightbox closes.

Continue reading

How to add extra buttons to control a WordPress audio player on the same webpage

This tutorial will guide you how to add your own buttons to play/pause/rewind/fast forward a WordPress audio player created with the plugin Wonder Audio Player.

If the audio player has a playlist, the tutorial will also guide you how to add buttons to play a specific song in the playlist or switch to the previous or next song.

There are two steps in this tutorial:

  • Step 1 - Create an audio player with Wonder Audio Player plugin
  • Step 2 - Add buttons with inline JavaScript to control the audio player
  • Optional - Use custom JavaScript to control the audio player

Continue reading