LevelNetwork Voxis Accessibility & Audio Summarizer

Official Documentation - Version 1.0.7 (PRO)

1. Introduction

Welcome to LevelNetwork Voxis Accessibility & Audio Summarizer. This plugin adds an elegant and 100% accessible audio player to your WordPress site, converting your text content into spoken audio (Text-to-Speech) utilizing native Web Speech API browser technologies.

Our goal is to increase accessibility and offer an alternative way for your users to consume your content. This guide explains how to configure the free version of the plugin to its full potential.

2. General Settings

Display Area & Placement

You can choose where the player should be automatically added:

  • Posts: The player will appear on blog posts.
  • Pages: The player will appear on standard pages.
  • Both: The player will be enabled globally.
  • None: The automatic display is disabled. You can then use the [voxis_summarizer_player] shortcode to manually insert the player anywhere on your site, including inside Page Builders.

Additionally, if you use the automatic placement (Posts, Pages, or Both), you can choose to display the player Above the content or Below the content.

Exclude by IDs

If you generally want the player engaged on all posts, but excluded on a few specific pages (like your "Contact Us" or "Terms" page), you can define a comma-separated list of Post or Page IDs. The player will never load on these IDs.

Prepend Title to Audio

By default, Voxis will prepend the Article or Page Title to the audio read-out and AI generation prompts. However, if your Content CSS Selector explicitly captures the title as well, the player may read the title twice. You can uncheck this box to disable automatic prepending of the title.

Content CSS Selector

Crucial Configuration: Ensure the plugin reads only the article content (and not menus, sidebars, or footers) by specifying the correct CSS selector that wraps your text content.

By default, this is set to .entry-content, .post-content, article, which works with 90% of classic WordPress themes. If you use a Page Builder, you might need to adjust it:

  • Elementor: Try .elementor-widget-theme-post-content.
  • Divi: Try .et_pb_post_content.
  • You can inspect your site (Right Click -> Inspect Element) to find the primary wrapper class of your articles and enter it here (e.g., .my-article-content).

Exclude CSS Selectors

If your theme or other plugins (like Reading Time or Social Share buttons) insert content directly into your article body, Voxis might try to read them aloud.

To prevent this, use the Exclude CSS Selectors field to provide a comma-separated list of CSS class names or IDs you wish to ignore.

  • Example: .read-time, .share-buttons, #related-posts
  • Page Builders (Enfold/Avada): Voxis PRO automatically pre-filters nested shortcodes before generating the AI Audio. You can successfully specify compound shortcode classes (e.g. .flex_column.voxis-exclude) and the audio generator will exclude those entire layouts perfectly.

When the player reads the article, it will completely skip the text located inside these HTML elements.

3. Voice, Speed, and Volume Configuration

Customize the default behavior of the text-to-speech audio that visitors will hear.

Click the Test button to hear a short audio preview of the selected voice and volume to evaluate its tone.

4. User Player Controls

In the "Frontend Player Options" section, you can decide how much customization freedom to delegate to the site visitor.

  • Show audio track: Displays the real-time progress bar.
  • Show estimated time length: Shows an estimated duration, e.g., -4:30. This helps users understand the content's listening time.
  • User can modify voice speed: Adds a dropdown menu to the player allowing the visitor to speed up or slow down the voice (from 0.50x to 2.00x). This preference is saved in the browser for future visits.
  • Show volume bar: Integrates an interactive slider that allows the user to lower or raise the volume to their comfort level. Under this, you can configure the Default starting volume.
  • Volume bar notify: If enabled, users will see a helpful notification explaining that native voice volume adjustments take effect at the start of the next sentence.
  • User can select their device voice: Different devices have different voice packs. By enabling this, a user (e.g., on iPhone) can manually switch voices directly from the player.
  • Share Audio Snippet: Adds a share button that lets users generate a special URL linking directly to the exact point in the audio they are currently listening to (via the ?voxis_t=XX parameter), instantly Auto-Playing when clicked. Note: this button is disabled during AI Summary playback.

5. Appearance and Custom CSS

The player is designed to highlight your content while maintaining extreme minimalism. Choose from one of the 10 Predefined Color Palettes to align the audio player with your site's branding.

Custom CSS Editor

For developers or advanced visual customizations, the Custom CSS box supports custom stylesheets.

New: The CSS editor now includes line numbering and built-in syntax validation. If you miss a space, brace, or colon, you'll be warned directly with the line number to prevent broken styles!

Basic structure of classes you can override:

/* General Player Container */
.voxis-player-wrapper {
    /* E.g., make borders rounder */
    border-radius: 20px; 
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

/* Play / Pause Buttons */
.voxis-player-wrapper .voxis-btn {
    font-weight: 700;
    text-transform: uppercase;
}

/* Share Snippet Button */
#voxis-share-btn {
    /* Customize the circular share button */
    border-radius: 50%;
}

