WordPressの記事に音声プレイリストを挿入する

WordPressの記事に音声プレイリストを挿入する

WordPressの記事に音声プレイリストを挿入する方法をまとめておきます。

音声プレイリスト

音声プレイリストを使うと、下記の様なオーディオプレイヤーを表示させることができます。

音声ファイルの挿入 音声プレイリスト
オーディオプレイヤー
タイトル(曲名) ×
アルバム名 ×
アーティスト名 ×
ジャケット画像 ×
複数曲のリスト表示 ×

詳細な情報を表示させたい&複数の曲をリスト表示させたい時に使うと便利です。

WordPressで音声ファイル(MP3)を再生する方法

WordPressの記事に音声ファイルを挿入する

2016.03.20

音声プレイリストの挿入(クラシックエディター)

記事編集画面で、「メディアを追加」ボタンをクリックします。

「メディアを追加」をクリック

「メディアを追加」をクリック

アクション「音声プレイリストを作成」をクリックします。

「音声プレイリストを作成」をクリック

「音声プレイリストを作成」をクリック

音声プレイリストに表示させたい曲を選択して、「プレイリストを新規作成」をクリックします。

この際、曲の詳細情報も同時に入力できます(後からメディファイルの編集でも可能)。

音声プレイリストに表示させる曲を選択

音声プレイリストに表示させる曲を選択

曲の順番をドラッグ&ドロップで入れ替えることができます。また、プレイリスト設定のチェックを外せば、必要ない項目を非表示にすることができます(初期設定推奨)。

設定が完了及び特に変更がなければ、「音声プレイリストを挿入」をクリックします。

曲の順番をドラッグ&ドロップで入れ替える

曲の順番をドラッグ&ドロップで入れ替える

チェックを外した時に追加されるオプション
トラックリストを表示 tracklist="false"
トラックリストにアーティスト名を表示 artists="false"
画像を表示 images="false"

記事に音声プレイリストのショートコードが挿入されれば設定完了です。

記事に音声プレイリストのショートコードが挿入される

記事に音声プレイリストのショートコードが挿入される

音声ファイルの編集

管理画面の「メディアライブラリ」から、編集したい音声ファイルを選択します。

編集したい音声ファイルを選択

編集したい音声ファイルを選択

右下の「さらに詳細を編集」をクリックします。

「さらに詳細を編集」をクリック

「さらに詳細を編集」をクリック

音声プレイリストに表示される「タイトル」「アーティスト」「アルバム」を入力します。また、画像を表示させたい時は「アイキャッチ画像を設定」から設定することができます。

この際、画像はサムネイルが使用されますが、表示される画像のサイズは「60 x 60」の正方形になっているので、縦横比率1:1の画像を使うと見栄えがよくなります。

音声ファイルの編集

音声ファイルの編集

他の項目「キャプション」はリスト一覧のタイトルで表示されます(空欄なら「タイトル – アーティスト」で表示される)。また、「説明」は添付ファイルページに表示されます。

ちなみに、音声ファイルを編集すると、既に挿入済みの音声ファイルの情報も置き換えられます。

最後に

曲の詳細情報を一緒に載せたい&複数の曲をまとめて紹介したい時は、音声ファイルの挿入よりも音声プレイリストがおすすめです。ただ、ブロックエディターでは専用のブロックが用意されていないので(2021年現在)、ブロックエディターで使いたい方はショートコードを入力して下さい。

スポンサーリンク
スポンサーリンク