如何使用 WordPress 音頻塊

已發表: 2021-09-15

WordPress 音頻塊可讓您在頁面和帖子中提供可播放的音頻文件。 可以從您的媒體庫或 URL 添加音頻文件。 用戶可以從他們的瀏覽器播放音頻或下載它們以離線收聽。 這是提供音樂、播客或其他類型的音頻文件供訪問者收聽和使用的好方法。

在本文中,我們將研究音頻塊並了解它是如何工作的。 我們還將研究如何將它添加到您的帖子和頁面,查看使用它的提示和最佳實踐,並查看常見問題。

如何將音頻塊添加到您的帖子或頁面

如何將音頻塊添加到您的帖子或頁面

要添加音頻塊,請在要放置塊的位置單擊塊插入器或在左上角選擇它。 搜索音頻並單擊它。

如何將音頻塊添加到您的帖子或頁面

或者,您可以鍵入/audio並在要放置塊的位置按 Enter。

如何將音頻塊添加到您的帖子或頁面

音頻塊將添加到您的內容中,您可以在其中添加要播放或下載的音頻文件。 單擊以上傳音頻文件,從庫中選擇它,或輸入文件的 URL。

如何將音頻塊添加到您的帖子或頁面

您的音頻文件將顯示為帶有標題的音頻播放器,您可以在其中輸入文件的名稱或其他信息。 它包括基本的音頻播放器選項。

如何將音頻塊添加到您的帖子或頁面

將鼠標懸停在音量圖標上會打開滑塊,用戶可以在其中更改音量級別。

如何將音頻塊添加到您的帖子或頁面

右側是三個點,可為用戶打開選項。 這個有下載鏈接。

音頻塊設置和選項

音頻塊設置和選項

音頻塊包括塊本身和右側邊欄中的設置和選項。 讓我們看看兩者。

音頻塊工具欄

音頻塊工具欄

音頻塊工具欄位於塊上方。 它在您選擇塊時出現,並且包含的工具比大多數 WordPress 塊少。

更改塊類型或樣式

更改塊類型或樣式

將塊轉換為列、文件塊以允許用戶將音頻下載為文件或可以設置樣式的組。 在這個例子中,我將鼠標懸停在 File 上。 它提供了文件作為文件塊的外觀的預覽。

拖動和移動

拖動和移動

拖動工具(帶有 6 個點的圖標)可讓您將塊拖動到您想要的任何位置。 每次單擊箭頭時,“移動”工具(向上和向下箭頭)都會將塊向上或向下移動一個內容空間。 兩者都提供了一種在內容區域周圍移動塊的簡單方法。

更改對齊方式

更改對齊方式

對齊選項決定了塊在屏幕上的位置。 選項包括左、右、寬和全寬。 選擇向左或向右將它放在屏幕的那一側,並用它下面的內容塊包裹它。

更改對齊方式

這是寬寬度,它佔據了屏幕的大部分寬度。

代替

代替

此選項可讓您在不刪除塊的情況下替換音頻文件。 打開庫、上傳文件或輸入文件的 URL。

選項

選項

該選項包括大多數 WordPress 塊中的標准設置:

隱藏更多設置- 這將隱藏右側邊欄。

複製- 這會復制塊,以便您可以將其粘貼到內容中的其他位置。

重複- 這會在原始塊下添加塊的副本。

插入前- 這會在塊之前為塊放置一個空格。

插入後- 這會在塊之後為塊放置一個空格。

移動到- 這使您可以使用藍線移動塊以選擇其位置。

編輯為 HTML - 這會將塊切換到代碼編輯器視圖,以便您可以在不更改其餘塊的情況下編輯 HTML。

添加到可重用塊- 這會將塊添加到您的可重用塊列表中。

- 這會將塊添加到組中,以便您可以將它們作為一個單元進行調整。

刪除塊- 這將刪除塊。

標題

標題

標題還有另一組選項,其中包括粗體和斜體文本、鏈接和更多選項的設置。 我在這個例子中使用了很多。 它們會影響您突出顯示的文本。

粗體和斜體選項可以一起使用或單獨使用。 在上面的例子中,我為“This”這個詞添加了粗體和斜體。

對於鏈接,您會看到以前使用過的人的建議。 它包括在新選項卡中打開鏈接的選項。 我在上面的例子中添加了一個指向“音頻”這個詞的鏈接。

