最も必要とされている時に、信頼できるWordPressチュートリアルを。
WordPress入門ガイド
WPBカップ
2500万人以上
当社のプラグインを使用しているウェブサイト
16+
WordPress経験年数
3000+
専門家によるWordPressチュートリアル

WordPressにMP3オーディオファイルを追加する方法(簡単な3つの方法)

ここで驚くかもしれませんが、オーディオファイルをサイトに追加しようとする多くのWordPressユーザーは、訪問者を引きつけるどころか遠ざけてしまっています。

原因は通常、サイトを遅くする巨大なファイル、壊れた音楽プレーヤー、モバイルデバイスで機能しないオーディオです。

WordPressウェブサイトの所有者の音声に関する問題を修正するのを手伝っている中で、このパターンを何度も見てきました。

広範な調査とテストの結果、WordPressにMP3ファイルを追加するための優れたオプションが3つ見つかりました。それらは、WordPressの組み込みオーディオブロック、HTML5オーディオプレーヤー、およびEasy Digital Downloadsです。

この記事では、初心者の方でもこれらのツールを使ってWordPressウェブサイトに音声ファイルを簡単に追加する方法をご紹介します。

WordPressにMP3オーディオファイルを追加する方法

WordPressにMP3オーディオファイルを追加する理由

WordPressウェブサイトでオーディオファイルを共有することは、人々を引きつけ、より多くの時間を費やすように促す素晴らしい方法です。

ウェブサイトでのエンゲージメントが高ければ、訪問者はあなたのブランドをより記憶しやすくなります。購入やメールニュースレターへの登録といった行動を起こす可能性もあります。

ここがポイントです:訪問者がウェブサイトを探索する時間が長くなると、検索エンジンにとってプラスのシグナルになります。

その結果、サイトのSEOランキングが向上し、より多くのトラフィックを獲得できます。

これを念頭に置いて、ブログ記事、ポッドキャストエピソード、ウェビナー録画、または楽曲のMP3オーディオバージョンをウェブサイトで共有することをお勧めします。これらのオーディオファイルを販売することもできます。 🛒

このガイドでは、WordPressウェブサイトにMP3オーディオファイルを追加する方法を説明します。特定のメソッドに興味がある場合は、リンクをクリックして記事の先頭にスキップできます。

さあ、始めましょう。

方法1. 内蔵オーディオブロックを使用してMP3ファイルを追加する方法(ストリーミングプラットフォームに対応)

MP3音声ファイルを埋め込む最も簡単な方法は、WordPressの組み込みオーディオブロックを使用することです。

このシンプルなブロックには、再生/一時停止ボタン、音量コントロール、再生速度を変更するボタンなど、すべての重要な再生コントロールが含まれています。

より高度な機能が不要な場合は、「オーディオ」ブロックが良い選択肢です。「オーディオ」ブロックを使用して、WordPressメディアライブラリから任意のMP3ファイルを再生できます。

⚠️ 重要: ほとんどのユーザーにとって、WordPressサイトで再生するためにMP3をアップロードすることは推奨しません。これは、大きなオーディオファイルやビデオファイルをアップロードすると、多くのスペースを占有し、Webサイトが遅くなる可能性があるためです。

WordPressに動画をアップロードしてはいけない理由に関するガイドで、さらに詳しく学ぶことができます。

または、SpotifyやSoundCloudのような人気のサードパーティオーディオプラットフォームからMP3を埋め込むこともできます。

ただし、一部のプラットフォームではオーディオクリップのみを埋め込むことができることに注意してください。また、次の画像のように、訪問者にサイトを離れてプラットフォームで完全なMP3を聴くように促す場合もあります。

WordPressに埋め込まれたSpotifyプレイリスト

WordPressウェブサイトにMP3オーディオファイルを追加するには、任意のページまたは投稿を開きます。次に、「+」アイコンをクリックします。

ポップアップが表示されます。

「オーディオ」と入力して、適切なブロックを見つけてください。次に、「オーディオ」ブロックをクリックするだけで、ページに追加できます。

WordPressの組み込みオーディオブロック

新しいMP3ファイルをアップロードしたい場合は、「アップロード」をクリックする必要があります。

