Cách thêm tiện ích phát nhạc Audio vào WordPress

Mục lục

Gần đây, nhiều độc giả đã hỏi WPBeginner Việt Nam liệu có cách nào để làm cho các website WordPress trở nên tương tác hơn không.

Một trong những yêu cầu phổ biến nhất mà WPBeginner Việt Nam nhận được là thêm tiện ích phát nhạc vào website WordPress. Tính năng này có thể thúc đẩy sự tương tác của người dùng và tạo ra trải nghiệm thú vị hơn cho người dùng, đặc biệt là trên các website hoặc blog liên quan đến âm nhạc.

Trong hướng dẫn toàn diện này, WPBeginner Việt Nam sẽ hướng dẫn bạn từng bước để thêm tiện ích trình phát nhạc vào trang WordPress của bạn. Chúng tôi sẽ đề cập đến 2 phương pháp để bạn có thể sử dụng phương pháp phù hợp nhất với kỹ năng kỹ thuật và yêu cầu của website.

Cách thêm tiện ích phát nhạc vào WordPress

Tại sao nên thêm tiện ích phát nhạc Audio Music Player vào WordPress

Tiện ích trình phát nhạc cho phép người dùng nghe âm thanh trực tiếp trên website WordPress của bạn. Tính năng này đặc biệt có giá trị đối với những người làm podcast, người sáng tạo content và nhạc sĩ muốn giới thiệu tác phẩm của mình.

Nó có thể khuyến khích mọi người truy cập trực tiếp vào website của bạn thay vì phát âm thanh của bạn trên các nền tảng khác. Khi những người này vào website của bạn, bạn có thể kiếm được nhiều tiền hơn bằng cách hiển thị quảng cáo trên blog WordPress của mình hoặc bán file âm thanh dưới dạng download digital.

Ngay cả khi bạn không tạo bất kỳ âm thanh gốc nào, việc nhúng content từ các nền tảng của bên thứ ba như Spotify là một cách dễ dàng để tạo ra một website hấp dẫn hơn. Cách tiếp cận này có thể giữ chân người dùng trên website của bạn lâu hơn, cải thiện các số liệu quan trọng của website như thời gian trên website.

Thêm vào đó, tiện ích trình phát âm thanh không chỉ giới hạn ở âm nhạc. Nó có thể được sử dụng cho podcast, sách nói hoặc content giáo dục, giúp website của bạn linh hoạt hơn với nhiều đối tượng hơn, bao gồm cả những người thích content âm thanh hoặc khiếm thị.

Với suy nghĩ đó, WPBeginner Việt Nam sẽ chỉ cho bạn cách thêm trình phát nhạc âm thanh vào WordPress bằng 2 phương pháp. Bạn có thể sử dụng các link nhanh bên dưới để chuyển thẳng đến phương pháp bạn muốn sử dụng:

Sẵn sàng chưa? Hãy cùng khám phá cách đưa sức mạnh của âm nhạc vào website WordPress của bạn.

Phương pháp 1. Cách thêm tiện ích phát nhạc bằng Audio Block (Dễ)

Với phương pháp này, bạn có thể tạo trình phát âm thanh đơn giản bằng block WordPress Audio tích hợp. Khối này có thể phát bất kỳ định dạng file âm thanh nào, bao gồm file .mp3, .m4a, .ogg hoặc .wav.

Trình phát âm thanh tích hợp của WordPress rất đơn giản so với hầu hết các plugin. Nó có nút phát/tạm dừng, nút điều khiển âm lượng, nút download và nút thay đổi tốc độ phát lại.

Tiện ích trình phát nhạc được tạo bằng block Âm thanh

Đây là lựa chọn tốt nếu bạn muốn thêm một vài đoạn âm thanh ngắn vào website của mình mà không cần bất kỳ tính năng nâng cao nào.

Nếu bạn nhúng content từ nền tảng của bên thứ ba được hỗ trợ như Spotify hoặc SoundCloud, block Âm thanh sẽ hiển thị các điều khiển phát lại cho nền tảng đó. Nó cũng có thể hiển thị một số content bổ sung từ nền tảng, chẳng hạn như tên nghệ sĩ và ảnh bìa.

