前言介紹
- 這款 WordPress 外掛「WaveSurfer-WP」是 2015-11-25 上架。
- 目前有 400 個安裝啟用數。
- 上一次更新是 2020-08-01，距離現在已有 1737 天。超過一年沒更新，安裝要確認版本是否可用。以及後續維護問題！
- 外掛最低要求 WordPress 4.0 以上版本才可以安裝。
- 有 11 人給過評分。
- 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。
外掛協作開發者
x-raym |
外掛標籤
audio | media | player | waveform | visualization |
內容簡介
本外掛可將預設的WordPress音訊播放器替換為可顯示音頻波形的播放器。它可以顯示不同音頻頻道的混音（用於播客、廣播重播、電子學習、音樂等），或同時顯示所有頻道（用於聲音教程、聲音包展示、音訊產品演示等），這是其主要用途。
通過與預設音訊/播放清單短碼一起使用，您可以獲得以下優勢：
- 它適用於您以前的所有文章
- 您仍然擁有可見編輯器中的預設播放器（不僅僅是簡碼）
- 它支持WordPress支持的每種音訊格式（wav、ogg、mp3、m4a）。
- 安全的停用：如果您停用該插件，您的簡碼將回退到WordPress預設的音訊播放器。
全局顏色和樣式設置可以被專用簡碼層級本地覆蓋。
而且，還有一些可在簡碼級別上訪問的屬性：
對於更高級的自定義，您可以使用自定義站點插件搭配過濾器wavesurfer_wp_shortcode_attributes和wavesurfer_wp_shortcode_data，以及JavaScript事件處理程序wavesurfer-wp-init。有關如何使用過濾器的演示，可查看Gist頁面。
額外功能：
- 在一個播放器上按播放會自動將同頁中的所有其他播放器設置為暫停。
- AJAX頁面加載的兼容性
- 多站點友好
預設樣式需要一些Font-Awesome 1.0的圖標，這些圖標作為自定義字體包含在插件中。如果需要，您可以停用此自定義字體。您可以停用預設的WaveSurfer-WP主題，使用自己的主題風格，以便更好的適應您的主題。此外，您還可以自定義CSS选择器。請參考其中一個包含的主題來設定。
更多信息和演示，請前往官方網站。另外，您也可以在GitHub上協助WaveSurfer-WP的開發。主題和翻譯也是非常歡迎！若您只在一些網頁中使用此插件，我建議您使用插件組織或插件邏輯插件，以優化插件運行效率。
原文外掛簡介
This plugin replaces the default WordPress audio player with a player capable of displaying audio waveforms. It can display a mix of the different audio channels (for podcast, radio replays, e-learning, music), or all channels simultaneously (for sound tutorial, sounds-packs showcases, audio products demo etc…), which is its main purpose.
By working with the default audio/playlist shortcode, you have great advantages:
It works with all your previous posts
You still have the default player in the Visual Editor (not just shortcode)
It supports every audio format supported by WordPress (wav, ogg, mp3, m4a).
Safe deactivation: if you deactivate the plugin, your shortcode will fallback to the WordPress default audio player.
Global colors and style settings can be overridden locally by dedicated shortcode attributes.
progress_color="purple"
wave_color="#FF0000"
cursor_color="#FF0000"
height="128"
bar_width="0"
Also, there is some attributes accessible at shortcode level:
mute_button="true"
loop_button="true"
download_button="true"
split_channels="true"
player="default"
For more advanced customization, with a custom site-plugin, you can:
add shortcode attributes conditionally with the filter wavesurfer_wp_shortcode_attributes.
use the wavesurfer_wp_shortcode_data filter if you want to add custom waveform data attributes.
use the wavesurfer-wp-init JavaScript event handler to render the player on custom events, like after click on a button. See examples on the WaveSurfer-WP-Init GitHub repository.
Check this Gist for demos of how to use the filters.
Extra features :
Pressing play on a player automatically set all the others on the same page to pause.
AJAX Page loading compatibility
MultiSite Friendly
The default style requires some icons of Font-Awesome 1.0. These are included in the plugin as a small custom font. Because this icon-font is already used in a lot of themes and plugins, you can deactivate this custom font if needed.
You can deactivate the default WaveSurder-WP theme, and use your own theme style. I strongly encourage you to do that as custom CSS is the only way to make it fit your theme perfectly. There is a lot of dedicated CSS selectors for that. You can take one of the included theme as reference.
This will allow you to have more control on icons, responsivity, mouse hover behavior etc…
More Infos & Demos
You can contribute by to WaveSurfer-WP development on GitHub
Themes and Translations are welcome !
Optimization trick: if you only use this plugin on a couple of pages, I invite you to use a plugin like Plugin Organizer or Gonzales to globally deactivate the plugin or its style, and make it load resources only on pages which need it.
No need for that on the back-end, only for front-end.
This player doesn’t have and will not have Like Button, Sharing Button, Play count and Download count.
If you are looking for a WordPress player with such Social Features and advanced statistics like SoundCloud or Hearthis.at, take a look at ZoomSounds.
For other advanced WordPress integration of wavesurfer-js, you can check WavePlayer by luigipulcini or WaveSurfer-Plus by GalleryCreator.
Contrary to the other WordPress plugin based on wavesurfer-js, wavesurfer-js hasn’t been modified in this plugin. This means that you can extend feature of this plugin using the wavesurfer-js methods, and that updates from the wavesurfer-js community will be pushed in WaveSurfer-WP regularly.
WordPress 5 and Guteberg: Inserting with Gutenberg doesn’t bring the shortcode as it use to be. As this plugin is designed to hook the audio shortcode, you can use the generic shortcode block in gutenberg to manually write your shortcode, or use the classic editor.
WaveSurfer-WP Premium Add-on
A premium add-on is available to add extra features to WaveSurfer-WP.
Cache Peaks File
This add-on creates and loads peaks from small files, containing peaks values. No need to wait for the full audio to be decoded to display its waveform.
Markers System
You can add custom clickable element on your pages to seek WaveSurfer-WP player to a desired position. Can be useful for adding marks, chapters, and it can even be used for interactive audio transcripts!
Plug and Play
These extra features are packed as an add-on. No need to delete and replace the original plugin. You will still be able to benefit from translations made by the community. Also, the core is still open source, to allow contribution.
TimeLine Plugin
When activated thanks to a shortcode attribute, a customizable time ruler will appear below your waveform.
You can buy it from the official product page.
Thanks for considering this way to support WaveSurfer-WP !
Additional Infos
It is a port for WordPress of WaveSurfer-js by katspaugh.
It also contains Download-js by dandavis.
Donators
Thanks to our generous donators for supporting this plugin development !
SignalToNoize.com
hawthonn
Rob
Robert Getzener
Do you want to contribute or sponsor one particular feature ? See you on the donation page. Thanks !
各版本下載點
- 方法一：點下方版本號的連結下載 ZIP 檔案後，登入網站後台左側選單「外掛」的「安裝外掛」，然後選擇上方的「上傳外掛」，把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二：透過「安裝外掛」的畫面右方搜尋功能，搜尋外掛名稱「WaveSurfer-WP」來進行安裝。
（建議使用方法二，確保安裝的版本符合當前運作的 WordPress 環境。
2.2 | 2.3 | 2.5 | 2.6 | 2.7 | 2.8 | 1.0.0 | 1.1.0 | 2.0.0 | 2.1.0 | 2.1.1 | 2.1.2 | 2.1.3 | 2.3.1 | 2.5.1 | 2.5.2 | 2.5.3 | 2.6.1 | 2.6.2 | 2.6.3 | 2.6.4 | 2.7.1 | 2.7.2 | 2.7.3 | 2.7.4 | 2.7.5 | 2.8.1 | 2.8.2 | 2.8.3 |
延伸相關外掛（你可能也想知道）
Visualizer: Tables and Charts Manager for WordPress 》Visualizer: Tables and Charts for WordPress 是一個功能強大且易於使用的外掛，可用於在 WordPress 文章和頁面中創建、管理和嵌入互動式、響應式圖表和表格...。
Chartify – WordPress Chart Plugin 》WordPress 圖表外掛, , 高級版圖表外掛, 圖表外掛展示, 圖表外掛文件, , WordPress 圖表外掛 可建立靜態與動態圖表、圖形和圖表，以提升您的 WordPress 網站...。
Wp-D3 》D3.js 是一個基於資料操控文件的 JavaScript 函式庫。D3 可幫助您使用 HTML、SVG 和 CSS 將資料呈現在網頁上。D3 強調遵循網路標準，讓您擁有現代瀏覽器的所...。
UberChart – WordPress Chart Plugin 》UberChart 是將 Chart.js 庫所包含的無限定制功能帶給 WordPress 的外掛程式。每個圖表有 240 個自訂選項和每個資料集有 30 個選項，非常適合想要自訂每個圖...。
ThreeWP 》綜合介紹：ThreeWP 是一個 WordPress 外掛，將 Three.js 庫及其附加組件集成到您的 WordPress 網站中，使用自定義捆綁文件。這個設置讓您可以直接在您的 Word...。
everviz – Charts, Maps and Tables – Interactive and responsive 》everviz 是一個數據可視化工具，可以幫助您創建互動式圖表、地圖等，而無需編碼。, , 全球的新聞機構、傳訊團隊、政府、學生和研究人員都可以使用這個...。
WP SIMILE Timeline 》此外掛將SIMILE Timeline整合到 WordPress 並提供不同時間軸設定選項的介面。, Timeline 是由 SIMILE Labs 開發的網頁小工具，用於呈現時間資料。, 功能特色...。
Wallnament 》Wallnament 是一個工具，利用擴增實境技術讓您的客戶在自己的空間中可視化您的藝術作品。, 此外掛程式簡化並引導您完成小工具的安裝程序，該小工具是一個按鈕...。
VividWorks 3D E-Commerce Configurator 》將您的VividWorks 3D電子商務配置器帳戶整合至任何WooCommerce商店。, 為您的產品賦予生命，讓您的客戶完整地在三維環境中體驗您產品的所有細節。在線上啟用...。
Tally Graph 》o your WordPress post editor to use the Tally Graph plugin. This plugin allows you to plot custom numeric data over time using the Google Chart API...。
Data Visualizer 》想要在幾秒鐘內將資料視覺化嗎？請使用這個外掛。您可以透過簡單的短代碼輕鬆地視覺化資料，例如：[visualize type=’barchart’ file=’http...。
Data Diagrams: Visual Chart Editor for WordPress 》### 總結文案：, Data-Diagrams 是一個網頁入口，可以輕鬆地創建基於數據驅動的 SVG 圖表，無需任何編程技能。所有內容都是透過簡單的圖形用戶界面定義的。設...。
UVisualize! 》為您的文章和媒體創造一個視覺化的故事！, 創建播放清單, 使用播放清單工具按您選擇的順序創建內容集合，包括音頻、視頻、圖像和文字 - 或者全部都包括！, 講...。
spoonacular recipe visualizer 》如果您想要開始一個美食部落格，這款外掛就是為您而設計。這個外掛允許食譜作者使用三個小工具來增強他們的食譜：, , 成分視覺化工具可使成分列表更具吸引力...。
Map Visualizer 》地圖可視化程式可以讓使用者匯入 CSV 檔案並使用外掛程式的介面製作出一個地圖。, 當您成功匯入（或建立）一個資料來源後，您可以在地圖上視覺化它並且透過簡...。