その後、コンピューターからアップロードしたいオーディオファイルを選択してください。

既存のMP3ファイルを使用したい場合は、「メディアライブラリ」をクリックします。次に、WordPressメディアライブラリからオーディオファイルを選択できるようになります。

WordPress ウェブサイトにオーディオファイルをアップロードする

外部サイトからMP3を埋め込みたい場合は、代わりに「URLから挿入」をクリックする必要があります。

オーディオファイルが配置されている場所のURLを貼り付けるだけです。

WordPress への Spotify オーディオの埋め込み

それが完了したら、「オーディオ」ブロックをクリックして、設定できるさまざまな設定を確認することをお勧めします。

📝 注意: 表示される設定は、メディアライブラリからMP3を追加する場合と、サードパーティのサイトからオーディオを埋め込む場合とで異なる場合があります。

例えば、「自動再生」スイッチをクリックすることで、オーディオを自動再生できるようにすることができます。

ただし、ページを読み込んだらすぐに再生が始まるオーディオは、特に訪問者の音量が大きい場合、迷惑になる可能性があります。これを念頭に置いて、「自動再生」は訪問者のエクスペリエンスを何らかの形で向上させる場合にのみ有効にしてください。

オーディオブロックの自動再生設定

「ループ」スイッチをクリックすることで、オーディオファイルを無限ループで再生できる場合もあります。

この設定は、あまり邪魔にならないオーディオで最も効果的です。たとえば、バックグラウンドノイズを提供したり、雰囲気を設定したりするインストゥルメンタルトラックに使用できます。

あるいは、アルバム全体のような、訪問者が何度も聞きたい長いオーディオのためにループを有効にすることもできます。

WordPressオーディオブロックを使用してMP3オーディオファイルをループする

ページまたは投稿の設定が完了したら、公開または更新できます。

これで、MP3がWebページにライブで表示されるはずです。これは、訪問者がブロックの再生コントロールボタンを使用してオーディオを無料で聴くことができることも意味します。

方法2. WordPressプラグインを使用してMP3オーディオファイルを追加する方法(よりカスタマイズ可能)

標準の「オーディオ」ブロックは、サードパーティプラットフォームからのコンテンツの埋め込みを含め、WebサイトにMP3オーディオを追加する簡単な方法です。ただし、オーディオプレーヤーの外観や動作のカスタマイズに関しては、非常に限られています。

WordPressメディアライブラリからオーディオファイルを追加したい場合は、HTML5 Audio Playerの方がはるかにカスタマイズ可能です。

これはWordPress向けの最高のオーディオプレーヤープラグインの1つであり、MP3を含むいくつかの異なるオーディオ形式をサポートしています。ただし、このプラグインを使用してサードパーティのストリーミングサービスからコンテンツを埋め込むことはできないことに注意してください。

まず、プラグインをインストールして有効化しましょう。ヘルプが必要な場合は、WordPressプラグインのインストール方法に関するガイドを参照してください。

有効化すると、オーディオプレイヤーを作成し、そのプレイヤーにMP3ファイルを追加する必要があります。

開始するには、Html5 Audio Player » Html5 Audio Playerにアクセスしてください。ここから、「Add Audio Player」ボタンをクリックするだけです。

WordPressウェブサイトにオーディオプレーヤーを追加する

それが終わったら、次にオーディオプレーヤーの名前を「タイトルを追加」フィールドに入力します。

これは参照用ですので、好きなタイトルを使用できます。

プラグインを使用してオーディオプレーヤーウィジェットを作成する

その後、「プレーヤー設定」セクションまでスクロールします。

ここで、「オーディオを追加」ボタンをクリックしてWordPressメディアライブラリを起動します。次に、使用したいMP3ファイルを選択します。

HTML5プレーヤーにオーディオファイルを追加する

MP3を選択したら、オーディオプレーヤーをカスタマイズする準備ができました。

デフォルトでは、訪問者はオーディオを再生するために「再生」ボタンをクリックするだけで済みます。これはほとんどの訪問者が期待するオーディオプレーヤーの動作方法なので、通常はこのデフォルト設定を使用したいはずです。

