CM Tooltip (CMTG) - API - Audio Integration

Adding Audio files to your Tooltip

The CM Tooltip eCommerce edition allows you to incorporate an HTML5 audio player in the glossary term page and also inside the tooltip. Supported file types are mp3, .m4a, .ogg, or .wav files.

The Tooltip AudioPlayer uses WordPress’s  default player.

To add an audio file to any term, user needs to edit the term page and insert the URL of the audio file. It is also possible to upload the audio files using “Add media” button and copy & paste their permalinks to the audio area in the term editing page as show below: 

tooltip audioplayer for WordPress in the term page

Enabling The Tooltip AudioPlayer in the Plugin Settings

The audio player has two modes:

  • The limited mode will only show “PLAY/ PAUSE” buttons.
  • The full mode will also display a file name and other controls typical for the audio player

Audio player location can also be controlled in the plugin settings.
In the term page it can appear Above content, Below Content or not at all.
In the tooltip it has this options as well.

In the Glossary index page each term with audio attached, can have an audio icon next to the title. (see Audio in the Index Page below)

Here is how the audio player is embedded inside the term page

3tooltip audioplayer for WordPress- CM glossary plugin
Here is the audio-player as embedded inside the tooltip
tooltip audioplayer for WordPress

Styling the Audio Player

The audio player options are limited within the plugin, because it's part of the WordPress core and doesn't have any options.

But it can be customized to suit your site with the CSS. Here's a link to a great article covering the  styling of the audio player in WordPress.

Audio in the Index Page

Once a term has an associated audio file assigned to it a tone icon will be shown next to it like in the screenshot below.

It is possible to remove this sign which uses the following css.

label.cmtt-post-format-icon.cmtt-post-format-audio { display: none;}

Audio from the Dropbox

In order to use the audio files stored on the Dropbox please follow this guide:

1) Go to the Dropbox generated page for the file
2) Right click the Audio Player in the middle of the screen and choose "Inspec Element"
3) Find the location of the <audio> HTML tag in the page source eg. (https://www.screencast.com/t/4AECjb9euCP)
4) Copy the value of the src attribute
5) Add the: &.mp3 at the end of the url
6) Paste the link in the Audio Url metabox


More information about the CM Tooltip Glossary WordPress  Plugin

Other WordPress products can be found at CreativeMinds WordPress Store

Let us know how we can Improve this Product Documentation Page

To open a Support Ticket visit our support center