component
Audio Social Proof
By Ottoni
Details
- OttoniAuthor
- componentType
- $10.00Price
- 2026-07-06Published
- 2026-07-06Updated
- 2026-07-06Added
- PlayersCategories
Summary
Telegram-Style Audio Player
Description
The ultimate social proof tool for infoproducts, paid communities, and launch landing pages. If you are building a sales page for a course, a VIP group, a signal channel, or a membership program, your audience lives on Telegram. Key Features: Full Telegram UI Replication: Includes user avatars, distinct group-style colored usernames, dual-time indicators (current vs. total duration), and the unmistakable Telegram badge layout. Interactive Timeline Scrubbing: Fully interactive waveform. Visitors can click or drag to navigate through the audio testimonial dynamically. Avatar & Identity Support: Features a dedicated circular profile photo slot that handles images perfectly, mirroring how members appear in channels and groups. Dual Layout Modes (Own vs. Received): Toggle between an incoming message from a client (with full identity details) or an outgoing broadcast layout. Automated Dual-Time Layout: Displays both the active playback timer and the total duration simultaneously, maintaining complete behavioral accuracy. Technical Controls (Framer Sidebar): Audio File: Standardized slot for .mp3 , .wav , .ogg , or .mpeg uploads. Fully native execution with zero lag. User Name: Customize the display name to show client names, handles, or roles (e.g., "John | Student"). User Photo: Upload field supporting .jpeg , .png , and .webp to quickly set client avatars. Timestamp: Quick string input to modify the message delivery time and match your page's narrative timeline. Own Message Toggle: Flip the boolean switch to change bubble orientation and styling depending on who is "sending" the audio. Accent Color: Tailor the signature Telegram blue ( #2ca5e0 ) to align with your brand guidelines or specific design themes.
Introduction
Telegram-Style Audio Player
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #7447