ただし、オーディオをデフォルトでミュートしたり、自動再生したり、リピートしたりするためのオプションがあります。これらの設定は、ニーズに合わせて構成できます。

オーディオプレーヤーの設定に満足したら、[保存]ボタンをクリックするだけです。

WordPressウェブサイトに新しいオーディオプレイヤーを追加する

MP3ファイルとオーディオプレーヤーをサイトに追加するには、任意のページまたは投稿を開く必要があります。次のステップは、「+」ボタンをクリックすることです。

表示されるポップアップで、「HTML5 Audio Player」と入力して適切なブロックを見つけます。

その後、「HTML5 Audio Player – Insert」をクリックして、ブロックをページに追加します。

WordPressサイトにオーディオプレーヤーブロックを追加する

完了したら、「プレーヤーを選択」ドロップダウンを展開し、作成したばかりのオーディオプレーヤーを選択できます。

WordPressコンテンツエディターにはオーディオファイルが表示されないため、MP3を再生したりプレーヤーを表示したりすることはできません。

HTML5 WordPressオーディオブロック

プレーヤーの動作を確認したい場合は、[プレビュー]リンクをクリックするだけです。

MP3を投稿する準備ができたら、ページを更新または公開します。その後、WordPressサイトのライブページにアクセスすると、MP3ファイルが再生できるようになります。

方法3. Easy Digital Downloadsを使用してMP3ファイルを追加する方法(そして収益を上げる方法)

WordPressの組み込みオーディオブロックとHTML5 Audio Playerの両方で、訪問者はMP3ファイルを無料で再生できます。ただし、オーディオファイルを販売して、WordPressでブログを書いてオンラインでお金を稼ぐことを検討できます。

デフォルトでは、WordPressにはeコマース機能がありません。そのため、MP3ファイルを販売したい場合はプラグインを使用する必要があります。

そこで登場するのがEasy Digital Downloadsです。これは最高のWordPress eコマースプラグインの1つであり、電子書籍、PDFファイル、動画、MP3オーディオファイル、その他のあらゆる種類のデジタル製品を簡単に販売できます。

多くのパートナーサイトでは、Easy Digital Downloadsを使用してプラグインやソフトウェアを販売しており、素晴らしい経験をしたと報告しています。私たち自身の経験の詳細については、Easy Digital Downloadsの詳細レビューをご覧ください。

Easy Digital Downloadsを使用して作成されたMP3商品ページ

さらに良いことに、SiteGroundをホスティングプロバイダーとして使用している場合、Easy Digital Downloadsがプリインストールされています。これにより、MP3やその他のデジタル製品をすぐに販売開始できます。

Easy Digital Downloadsの始め方については、WordPressでデジタルダウンロードを販売する方法に関する初心者向けガイドを参照してください。

Easy Digital Downloadsをセットアップしたら、「Downloads」を左側のメニューでクリックするだけで、各MP3を新しい製品として追加できます。

その後、「ダウンロードを追加」ボタンをクリックしてください。

Easy Digital DownloadsにMP3ファイルを追加する

これにより、デジタルダウンロードの製品ページを作成できる画面が開きます。

ここでは、価格、説明、使用したい製品のカテゴリとタグなど、オーディオファイルに関するすべての必要な情報を追加することをお勧めします。

それが完了したら、「ダウンロードファイル」セクションまでスクロールし、リンクのように見えるアイコンをクリックします。

EDDを使用してMP3オーディオファイルを販売する方法

これでWordPressのメディアライブラリが起動し、サイトで販売したいMP3を選択できます。

商品ページの設定が完了したら、「公開」をクリックするだけです。

Easy Digital Downloadsを使用したMP3の公開

これで、人々はあなたのサイトにアクセスするだけでMP3オーディオファイルを購入できるようになります。

このトピックの詳細については、WordPressで音楽をオンラインで販売する方法に関するガイドを参照してください。

ボーナスのヒント:画像とビデオギャラリーでエンゲージメントを高める 🖼️

ウェブサイトをよりインタラクティブで視覚的に魅力的なものにしたいですか?オーディオプレーヤーと画像またはビデオギャラリーを組み合わせることで、コンテンツに命を吹き込みましょう。