Ví dụ, đây là block Âm thanh có nhúng content SoundCloud.

Trình phát âm thanh có content SoundCloud nhúng

Để thêm trình phát nhạc đơn giản vào website WordPress của bạn, bạn có thể mở bất kỳ trang hoặc bài đăng nào và nhấp vào icon ‘+’.

Trong popup xuất hiện, nhập ‘Âm thanh’ vào thanh tìm kiếm để tìm block phù hợp. Sau đó, bạn có thể nhấp vào block Âm thanh để thêm vào trang của mình.

Khối âm thanh WordPress tích hợp sẵn

Tại thời điểm này, bạn có thể thêm file âm thanh hoặc nhúng đoạn âm thanh từ nền tảng khác.

Ghi chú: Trong hầu hết các trường hợp, WPBeginner Việt Nam khuyên bạn nên lưu trữ file âm thanh và video của mình trên website của bên thứ ba vì nhiều lý do, bao gồm tối ưu hóa chất lượng và tiết kiệm băng thông. Sau đây là lý do tại sao bạn không bao giờ nên tải video lên WordPress.

Để thêm file âm thanh từ máy tính, hãy nhấp vào “Tải lên” rồi chọn file từ ổ đĩa cục bộ trên máy tính.

Một lựa chọn khác là nhấp vào nút ‘Thư viện phương tiện’ rồi chọn một file hiện có trong media library WordPress của bạn.

Tải file âm thanh lên website WordPress của bạn

Nếu bạn upload toàn bộ âm thanh, bạn có thể muốn cung cấp cho người dùng option hỗ trợ công việc của bạn với tư cách là nhạc sĩ hoặc người làm podcast bằng cách gửi cho bạn một khoản quyên góp. Để biết hướng dẫn từng bước, bạn có thể xem hướng dẫn của WPBeginner Việt Nam về cách thêm nút quyên góp Stripe vào WordPress.

Bạn có muốn nhúng âm thanh từ nền tảng khác không?

Thao tác này giống như thêm video vào WordPress. Bạn chỉ cần dán link YouTube và WordPress sẽ tự động đưa trình phát vào trang của bạn.

Chỉ cần lưu ý rằng hầu hết các nền tảng chỉ nhúng bản xem trước của file âm thanh đầy đủ. Khối này thậm chí có thể khuyến khích mọi người rời khỏi website của bạn và truy cập nền tảng của bên thứ ba để nghe toàn bộ âm thanh.

Trong hình ảnh sau, block Âm thanh hướng người truy cập tới website Spotify.

Danh sách phát Spotify được nhúng trong WordPress

Nếu bạn là nhạc sĩ, điều này có thể làm tăng tiền bản quyền của bạn bằng cách khuyến khích người dùng phát content của bạn trên các nền tảng khác. Tuy nhiên, nó cũng có thể khiến mọi người rời khỏi website của bạn và chuyển sang các nền tảng khác.

Để nhúng âm thanh từ nền tảng của bên thứ ba, bạn có thể bắt đầu bằng cách nhấp vào nút ‘Chèn từ URL’. Thao tác này sẽ mở một thanh ‘Dán hoặc nhập URL’ nhỏ.

Dán file âm thanh bằng URL

Bây giờ bạn có thể nhập URL của đoạn âm thanh mà bạn muốn nhúng vào blog WordPress của mình.

Thông thường, bạn chỉ cần truy cập bài hát hoặc âm thanh bạn muốn nhúng và sau đó mở cài đặt ‘Chia sẻ’.

Sau đó, bạn có thể sao chép URL được cung cấp.

Ví dụ, chúng ta hãy xem cách bạn có thể nhúng bất kỳ bài hát Spotify nào vào website của mình.

Để bắt đầu, hãy tìm bài hát hoặc danh sách phát bạn muốn thêm vào website WordPress của mình. Sau đó, chỉ cần nhấp vào ba dấu chấm mà Spotify hiển thị bên cạnh danh sách phát hoặc bài hát.

Thêm âm thanh Spotify vào website WordPress

Sau khi bạn đã thực hiện xong, hãy nhấp vào Chia sẻ » Sao chép bài hát.

