Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPBカップ
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

WordPressでMP3音声ファイルを追加する方法(3つの簡単な方法)

WordPressでMP3音声ファイルを追加したいですか?

MP3ファイルをサイトに追加することで、音楽、ポッドキャスト、インタビューなどの音声をビジターやカスタマイザーと共有することができます。これにより、サイトをより魅力的なものにし、より長く滞在してもらうことができます。

この投稿では、WordPressでMP3音声ファイルを追加する方法を紹介します。

How to add MP3 audio files in WordPress

なぜWordPressでMP3音声ファイルを追加するのか?

WordPressサイトで音声ファイルを共有することは、人々の関心を引きつけ、より多くの時間を使ってもらうための素晴らしい方法です。

サイトのエンゲージメントが高ければ、訪問者はあなたのブランドを覚えている可能性が高くなります。また、購入やメールマガジンの登録など、行動を起こしてくれるかもしれません。

訪問者がサイト内を探索する時間を増やすことは、検索エンジンにとってポジティブなシグナルとなります。その結果、サイトのSEO順位が上がり、トラフィックが増加します。

このことを念頭に置いて、ブログ投稿、ポッドキャストのエピソード、ウェビナーの録音、または曲のMP3音声ファイルをサイトで共有するのは良いアイデアです。これらの音声ファイルを販売することもできます。

このガイドでは、WordPressサイトにMP3音声ファイルを追加する方法をご紹介します。特定の方法に興味がある場合は、リンクをクリックして投稿をスキップすることができます:

方法1.ビルトイン音声ブロックを使ってMP3ファイルを追加する方法 (ストリーミングプラットフォームをサポート)

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

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

これ以上高度な機能を必要としないのであれば、『音声』ブロックが良い選択です。

音声ファイル」ブロックを使って、WordPressのメディアライブラリから任意のMP3ファイルを再生することができます。

:ほとんどのユーザーには、WordPressサイトで再生するためにMP3をアップロードすることはお勧めしません。大きな音声ファイルや動画ファイルをアップロードすると、容量が大きくなり、サイトの表示速度が遅くなる可能性があるからです。さらに詳しくは、WordPressに動画をアップロードしてはいけない理由をご覧ください。

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

ただ、プラットフォームによっては、フル音声のクリップしか埋め込むことができないものもあるので、注意が必要です。また、以下の画像のように、あなたのサイトを離れて、そのプラットフォームでフルMP3を聴くように促す場合もあります:

A Spotify playlist embedded in WordPress

WordPressサイトにMP3音声ファイルを追加するには、任意のページまたは投稿を開きます。そして、「+」アイコンをクリックしてください。

ポップアップが表示されます。その中で「音声ファイル」とタイプして適切なブロックを探してください。音声’ブロックをクリックして、ページに追加することができます。

The built-in WordPress audio block

新規MP3ファイルをアップロードしたい場合は、「アップロード」をクリックしてください。そして、コンピューターからアップロードしたい音声ファイルを自由に選んでください。

既存のMP3ファイルを使いたい場合は、「メディアライブラリ」をクリックしてください。ボタンをクリックすると、WordPressのメディアライブラリから音声ファイルを選択できます。

Uploading an audio file to your WordPress website

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

あとは、音声ファイルがあるURLを貼り付けるだけです。

Embedding Spotify audio in WordPress

音声’ブロックをクリックすると、様々な設定ができます。

メディアライブラリからMP3を追加するか、サードパーティサイトから音声ファイルを埋め込むかによって、表示される設定が異なる場合があります。

例えば、’Autoplay’スイッチをクリックすることで、音声ファイルを自動的に再生することができるかもしれません。

しかし、ページがロードされるとすぐに再生が始まる音声ファイルは、特に訪問者が音量を大きくしている場合、迷惑になる可能性があります。その点を考慮し、訪問者の体験を何らかの形で向上させる場合にのみ「自動再生」を有効化してください。

The Audio block's autoplay settings

Loop’スイッチをクリックすれば、音声ファイルをエンドレスでループ再生することもできる。

この設定は、あまり邪魔にならない音声ファイルに最適です。例えば、インストゥルメンタルのトラックで、バックグラウンドノイズを提供したり、雰囲気を設定したりする場合に使用できます。