単一の画像をWordPressに追加するのは、画像ブロックを使えば簡単です。しかし、複数の画像を扱う場合、単に積み重ねるだけでは理想的ではありません。ページが散らかり、ユーザーは延々とスクロールしなければならなくなります。

代わりに、ギャラリーを作成して画像をきれいにグリッド形式のレイアウトで表示できます。訪問者はサムネイルを閲覧し、ページを離れることなくフルサイズのバージョンを表示するためにクリックできます。

WordPressでは、Gutenbergエディタの組み込みギャラリーブロックを使用して簡単にギャラリーを作成できます。また、ライトボックス効果、アルバム、フィルタリングなどの高度な機能が必要な場合は、Envira Galleryのようなプラグインが強力なアップグレードを提供します。

WordPressでギャラリーをプレビューする

ステップバイステップの説明については、WordPressで画像ギャラリーを作成する方法に関するガイドをご覧ください。

しかし、写真だけで終わらせないでください。動画はコンテンツをさらに充実させることができます。

ビデオスライダーは、ミュージックビデオ、舞台裏の映像、ファンの叫び、またはアルバムのティーザーを披露するのに最適な方法です。インディーズアーティストが短いビデオイントロやビジュアルでさまざまなトラックを強調するのにも適しています。

Soliloquyのようなプラグインを使用すると、コーディング不要で数回クリックするだけで、レスポンシブなビデオスライダーを作成できます。WordPressでビデオスライダーを作成する方法に関するガイドでその方法を学びましょう。

この記事がWordPressにMP3オーディオファイルを追加する方法を学ぶのに役立ったことを願っています。次に、WordPressにオーディオ音楽プレーヤーを追加する方法オンラインでオーディオブックを販売する方法に関するガイドを確認することをお勧めします。

この記事が気に入った場合は、WordPressのビデオチュートリアルのために、YouTubeチャンネルを購読してください。また、TwitterFacebookでも私たちを見つけることができます。

開示: 当社のコンテンツは読者によってサポートされています。これは、一部のリンクをクリックすると、手数料が発生する可能性があることを意味します。WPBeginnerがどのように資金調達されているか、なぜそれが重要なのか、そしてどのように私たちをサポートできるかを確認してください。こちらが当社の編集プロセスです。

究極のWordPressツールキット

無料のツールキットにアクセスしましょう - すべてのプロフェッショナルが持つべきWordPress関連の製品とリソースのコレクションです!

読者とのインタラクション