Để thêm âm thanh vào tiện ích trình phát nhạc, hãy dán link vào block Âm thanh.

URL 'Chia sẻ' của Spotify

Trong ví dụ Spotify của WPBeginner Việt Nam, WordPress sẽ biến block Âm thanh thành block Spotify.

Sự thay đổi này diễn ra tự động nên bạn không cần phải lo lắng.

Khối Spotify của WordPress

Sau khi thêm file âm thanh, bạn có thể nhấp vào block Âm thanh để xem những cài đặt nào bạn có thể cấu hình cho block đó.

Cài đặt bạn thấy có thể khác nhau tùy thuộc vào việc bạn đã upload file âm thanh hay nhúng bản xem trước từ website của bên thứ ba. Ví dụ: bạn thường có thể đặt âm thanh tự động phát bằng cách nhấp vào nút chuyển đổi ‘Tự động phát’.

Cài đặt tự động phát và lặp lại của WordPress

Hầu hết các cài đặt này đều dễ hiểu, vì vậy bạn nên khám phá chúng để xem cài đặt nào phù hợp nhất với website của mình.

Bạn có thể cập nhật hoặc xuất bản trang khi bạn hài lòng với cách thiết lập block.

Bây giờ, nếu bạn truy cập trang trên website của mình, bạn sẽ thấy trình phát nhạc trực tiếp. Bạn cũng có thể nghe âm thanh bằng các nút điều khiển phát lại của block.

Phương pháp 2. Cách thêm tiện ích phát nhạc bằng plugin (có thể custom nhiều hơn)

Khối âm thanh WordPress là một công cụ đơn giản để thêm trình phát âm thanh. Dễ sử dụng, nhưng không cung cấp nhiều option để thay đổi giao diện hoặc cách hoạt động.

Ngoài ra, bạn không thể tạo một trình phát và sử dụng nó ở các phần khác nhau của website. Bạn sẽ phải thêm một trình phát mới mỗi lần bạn muốn sử dụng một trình phát.

Nếu bạn muốn có nhiều tính năng nâng cao hơn và trình phát âm thanh có thể tái sử dụng, thì WPBeginner Việt Nam khuyên bạn nên Trình phát âm thanh HTML5.

Tương tự như block âm thanh của WordPress, plugin này có thể phát nhiều định dạng file âm thanh khác nhau, như file mp3, .wav hoặc .ogg. Nhưng nó đi kèm với nhiều option custom hơn.

Bây giờ, mặc dù plugin chỉ có thể phát một file âm thanh cho mỗi trình phát, bạn có thể tạo nhiều trình phát âm thanh tùy thích. Do đó, bạn vẫn có thể phát nhiều bản nhạc khác nhau trên trang WordPress của mình.

Hơn nữa, bạn thậm chí có thể thêm nhiều trình phát âm thanh vào cùng một trang.

Nhiều trình phát âm thanh trên một trang

Để bắt đầu, bạn cần cài đặt và kích hoạt plugin. Nếu bạn cần trợ giúp, vui lòng xem hướng dẫn của WPBeginner Việt Nam về cách cài đặt plugin WordPress.

Sau khi kích hoạt, bạn đã sẵn sàng để xây dựng trình phát âm thanh đầu tiên của mình bằng cách đi tới Trình phát âm thanh HTML5 » Trình phát âm thanh HTML5.

Tại đây, hãy nhấp vào nút ‘Thêm trình phát âm thanh’.

Thêm trình phát âm thanh vào website WordPress của bạn

Bước tiếp theo là nhập tên cho trình phát âm thanh vào trường hiển thị ‘Thêm tiêu đề’.

Bài viết này chỉ mang tính chất tham khảo nên bạn có thể sử dụng bất kỳ tiêu đề nào bạn muốn.

Tạo tiện ích trình phát âm thanh bằng plugin

Sau khi thực hiện xong, bạn sẽ muốn cuộn đến phần ‘Cấu hình trình phát’.

Trong khu vực này, bạn có thể thêm file âm thanh vào trình phát bằng cách nhấp vào nút ‘Thêm âm thanh’.

Thêm file âm thanh vào trình phát HTML5

