All Tutorials

Your One-Stop Destination for Learning and Growth

Zoom and Save Sound Waves as PNG Images with DZS ZoomSounds Plugin

If you're looking to display sound waves as PNG images using the DZS ZoomSounds plugin for WordPress, keep reading! In this post, we will cover how to install the plugin, configure it, and save the sound wave as a PNG image.

Prerequisites

Before getting started, make sure you have:

  1. A self-hosted WordPress website
  2. The DZS ZoomSounds plugin installed (available in the WordPress Plugin Directory)
  3. An audio file uploaded to your media library

Installing and Configuring DZS ZoomSounds

To install the DZS ZoomSounds plugin, follow these steps:

  1. Log into your WordPress admin dashboard
  2. Go to the Plugins > Add New page
  3. Search for "DZS ZoomSounds" in the search bar
  4. Click "Install Now" and then "Activate"

Now that you've installed the plugin, go to the Settings > ZoomSounds page to configure it. Here, you can select your preferred audio player design, set various options like autoplay, loop, and more. Don't forget to save your changes!

Saving a Sound Wave as a PNG Image

To save a sound wave as a PNG image using DZS ZoomSounds plugin, follow these steps:

  1. Go to the post or page where you want to display the sound wave image
  2. Add the [sound-player id="<id>"] shortcode in the location where you'd like the player and the image to appear. Replace <id> with the ID of the audio file that you have uploaded to your media library.
  3. To display only the sound wave image, add the following CSS code snippet to your site:
    .wp-zoom-content {
   display: none;
}
  4. Save and publish your post or page.
  5. Now, you can access the PNG image by appending /png to the end of your audio file URL. For example, if your audio file URL is https://yourwebsite.com/wp-content/uploads/2021/10/example.mp3, the corresponding PNG image URL will be https://yourwebsite.com/wp-content/uploads/2021/10/example.mp3.png.

Conclusion

With this setup, you've successfully installed and configured the DZS ZoomSounds plugin to save sound waves as PNG images. This unique feature allows you to engage your audience by providing a visual representation of the audio content on your website. Happy designing!

Published April, 2024