【簡単】Bloggerの本文に「音声」を埋め込む方法（MP3）-のんびりフリーランス

「あれ？Bloggerって画像と映像しかアップできないの！？」

と思ったことはありませんか？

「Bloggerで音声を埋め込むのってどうするの！？」

この間、私はBloggerで音声をアップできないことに気付きました。

「文字起こしの３つの方法」についてのブログを書いていたんです。

音声を使って文字起こしの方法を説明しようと思ったら、「あれ？画像と映像しかアップできない！！！」となりました。

ということで、今日は「Bloggerで本文に音声を埋め込む方法」についてのお話です。

Bloggerの本文に「音声」を埋め込む方法

Bloggerの本文に「音声」を埋め込む方法です。

私はエンジニアではないので、プログラミングの知識はゼロに近いです。

そんな私でも分かりやすく説明されているブログを発見しました。

こちらのエンジニアのブログを参考にさせていただきました。

エンジニアの方はすごいですね。

まず使用する「再生プレイヤータグ」は、こちらです。

<audio src="sound/sound.mp3" preload="auto" controls></audio>

「再生プレイヤータグ」を使うと、Bloggerの本文にMP3を埋め込むことができます。

「再生プレイヤータグ」で「sound/sound.mp3」の部分を変更します。

「sound/sound.mp3」の部分には「音声のアドレス」を入力します。

「sound/sound.mp3」の部分に入力予定の「音声のアドレス」を準備します。

フリー音声は「こえやさん」を使用させていただきました。

選択した音声の「︙」を右クリックして、「オーディオアドレスをコピー」を選択します。

以下のようなアドレスです。（●●●●の部分は音声によって変わります）

「https://firebasestorage.googleapis.com/v0/b/koeya-san.appspot.com/o/voices●●●●」

先ほどの再生プレイヤータグの「sound/sound.mp3」の部分に「音声のアドレス」を貼り付けます。

これをBloggerの本文に貼り付けます。

Bloggerの「投稿」で「HTMLレビュー」を開きます。

音声を埋め込みたい部分に、先ほど作成した「コード」を貼り付けます。

プレビュー画面で確認すると、音声が埋め込まれています。（プレビューでは音声はなりません）

「公開」にすると、音声が鳴ります。

MP3の埋め込みが成功です。

いかがだったでしょうか。

Bloggerで音声の埋め込みが成功したとき、私はちょっと感動しました。

また便利な機能があれば、ブログでお分かちできればと思います。