How to display single button WordPress audio players and text in one line

Last updated on

Product:

Wonder Audio Player

Tutorial:

You can use the Wonder Audio Player plugin to create a single button WordPress Audio Player, and you may want to display the audio player and text in one line.

This seems like an easy task, but in fact, it's quite difficult. The reason is that text is normally added to the webpage as a paragraph <P></P>, whereas the audio players are rendered as DIV blocks <DIV></DIV>, and a paragraph cannot contain block-level elements. If you simply add them to one line, they will break into multiple lines on the front page.
Continue reading →

How to add images to the player track list for each audio

Last updated on

Product:

Wonder Audio Player

Tutorial:

This tutorial will guide you how to add a different image to each audio in the WordPress audio player track list.

There are 4 steps in this tutorial:

  • Step 1 - Add an image to each audio in the player
  • Step 2 - Change the track list format and add the image
  • Step 3 - Add CSS code to style the images

Continue reading →

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

Last updated on

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 time marks to WordPress audio player

Last updated on

This tutorial will guide you how to add time marks to a WordPress audio player created with the plugin Wonder Audio Player. When clicking on the time mark, the player will jump to the specified time and start playing.

The tutorial will also guide you how to add play, pause, rewind and forward buttons to the player.

There are two steps in this tutorial:

  • Step 1 - Create an audio player with Wonder Audio Player plugin
  • Step 2 - Add time marks to the audio player

Continue reading →

How to add WordPress audio player to Elementor page builder?

Last updated on

Elementor is one of the most popular WordPress page builders. This tutorial will guide you how to add an audio player to Elementor page builder. You can create an audio player with playlist or a single mp3 file.

There are 3 steps in the tutorial:

  • Step 1 - Install Wonder Audio Player
  • Step 2 - Create a WordPress audio player
  • Step 3 - Add the WordPress audio player to Elementor page builder

Continue reading →

How to add a WordPress audio player with playlist to Divi theme

Last updated on

This tutorial will guide you how to add a WordPress audio player with playlist to Divi page builder of Elegant Themes.

There are 3 steps in the tutorial:

  • Step 1 - Install Wonder Audio Player
  • Step 2 - Create a WordPress audio player with playlist
  • Step 3 - Add the WordPress audio player to Divi page builder

Continue reading →

WordPress Shoutcast Player

Last updated on

This tutorial will guide you how to create a Shoutcast live streaming audio player for your WordPress website. The player displays the current song title and the played track list.

There are 5 steps in the tutorials:

  • Step 1 - Install Wonder Audio Player
  • Step 2 - Prepare Shoutcast Live Streaming URL
  • Step 3 - Create an Audio Player to Play the Shoutcast Live Streaming
  • Step 4 - Select a Skin for Live Streaming Audio Player
  • Step 5 - Publish the player

At the end of this tutorial, we will also discuss the common problems when creating the player.

Continue reading →