25 CommentsLeave a Reply

  1. デフォルトの音楽プレーヤーを使用しており、問題なく動作しているようです。しかし、ユーザーが誤って複数のオーディオファイルを同時にクリックすると、すぐに混乱してしまいます。聞きたいオーディオファイルはそのままに、別のオーディオファイルを停止する方法がわからないのではないかと心配しています。
    ページ内で設定を変更し、一度に1つのオーディオファイルしか再生されないようにすることは可能ですか?

    • 一度に1つしか再生できないプレイリストを作成するには、この記事のプレーヤープラグインを検討してください。これにより、一度に1つのオーディオファイルに制限できます。

      管理者

  2. ブロックエディターは、少なくとも私にとっては、Seed ProdやElementorに慣れているため、非常に複雑な場合があります。視覚障害のあるユーザーのために、重要な記事のオーディオトラックをAIで作成することに慣れています。それは素晴らしいことです。通常、迷子になるGutenbergに関するガイドに感謝します。それを使わないからです。おそらく使用したであろう外部プラグインの追加スペースを節約できました。

  3. ヘルプありがとうございます。私のブログは6ヶ月前のもので、投稿にオーディオをアップロードするのに問題がありました。アップロード方法について、明確で理解しやすい例を挙げていただきました。多くの苦痛とフラストレーションを救っていただきました。ありがとうございます。良い一日を。

  4. 毎回自分でやるのではなく、MP3をblubrry pressに入れるにはどうすればいいですか?新しいポッドキャストがあるたびに読み込んで追加する方法があるはずです。

  5. これは、私の知る限り、WordPressプレミアム以上の料金を支払える場合にのみ機能します。

  6. この投稿を編集したいかもしれません。3.6(現在は4.X)以降、WPはネイティブオーディオ埋め込みをサポートできます。プラグインは必要ありません。

  7. このプラグインは古いですが、最新のPB oEmbed HTML5 Audio – with Cache Supportは素晴らしいです!!!使い方は信じられないほど簡単です。WordPressでMP3ファイルを投稿またはページに挿入したときにWordPressが作成するリンクの周りの余分なコードを削除するようにしてください。

    ところで、投稿やページにオーディオファイルを挿入する方法を知らない方のために、写真を追加するのと同じように、メディアボタンを使用して追加してください。

  8. こんにちは

    上記のソリューションは個々の投稿には非常にうまく機能すると思いますが、ユーザーが他のページ/投稿を閲覧しても再生し続ける音楽プレーヤーを統合する方法について、何かアイデアはありますか?http://www.jamendo.comでトラックを再生するときのような、画面下部のバーのようなものです。
    よろしくお願いします。
    アラン

  9. メディアファイルの制限は10MBで、私のオーディオファイルは11MBです。10MBを超えるメディアファイルを追加するにはどうすればよいですか、またはWordPressサイトにアップロードするためにMP3ファイルのサイズを縮小するにはどうすればよいですか?

    • Try uploading the file from inside a post or reduce the file size with any mp3 editors. There are billions of free tools out there. Neat,huh :D

  10. 皆さん、IE、Chrome、Firefoxなどのブラウザや携帯電話/パッドでサービスをサポートしていないすべてのプラグインを捨ててください。なぜ誰かがまだこのクソを開発しているのですか?

    インターネットユーザーの50%にしか対応していないプラグインは使用できません!

    …..そして、このような中途半端なプラグインを見かけたら、宣伝しないでください!それは役に立ちません。

    ところで、記事をありがとう…。

    • プラグインの互換性について誤解されていると思います。すべてのブラウザで動作し、MP3用のバックアップFlashベースプレーヤーがあります。

      その他のファイル形式であるOGGとWAVは、IE 8、9、およびSafariではサポートされていません。しかし、この記事はMP3ファイルのために書いたものであり、このプラグインはすべてのブラウザでMP3をサポートしています。プラグインの詳細ページの表記は紛らわしいかもしれませんが、注意深く見ると、OGG、WAVを区切るセミコロンがあり、サポートされていません。

      管理者

  11. この投稿をありがとう。

    ただ一つ問題があります。更新すると、プレーヤーなしでURLリンクが投稿に表示されますか?これをどうすれば修正できますか?

    ありがとう

    ウォーレン

  12. このプラグインがモバイルで機能しないことに気づいた人はいますか?モバイルプラットフォームで音楽をストリーミングできるオーディオプレーヤーはありますか?

  13. 最近、oEmebed HTML5 Audioプラグインを見つけました。これは本当にシンプルです。SoundCloudとその手数料を使わない方法を探していました!

    このプラグインは、投稿内のMP3 URLに対してフラッシュバックアップを備えたHTMLオーディオプレーヤーを埋め込みます。

    http://wordpress.org/extend/plugins/oembed-html5-audio/

    これで、どこにでもオーディオを保存できます。公開されているDropBoxフォルダはかなりうまく機能し、これ以上簡単なことはありません。

    • ティム、実はこれは上記の記事で議論されているのと同じプラグインです。素晴らしいプラグインであることは間違いありません。パブリックドロップボックスのアイデアはクールですね。

      したがって、基本的にDropboxの公開フォルダにオーディオファイル(mp3またはogg)をアップロードするだけで済みます。Dropboxからファイルのリンクを取得し、投稿に貼り付けるだけです。

  14. 私はBlubrry PowerPressを使用して、いくつかのWPウェブサイトにオーディオを埋め込んでいます。そのパフォーマンスと堅牢なオプションセットに非常に満足しています。

返信する

コメントいただきありがとうございます。すべてのコメントは、コメントポリシーに従ってモデレーションされ、メールアドレスは公開されません。名前フィールドにキーワードを使用しないでください。個人的で意味のある会話をしましょう。