單擊“更多選項”可以設置文本樣式。 它們都會影響您突出顯示的文本。 我在上面的例子中使用了其中的幾個。 它們包括:

內聯代碼——這使文本看起來像代碼。

內嵌圖像——這會從你的媒體庫中添加一個內嵌圖像,就像我在“音頻”和“字幕”這兩個詞之間所做的那樣。

鍵盤輸入– 使用瀏覽器使用的鍵盤 HTML 格式設置文本樣式。

刪除線- 這會在文本中放置一行,就像上面示例中的“標題”一詞。

下標——這使得文本比其他文本更低更小,就像上面例子中的“你”這個詞。

上標- 這使文本比其他文本更高更小。

文本顏色——這會打開顏色工具來更改文本的顏色,就像我在上面的例子中對“你”這個詞所做的那樣。 從預先選擇的顏色中選擇或創建自定義顏色。 對於自定義顏色,您可以使用顏色選擇器或輸入十六進制代碼、RGB 代碼或 HSL 代碼。

音頻塊側邊欄設置

音頻塊側邊欄設置

側邊欄設置添加音頻設置和高級設置。 如果側邊欄未顯示,請選擇齒輪以打開設置。 選擇塊以查看此特定塊的設置。 讓我們仔細看看設置。

音頻設置

音頻設置

音頻設置可讓您選擇音頻播放器處理文件的方式。 將其設置為自動播放將在頁面加載時啟動文件。 將其設置為循環會使文件在到達文件末尾時重新開始。

您還可以選擇預加載的工作方式。 這決定了當頁面加載到用戶瀏覽器時下載了多少文件。 選項包括:

自動- 即使用戶沒有點擊播放,也會下載整個音頻文件。

元數據- 這僅下載文本,這是有關文件的基本信息。 除非用戶選擇播放文件,否則音頻文件本身不會下載。

– 不會自動下載任何信息或數據。

先進的

音頻高級

高級設置包括 HTML 錨和附加 CSS 類的字段。 HTML 錨點是一個 URL,允許您直接鏈接到塊。 附加 CSS 類字段允許您添加 CSS 類以設置塊的樣式。

有效使用音頻模塊的技巧和最佳實踐

使用標題顯示音頻文件的名稱。

使用清晰的標題和段落來描述文件。 這會告知用戶會發生什麼。

將預加載設置為 none 或 metadata 以加快任何不需要自動播放的塊的頁面加載。

對產品 CTA 使用自動播放和循環播放。 禁用頁面上其他音頻塊的自動播放和循環。

選擇“組”以設置音頻播放器的背景樣式。

使用此塊將音頻嵌入到您的頁面和帖子中。

如果您不想包含下載按鈕,請使用帶有文件 URL 的嵌入塊。

關於音頻模塊的常見問題

音頻塊有什麼作用?

它將音頻播放器添加到您的網站,允許用戶播放或下載音頻文件。

使用音頻模塊有什麼好處?

它創建了一個播放器,讓用戶知道有一個音頻文件可供他們收聽。

可以轉換成其他方塊嗎?

是的。 它也可以轉換為文件塊、列或組。 File Block 允許用戶下載文件而不是通過瀏覽器播放。

其他塊可以用於音頻文件嗎?

是的。 您可以將 URL 粘貼到嵌入塊中,但它沒有音頻塊具有的音頻設置。 它會讓你在前端成為一個音頻播放器,但它沒有這個塊提供的那麼優雅。 嵌入式版本包括跟踪欄上的時間,但不包括下載選項或標題。

這個塊的最佳用途是什麼?

此塊可用於音樂、音軌、專輯樣本、播客、佈道、音頻課程、有聲讀物等。

塊可以使用哪些文件類型?

音頻塊與 .mp3、.m4a、.ogg 和 .wav 文件兼容。 播放器的外觀和工作方式與每種文件類型相同。

結論

這就是我們對 WordPress 音頻塊的看法。 這是一個帶有一些設置的簡單塊。 您可以控制它在您的內容中的位置以及它在訪問者瀏覽器中的工作方式。 此塊是與 WordPress 兼容的任何類型的音頻文件的絕佳選擇。

我們希望聽到您的意見。 你使用音頻塊嗎? 請在評論中告訴我們您對此的看法。

精選圖片來自百吉餅/shutterstock.com