WordPressサイトで簡単にBGMを流す方法

先日、所属サークルサイトで「無料BGMダウンロード」を開始しました。
結構な数のダウンロードをして頂いており、BGMの需要の高さを改めて認識しています。

本日は、BGMをWordPressサイト内で簡単に流す方法をご紹介します!

スポンサーリンク

WordPressでBGMを流す方法

ここではわかりやすく「BGMを流す方法」としていますが、BGM以外にもSE(効果音)やボイスなども再生可能です。音楽制作サイトだけでなく、声優さんのサイトなどでも活躍する機能となっています。

WordPressの基本機能で再生を行う

WordPress 3.6から音声を再生する機能が導入されています。そのため、もっともシンプルな方法はプラグインなしでWordPressの基本機能で音声を再生させる方法です。

こちらのページはプラグインなしの方法でプレイヤーを表示しています。

それでは具体的な方法を解説していきます。

再生したいデータをメディアに追加する

bgm-player1

投稿記事や固定ページの「メディアを追加」もしくは管理ページのサイドバー「メディア→新規追加」で選択します。

bgm-player2

mp3データを追加した様子です。

bgm-player3

添付ファイルの表示設定で「メディアプレイヤーを埋め込む」を選択します。
埋め込み用にショートコードが生成されるので、プレビューで確認してみましょう。

上記のようなプレイヤーが記事に表示されているはずです。
シンプルでなかなかカッコいいプレイヤーが挿入されます!

プレイリストを作成する

WordPress 3.9からプレイリストも手軽に作成可能になりました。
手順を簡単に説明していきます。

bgm-player4

「メディアを追加」→「リストに加えたいデータを選択」→「音声プレイリストを作成」をクリックします。

bgm-player5

選択した音声データの一覧が表示されます。問題がなければ「プレイリストを新規作成」をクリックします。

bgm-player6

bgm-player7

プレイリスト表示に関しての表示情報などの修正や追加が可能です。

これが完成したプレイリストです。オシャレな感じです。

上記のように画像を表示したい場合は管理画面のサイドバー「メディア」→「ライブラリ」でアイキャッチを挿入したい音声を選択して「アイキャッチ画像」で画像を設定してください。

プレイリストを製作時に一曲だけ選択することで、上記のような表示方法も可能です。
好みに合わせて通常表示と使い分けてみてください。

表示デザインに関しては、CSSを調整することで変更が可能なようです。

オススメの5選をピックアップしてみました!
よろしければ視聴をしてみてください!

まとめ

WordPressサイトで簡単にBGMを流す方法いかがだったでしょうか?
プラグインなしで導入出来るのが手軽で嬉しいところです。

今回参考にさせて頂いた記事です。より詳しく設置の方法などが掲載されています!
それでは失礼します。

created by Rinker
キングレコード
¥2,539 (2024/11/24 07:56:12時点 Amazon調べ-詳細)
この記事をお届けした
O3 WEBの最新ニュース情報を、
いいねしてチェックしよう!
スポンサーリンク

コメント