Bây giờ bạn có thể chọn bất kỳ file âm thanh nào từ media library hoặc tải file lên từ máy tính của mình.

Sau khi chọn file, bạn đã sẵn sàng custom trình phát âm thanh. Theo mặc định, người dùng chỉ cần nhấp vào nút ‘Phát’ và âm thanh sẽ bắt đầu phát với âm lượng được tăng lên.

Đây là cách mà hầu hết người dùng mong đợi trình phát âm thanh hoạt động, vì vậy bạn thường muốn sử dụng các cài đặt mặc định này. Tuy nhiên, cũng có các option để tắt tiếng âm thanh theo mặc định, tự động phát, lặp lại, v.v. Vì vậy, hãy thoải mái khám phá các cài đặt này.

Khi bạn đã hài lòng với cách thiết lập trình phát, chỉ cần cuộn lên đầu màn hình và nhấp vào nút ‘Lưu’.

Thêm trình phát âm thanh mới vào website WordPress của bạn

Sau đó, bạn có thể thêm trình phát âm thanh vào website của mình bằng cách sử dụng shortcode hoặc block Trình phát âm thanh HTML5.

Khối là phương pháp dễ nhất. Tuy nhiên, nếu bạn muốn đặt người chơi bằng shortcode, thì bạn sẽ tìm thấy code ở phía trên cùng của màn hình.

Để biết thêm chi tiết về cách đặt shortcode, bạn có thể xem hướng dẫn của WPBeginner Việt Nam về cách thêm shortcode vào WordPress.

Đặt tiện ích trình phát âm thanh bằng shortcode

Để thêm trình phát nhạc bằng block, bạn cần mở bất kỳ trang hoặc bài đăng nào và nhấp vào nút ‘+’.

Trong popup xuất hiện, chỉ cần nhập ‘HTML5 Audio Player’ để tìm đúng block. Khi bạn nhấp vào block ‘HTML5 Audio Player – Insert’, nó sẽ thêm block vào trang của bạn.

Thêm block trình phát âm thanh vào trang WordPress của bạn

Tiếp theo, bạn có thể mở dropdown menu ‘Chọn trình phát’ để xem danh sách tất cả trình phát âm thanh mà bạn đã tạo.

Bây giờ bạn có thể nhấp vào trình phát âm thanh để thêm vào trang hoặc bài đăng.

Khối âm thanh HTML5 WordPress

Sau đó, bạn có thể nhận thấy trình chỉnh sửa trang WordPress không hiển thị trình phát âm thanh.

Tuy nhiên, nếu bạn nhấp vào nút ‘Xem trước’, thì bạn sẽ có thể thấy trình phát sẽ trông như thế nào đối với người dùng website của bạn. Ở chế độ này, bạn thậm chí có thể nghe âm thanh và tự mình kiểm tra các nút phát lại khác nhau.

Xem trước tiện ích âm nhạc

Khi bạn hài lòng với giao diện và chức năng của trình phát âm thanh, bạn có thể cập nhật hoặc xuất bản trang.

Bây giờ, nếu bạn truy cập trang này trên website WordPress của mình, bạn sẽ thấy trình phát âm thanh trực tiếp.

Bạn có muốn thêm các bản nhạc âm thanh khác vào website của mình không? Sau đó, bạn chỉ cần làm theo quy trình được mô tả ở trên để tạo thêm trình phát âm thanh và thêm chúng vào website WordPress của mình.

Chúng tôi hy vọng bài viết này đã giúp bạn biết cách thêm tiện ích trình phát âm thanh vào WordPress. Tiếp theo, bạn cũng có thể muốn đọc các lựa chọn chuyên gia của WPBeginner Việt Nam về phần mềm chỉnh sửa video tốt nhất và các plugin accordion WordPress tốt nhất.

Nếu bạn thích bài viết này, vui lòng đăng ký theo dõi WPBeginner Việt Nam Kênh Youtube cho các video hướng dẫn về WordPress. Bạn cũng có thể tìm thấy WPBeginner Việt Nam trên TwitterFacebook.

5/5 - (108 bình chọn)
Facebook
Twitter
LinkedIn
Telegram
Email
Đội Ngũ Biên Tập