/* Share Tooltip / Popup Box */
#voxis-share-tooltip {
    /* Modify tooltip appearance or width */
    background: var(--voxis-btn-bg);
}
#voxis-share-link {
    /* Style the input box containing the copyable URL */
    background: #fff;
}

/* Progress Time Tooltip */
#voxis-time-tooltip {
    background: var(--voxis-btn-bg);
    color: var(--voxis-btn-text);
}

/* Progress Track (Background and Fill) */
.voxis-track-container {
    background-color: var(--voxis-bg); 
}
.voxis-track-progress {
    background-color: var(--voxis-status-color); 
}

/* Volume Control Container & Slider */
.voxis-volume-container {
    background-color: var(--voxis-bg);
}
.voxis-volume-progress {
    background-color: var(--voxis-status-color);
}
.voxis-volume-label {
    font-size: 11px;
    color: var(--voxis-icon-color);
}

/* Audio Jump Buttons (-10s / +10s) */
.voxis-jump {
    padding: 0 8px; /* Adjust spacing around the skip buttons */
}
.voxis-jump .voxis-icon {
    font-size: 12px; /* Skip icon size */
}

/* Neural Voice Download Button */
.voxis-download {
    border-radius: 50%; /* Circle shape */
    background-color: var(--voxis-border);
}

/* Text Highlight & Tracking Buttons */
.voxis-highlight, .voxis-tracking {
    /* Customize the sync option buttons */
    border-radius: 50%;
}