また、アルバム全体のように、訪問者が何度も聴きたくなるような長い音声ファイルの場合は、ループを有効化することもできます。

Loop an MP3 audio file using the WordPress audio block

ページや投稿の設定に満足したら、公開したり更新したりすることができます。

これで、あなたのウェブページにMP3がライブで表示されるはずです。これは、訪問者がブロックの再生コントロールボタンを使って無料で音声ファイルを聴くことができるということでもあります。

方法2.WordPressプラグインを使ってMP3音声ファイルを追加する方法(よりカスタマイズ可能)

ビルトインの’音声’ブロックは、サードパーティのプラットフォームからのコンテンツの埋め込みを含め、あなたのサイトにMP3音声を追加する簡単な方法です。しかし、特に音声プレーヤーの外観や動作のカスタマイズに関しては、非常に制限されています。

WordPressのメディアライブラリから音声ファイルを追加したい場合は、HTML5 Audio Playerの方がカスタマイズ性が高いです。

WordPress用の音声ファイルプラグインの中でもトップクラスのプラグインで、MP3を含む数種類の音声フォーマットに対応しています。ただし、サードパーティのストリーミングサービスからのコンテンツを埋め込むためにこのプラグインを使用することはできませんのでご注意ください。

まずはプラグインをインストールして有効化しましょう。WordPressプラグインのインストール方法については、こちらをご覧ください。

有効化したら、音声プレーヤーを作成し、MP3ファイルをそのプレーヤーに追加する必要があります。

まずはHtml5 Audio Player ” Html5 Audio Playerにアクセスしてください。ここから「音声ファイルを追加」ボタンをクリックするだけです。

Adding an audio player to your WordPress website

それができたら、次にすることは、’Add title’フィールドに音声プレーヤーの名前を入力することです。

これはあくまで参考なので、好きなタイトルを使っていい。

Creating an audio player widget using a plugin

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

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

Adding an audio file to the HTML5 player

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

初期設定では、訪問者は’再生’ボタンをクリックするだけで音声ファイルを再生することができます。ほとんどの訪問者は、このように音声ファイルが動作することを期待していますので、通常はこの初期設定を使用することをお勧めします。

ただし、初期設定で音声をミュートしたり、自動再生、リピートなどのオプションがある。これらの設定は、あなたのニーズに一致するように構成することができます。

音声ファイルの設定に満足したら、’Save’ ボタンをクリックします。

Adding a new audio player to your WordPress website

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

表示されるポップアップで、「HTML5 Audio Player」と入力して適切なブロックを探します。その後、’HTML5 Audio Player – Insert’をクリックして、ブロックをページに追加してください。

Adding an audio player block to your WordPress site

完了したら、’プレーヤーを選択’ドロップダウンを展開し、先ほど作成した音声ファイルを選択します。

WordPressのページエディターには音声ファイルが表示されないため、MP3を再生することも、プレーヤーを見ることもできません。

An HTML5 WordPress audio block

プレーヤーの動きをご覧になりたい場合は、「プレビュー」リンクをクリックしてください。

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

方法3.Easy Digital Downloadsを使ってMP3ファイルを追加する(そしてお金を稼ぐ)方法

ビルトインWordPressオーディオブロックとHTML5オーディオプレーヤーは、訪問者が無料であなたのMP3ファイルを再生することができます。しかし、WordPressで音声ファイルを販売し、オンラインブログでお金を稼ぐことを検討することができます。

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

そこでEasy Digital Downloadsの出番です。eBook、PDFファイル、動画、MP3音声ファイル、その他あらゆるタイプのデジタル製品を簡単に販売できるWordPress eコマースプラグインの一つです。

An MP3 product page created using Easy Digital Downloads

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

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

Easy Digital Downloadsを設定したら、左メニューの「Downloads」をクリックするだけで、各MP3を新規商品として追加できます。

新規追加」ボタンをクリックします。

Adding an MP3 file to Easy Digital Downloads

デジタルダウンロード用の商品ページを作成する画面が開きます。

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

ファイルのダウンロード」セクションまでスクロールし、リンクのようなアイコンをクリックします。

How to sell an MP3 audio file using EDD

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

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

Publishing an MP3 using Easy Digital Downloads

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

