How to load Wonder plugin JS files as non-render blocking and improve the webpage loading performance

Product:

All Wonder Plugins

Tutorial:

By default, Wonder plugins load the plugin JS files in the WordPress header. While this provides best compatibility with all kinds of WordPress themes, JS files in the header will be render-blocking. That's, the webpage will only be rendered after the JS files are loaded.

There are two methods to load the JS files as non-render blocking and fix the issue.

  • First method: load Wonder plugin JS files in the WordPress footer
  • Second method: use a third-party plugin to aggregate the JS files and load it as non-render blocking

We will also discuss plugin conditional loading at the end of this tutorial:

  • Plugin conditional loading: only load plugins on selected pages or posts

Continue reading

How to open a Wistia video in a WordPress lightbox

Product: Wonder Lightbox

Tutorial:

After installing the WordPress plugin Wonder Lightbox, by adding a class name wplightbox to a link, you can easily change the link to a WordPress lightbox popup and use it to open an image or a video in the lightbox popup.

This tutorial will guide you how to open a Wistia video in a WordPress lightbox.

Continue reading

How to dynamically add or remove images and videos in WordPress grid gallery using JavaScript

Product: Wonder Grid Gallery

Level: Advanced

Tutorial:

You can use the premium WordPress plugin Wonder Grid Gallery to create an image and video grid gallery. This tutorial will guide you how to dynamically add or remove images and videos in the gallery using JavaScript.

Continue reading

How to display date, author, categories and tags in WordPress post gallery and WordPress custom post type gallery

Product:

Wonder Grid Gallery 17.0 or above

Tutorial:

In Wonder Grid Gallery, step 4 Options tab, Text and Grid Content, you can add the pre-defined macro variables to the text overlay content and grid content. The macro variables will be dynamically replaced by the content of the gallery item.

Continue reading

WordPress Audio Player plugin: how to configure the mp3 URL in the shortcode

Product:

Wonder Audio Player

Tutorial:

Wonder Audio Player is an easy to use WordPress plugin that can help you create mp3 players for your WordPress sites.

To create a WordPress audio player, in the plugin, step 1, you can add mp3 files to the playlist, the plugin will build the player and provide you with the shortcode. You can then add the player shortcode to a WordPress post or page.

In some cases, for example, you have tens or even hundreds of mp3 files, instead of creating a player for each mp3 file, you may want to only create one player and reuse the same player for all mp3 files.

This tutorial will guide you how to create a player, then reuse it for all other mp3 files.

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 to control the audio player

Continue reading

Plugin conditional loading: how to activate and load WordPress plugins on selected pages or posts only

By default WordPress will enable all activated plugins on all WordPress posts and pages, and will load all relative CSS and JavaScript plugin files on these pages.

In some cases, you may want to only enable a plugin and load the relative files on some specific pages. For example, if your website has a gallery page, you may want to only enable the gallery plugin on this page, thus speed up the loading of other pages.
Continue reading

Not allowing to edit images or add new images

Product:

Wonder 3D Carousel, Wonder Carousel, Wonder Gallery, Wonder Grid Gallery, Wonder Slider

Tutorial:

You may notice that after you upgrade your WordPress to version 5.5 or above, you may not be able to edit images or add new images to Wonder plugins. The OK and Cancel buttons are missing from the Add Image dialog.

not-allow-edit

This problem is caused by changes in WordPress 5.5.

To fix the problem, you can upgrade the Wonder plugin to the latest version.

The Standard/Multiple/Unlimited licenses include one year support and free upgrade from the date of the purchase. If your free upgrade period has expired, you can log into the members area on our website, click Renew and Upgrade on the left menu, renew your license with 50% discount, or upgrade to the Lifetime license.