/* Floating Player Container */
.voxis-is-floating {
    bottom: 20px !important; /* Spacing from bottom of screen */
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

6. Troubleshooting

7. Premium Features (PRO) Usage

Welcome to LevelNetwork Voxis Accessibility & Audio Summarizer PRO. This section outlines how to configure the advanced tools you've just unlocked.

1. AI Audio Summaries

Voxis PRO can condense long articles into rapid 1-3 minute TL;DR audio briefings.

  • API Keys: You must provide an API key for your chosen engine to enable this feature. Get your key: OpenAI, Anthropic, or Google Gemini.
  • Summarization Engine: Head to Settings -> Voxis Audio. Select your preferred engine (GPT for fast, cost-effective summaries, Claude for natural phrasing, or Google Gemini for versatile text processing). The AI will automatically generate both a text summary and a dedicated MP3 audio file utilizing your configured Neural Voice provider.
  • Custom Model Versions: You can explicitly specify the exact model version to use for inference (e.g. gpt-5.4-mini, claude-haiku-4-5-20251001, or gemini-3.5-flash). This allows you to upgrade your models without waiting for plugin updates if the defaults become deprecated.
  • Summary Length: Choose between "Short" (approx. 1-2 mins) or "Medium" (approx. 3-5 mins).

2. Hyper-Realistic Neural Voices

By connecting your own API key, Voxis bypasses the visitor's local system voices, providing ultra-realistic, studio-quality narration that sounds perfectly identical regardless of the user's browser or device.

  • API Keys: You must provide an API key for your chosen provider to enable this feature. Get your key: OpenAI, ElevenLabs, or Google Cloud.
  • Voice Provider: Choose between OpenAI TTS, ElevenLabs Premium, or Google Cloud TTS.
  • Voice Selection: You can explicitly select the voice model you wish to use (e.g. Alloy, Echo, Fable for OpenAI, or input custom Voice IDs for ElevenLabs).
  • API Key: Input the secret API key provided by your chosen platform. Doing so fully activates the Cloud Audio feature. Important: Each provider requires its own specific API key. Google Cloud TTS requires a standard GCP API key (not a Gemini key). OpenAI requires an API key with billing enabled. ElevenLabs requires an active subscription key.

Feature Interactions (Important Considerations):

Different PRO features interact with each other. Here is what you need to know:

  • Text Highlighting Sync: If you enable this, the text will be visually highlighted word-by-word as it is read aloud. However, if you enable an AI Summary, Text Highlighting is automatically disabled. Why? Because the generated summary text is completely different from the original article text, so it cannot be synced word-by-word with the visual paragraphs.

    Sync Fine-Tuning: Each neural voice, language, and punctuation style has its own natural cadence and pacing. Since Voxis calculates highlighting progress mathematically (without the overhead of heavy AI processing nodes on the frontend), you might sometimes experience delays or advanced highlighting depending on the provider you use. In the Pro settings, you can use the Sync Fine-Tuning variables to adjust the mathematical calculation:
    • Global Shift (seconds): Shifts the entire highlighting tracking forward or backward mathematically by a specific time (e.g. +0.5s or -1.2s), resolving linear desynchronization.
    • WPM Base (Words Per Minute): Changes the word-per-minute estimation used if the exact audio duration is unavailable or needs fallback speed correction. The default value is 130 WPM.
  • Volume Control Behavior: The user's frontend volume slider responds instantaneously to Neural Voice MP3s since they are loaded as standard audio sources. However, if the site falls back to the native browser TTS, the volume slider will apply changes smoothly at the start of the next spoken sentence chunk due to browser Web Speech API limitations.
  • Download MP3 Button: The download button is only available if you are using a Neural Voice (Cloud Voice) with an API key. Local native browser voices (Free functionality) do not generate physical audio files, meaning there is no MP3 to download.
  • Draggable Floating Player: If enabled, the player transforms into a miniature floating bubble when the user scrolls down your article. It can be dragged anywhere on the screen, allowing users to move it out of the way while they pause or skip. You can also configure the background opacity of the floating player.
  • Audio Jump Controls: You can enable +/- rewind and forward buttons on the player. You can configure exactly how many seconds it jumps (e.g. 10s). Note: This feature is only active when using Cloud Neural Voices or AI Summaries (since it requires a physical MP3 timeline rather than native browser TTS streaming).
  • Debug Console Logging: If you face generation issues or missing audio, there is an isDebugConsoleMessageShow toggle built into the code. When set to true, Voxis PRO will safely log raw responses from OpenAI, Gemini, Claude, and ElevenLabs directly into your local error logs, helping you instantly spot disabled API keys or exhausted credits.

3. Post Content Updates & Metabox Regeneration

When you edit a post, the PRO features will not automatically regenerate audio by default, to save you API costs. However, you will notice a new Voxis Audio Generator metabox on the right side of your WordPress Post Editor screen.

  • Over there, you will find checkboxes to explicitly request audio and/or summary regeneration on save.
  • If you heavily update your article and want the audio to reflect the new text, simply click "Enable to Regenerate" (which turns on the checkbox) and click "Update" on your post.
  • Deleting Summaries: If you want to delete a generated summary to either clear the post state or rewrite it entirely, you can simply clear the text box containing the summary text and click Update. This deletes both the text and the dedicated summary MP3 audio file. Note: if you are using the Gutenberg Block editor, you may need to refresh the page after saving to see the updated metabox UI.
  • Inline Summary Editing: The text of your generated AI Summary is exposed in a text box directly in the metabox. You can freely edit this text, fix typos, and hit Update. To generate a new MP3 audio track from your edited text, simply check the "Enable to Regenerate" box for the AI Summary before saving.
  • Quick Row Actions: It is also possible to generate or delete the MP3 and AI Summary directly from the quick actions of the article (under the post title in the Posts list) without entering the editor!

4. Bulk Generator (New)

Voxis PRO includes a powerful utility to generate audio and AI summaries in bulk across your entire site.

  • Background Processing: You can select specifically whether to process Posts or Pages, and whether to generate "MP3 Only", "AI Summary Only", or "Both".
  • Smart Skipping: If you select "Both" but an article already has the MP3 generated, the Bulk Generator will automatically skip the audio generation step (saving you API credits) and will solely focus on generating the missing AI Summary. It never overwrites existing content unless requested manually from the individual Post Metabox.
  • Important Requirement: Because the sequential generation is handled in real-time by your browser (to communicate securely with your server), you must keep the Bulk Generator browser tab fully open until the progress bar reaches 100%. If you close the window or navigate away, the background queue will interrupt.

5. API Cost Estimates Example (OpenAI)

Note: Generating audio using cloud providers consumes credits from your connected API account (Pay-As-You-Go). Always set strict usage limits in your cloud provider dashboard to avoid bill shock.

Using OpenAI's latest models, the costs are incredibly low:

  • Neural Voices (TTS-1): Costs approximately $15.00 for 1,000,000 characters. For a typical blog post of 5,000 characters, generating the cloud audio file will cost about $0.075 (7.5 cents).
  • AI Summarization (GPT-4o Mini): Costs approximately $0.15 per 1,000,000 input tokens. Summarizing a 5,000 character article will cost practically $0.001 or less.
  • Remember: These Cloud processes only run once per article (when you save or regenerate the post). Once the MP3 and Summary text are generated, they are saved and served to infinite visitors at absolutely zero additional API cost.

6. 10 Extra Color Palettes

You have access to premium aesthetics, such as Neon Cyber, Royal Gold, Minimal Light, and more. Scroll down to the PRO Palettes section in the settings and click on your favorite color scheme. The frontend player will instantly be updated.

7. License Activation

To use Voxis PRO on a live production environment, a valid Lemon Squeezy license is required.

  • Navigate to the Voxis settings page in your WordPress admin dashboard.
  • On the right side of the screen, you will find the Voxis PRO License card.
  • Enter the license key provided to you after your purchase and click Validate License.
  • If the validation is successful, you will see a green "Pro Active" message and the PRO features will be permanently unlocked and able to communicate with our remote generation servers.

Designed and Developed by Level Network.