この投稿が、WordPressでMP3音声ファイルを追加する方法を学ぶのにお役に立てば幸いです。次は、WordPressで音声音楽プレーヤーを追加する方法とオーディオブックをオンラインで販売する方法をご紹介します。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

情報開示 私たちのコンテンツは読者支援型です。これは、あなたが私たちのリンクの一部をクリックした場合、私たちはコミッションを得ることができることを意味します。 WPBeginnerの資金源 をご覧ください。3$編集プロセスをご覧ください。

アバター

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

究極のWordPressツールキット

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

Reader Interactions

22件のコメント返信を残す

  1. christopher baxley

    Thanks for the help. My blog is 6 months old, I was having issues with uploading audio into a post. You gave a clear and understanding example on how to upload them. You’ve saved me a lot of heartache and frustration. thank you. Have a great day.

    • WPBeginner Support

      You’re welcome, glad our article could help :)

      管理者

  2. Glen Donohue

    How to get the MP3 in to blubrry press with out having to do it myself all the time should be a way for it to read rss and add it each time there is a new podcast?

  3. Monique Stam

    This only works if you can afford WordPress Premium or better, as fas as I can tell.

  4. Mike P.

    You might want to edit this post. Since 3.6 (we are on 4.X) WP can support native audio embedding. The plugin is not needed.

  5. Michele

    Worked great, thanks!!

  6. Carla

    This plugin is old, but the newest one, PB oEmbed HTML5 Audio – with Cache Support, is awesome!!! It is ridiculously easy to use. Just be sure to remove the extra code around the link that Wordpress creates when you insert an MP3 file into a post or page.

    By the way, for those who do not know how to insert an audio file into a post or page, add it just as you would a photo, using the Media button.

  7. Alan Thompson

    Hello

    I’m sure the solution above works very well for individual posts. Does anyone have any ideas how to integrate a music player which continues playing as the user browses to other pages /posts – like the bar across the bottom of the screen when you play a track at http://www.jamendo.com?
    Regards
    Alan

  8. khuram khan

    thanku for sharing such a great idea …

  9. roni

    How to play auto mp3 on website

  10. Erin Dougherty

    There’s a media file mb limit of 10mb and my audio file is 11mb. How can you add a media file larger than 10mb or how can I reduce the size of my mp3 file in order to upload it to my wordpress site?

    • Duckworth

      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

  11. kainer

    People, get rid of all plugins that not support their service on browsers like ie, chrome, firefox and mobile phones/pads. Why somebody still developing this shit?

    You can not use plugins which only serve 50% of all internet users!

    …..and if you see one of this half baked plugins: DON’T PROMOTE IT! It is useless.

    THX for the article btw….

    • Editorial Staff

      I think you are misunderstood about the plugin’s compatability. It works with all browsers and have a backup Flash based player for MP3.

      For other file formats OGG and WAV, it is not supported on IE 8, 9, and Safari. But again, we wrote this article for MP3 files, and this plugin supports that on all browsers. The wording on the plugins detail page might be confusing, but if you look carefully, there is a semi colon there that separates OGG, WAV – not supported.

      管理者

  12. Warren Horak

    Thanks for this post.

    Just one problem, when I update it URL link appears in the post with no player ? How can I fix this?

    Thanks

    Warren

  13. Osagie 'OsaGz' Alonge

    Has any noticed this plugin doesn’t work on mobile? Is there any audio player that can stream music on mobile platform?

  14. Tim Hyde

    I recently discovered the oEmebed HTML5 Audio plugin which is really simple. I wanted a way to avoid using SoundCloud and their fees!

    This plugin will embed the HTML audio player, with a flash backup for any mp3 url it finds in your post.

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

    This way you can store your audio anywhere. A public DropBox folder works pretty well and couldn’t be simpler.

    • Noumaan Yaqoob

      Tim actually this is the same plugin discussed in the article above. No doubt its a great plugin. The public dropbox idea is cool.

      So basically you can just upload an audio file mp3 or ogg in Dropbox public folder. Get the link of the file from drop box and just paste it in posts.

  15. Liam

    Thanks for sharing!

  16. Jake

    Does this work well on mobile? I can imagine that it would be hard to click the buttons on an iPhone.

  17. Andrew Ledwith

    I’ve been using Blubrry PowerPress to embed audio on several WP websites. I’ve been very pleased with its performance and robust set of options.

返信を残す

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