会社を辞めずに賢く副業で稼ぐわかチンのブログ

» 「1人で作業するのが辛くなってきた...」そんな時は、無料のもくもく作業会をご利用ください!孤独感がなく、作業がはかどります。興味がある方は【!!●ここをクリック●!!】

【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

ブログの始め方

ブログに音声を埋め込みたい
「どのように音声収録するのがベスト?」
「ブログに音声を埋め込む方法を知りたい」
このような疑問が出てきました。

このようなお悩みを解決するための、お手伝いをします。

本記事の内容

  • ブログに音声を埋め込む方法
  • ブログに埋め込む音声収録の方法

この記事を読むメリット

  • ブログに音声を埋め込めるようになる
  • ブログ発信と音声発信が同時にできる

この記事を書いている僕は2020年9月から副業を始めました。現在は本業と両立し、毎日ブログを執筆しながら活動しています。
そんな僕は最近「stand.fm」を使って音声配信を始めました。そしてある日、「音声を動画とは別で情報発信のコンテンツの1つとしてブログに埋め込みたい」と思いました。色々調べた結果、現在ではブログに音声を埋め込むことが簡単にできるようになりました。
日々どんなことを意識し、ブログに音声を埋め込んでいるかシェアしていきます。参考なると嬉しいです。

結論です。

音声の埋め込みはSEOの効果も抜群です。

上記のとおりです。
過去の僕と同じ悩みを抱える方へ、心を込めて深堀りします。

本記事の動画解説版

ブログに音声を埋め込む方法

【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

「ブログに音声ってどうやって埋め込めば良いのだろう?」

こちらのテーマではこのような疑問を解消するために深掘ぼり解説をしていきます。

本テーマの内容

  • ソースコードを使用して埋め込む方法
  • stand.fmの音声をブログにアップする方法

このテーマを読むことのメリットはこのような内容です。

  • あなたのブログに音声を簡単にアップロードできます。
  • アップロードに必要なソースコードを手に入れる事ができます。

ソースコードを使用して埋め込む方法

こちらでは「GarageBand」で音声収録を行い、MP3ファイルに落とした音声をブログに埋め込む方法です。音声の再生タイプに合わせて下記のソースコードを使い分けて下さい。

通常の再生方法で埋め込むためのソースコード

<audio src=”sample.mp3″></audio>

コントローラーを表示させた音声を埋め込む場合のソースコード

<audio src=”sample.mp3″ controls></audio>

自動再生させたいさ場合はこちらのソースコード

<audio src=”sample.mp3″ autoplay></audio>

ループ再生をさせたい場合はこちらのソースコード

<audio src=”sample.mp3″ autoplay loop></audio>

音声を出さずに再生させるソースコード

<audio src=”sample.mp3″ muted></audio>

こちらを「テキストエディタ」に書き込むことで使用可能になります。みなさんも是非音声を埋め込んでみましょう。

stand.fmの音声をブログにアップする方法

こちらでは「stand.fm」を使って収録した音声をブログに埋め込む際に必要になるソースコードをご紹介します。

パソコン版で音声のソースコードを取得する方法

パソコンで埋め込みたい音声のページを開きます。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

こちらをクリックします。

右下にあるこちらのボタンをクリックします。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

埋め込み」をクリックします。

このような画面が出現します。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法
埋め込み」をクリックするだけでコピーされます。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法
これでOKです。ソースコードの取得完了!

スマホ版で音声のソースコードを取得する方法

スマホで埋め込みたい音声のページを開きます。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

こちらをクリックします。

右下の「・・・」をクリックします。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

埋め込み」をクリックします。

このような画面が出現します。クリックするだけでコピーされます。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

これでOKです。ソースコードの取得完了!
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

注意点

取得したソースコードをそのまま「テキストエディタ」に貼り付けると、貼り付け位置が崩れることがあります。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法
このような場合は、下記の「コード」をstand.fmで取得したソースコードに入れて下さい。必要なタグはこちらです。

padding-right: 70px;


              

このように表示されます。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法
このように音声の埋め込みができます。

●「テキストエディタ」についてはこちらの記事を参照してください。

こちらのテーマでは「ブログに音声を埋め込む方法」について深掘り解説してきました。こちらの件でご相談がある場合は無料相談を行なっています。
» 【無料】30分無料相談

ブログに埋め込む音声収録の方法

【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

「ブログに埋め込むための音声はどうやって収録するのがベスト?」

こちらのテーマではこのような疑問を解消するために深掘ぼり解説をしていきます。

本テーマの内容

  • GarageBandを利用して収録
  • stand.FMを利用して収録

このテーマを読むことのメリットはこのような内容です。

  • Macユーザーは簡単に収録ができます
  • 音声メディアでの配信が同時にできて一石二鳥

GarageBandを利用して収録

こちらでは上記で説明した「MP3ファイル」の形式で音声を収録するための方法をご紹介します。
使用するソフトは「GarageBand」になります。
» GarageBand
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

アプリを開いて「ボイス」をクリック

アプリをインストールすると最初にこのような画面が現れます。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

収録したタイプの音声を選択して「スタート」をクリック

たくさんの機能がありますので是非活用してみて下さい。
【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法

こちらで完成です。

こんな感じで音声を埋め込むことが可能です。

このように簡単に収録可能です。
iPhoneでもアプリは取得可能です。MacBookがなくてもiPhoneがあれば収録自体は可能になります。

音声メディアでの配信が同時にできて一石二鳥

「音声メディアとGarageBandなどのソフトはどのように使い分ければ良いの?」

こちらのパートではこのような疑問にお答えをしていきます。

僕の場合はこのように使い分けています。

  • 音声メディア
    ⇨一般公開する音声
  • GarageBand
    ⇨特定の人だけに届ける音声

音声メディアは現在たくさんのプラットホームがあります。

などたくさんあります。選定基準としてはあなたが発信するジャンルのターゲットがどのプラットホームにたくさんいるかです、まずはリサーチをしましょう。
これからはブログだけ、YouTubeだけ、音声だけでの収益化は難しいと言われています。そのため、満遍なく情報発信を行う必要があります。
流れで言えば、YouTubeや音声メディア、SNSなどを使ってブログに流す、そしてブログを読んでいただきリストを取得する。という流れがベストです。全てはリストありきでメディア運営が成り立ちます。皆さんも是非音声収録をきっかけにしてもらい、メディア運営を円滑に回していきましょう。

●リスト取得についてはこちらの記事を参考にしてください。

こちらのテーマでは「ブログに埋め込む音声収録の方法」について深掘り解説してきました。こちらの件でご相談がある場合は無料相談を行なっています。
» 【無料】30分無料相談

まとめ

【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法
この記事では「【ブログ初心者/執筆作業・その14】ブログに音声を埋め込む方法」というタイトルを下記のテーマにまとめて解説しました。

  • ブログに音声を埋め込む方法
  • ブログに埋め込む音声収録の方法

という内容でお届けしました。

それでは最後まで読んでいただいてありがとうございました!

最後までお読みいただき、ありがとうございます。下記の自宅で学べる無料講座「THE 副業大百科 〜個人の力でお金を稼ぐ〜」も、是非チェックしてくださると喜びます🙇‍
講座を視聴していただいた方限定で豪華特典を無料プレゼントしているので、この機会にどうぞ💁‍♂️

自宅で学べる無料講座

賢い副業!特別ウェビナー

お知らせ:厳選した下記のコンテンツがおすすめです

サラリーマンから主婦の方に対応しており、これから賢く副業をスタートしたいとお考えの方は、ぜひどうぞ🙇‍

おすすめコンテンツ

無料コンテンツ

有料コンテンツ

当ブログと他のサイトの圧倒的な違いは、様々な疑問や悩みを解決するために【無料体験レッスン】30分の無料相談会&体験レッスン(オンライン開催)に初回限定で参加できることです。

どうしても分からなかったり、1人で悩むことがあればご相談ください。

その他、ご相談&ご質問がございましたら、お気軽にどうぞ。
» お問い合わせ

無料から学べる「Wakablog College」に参加はお済みですか?会社を辞めずに副業で安定した収益を発生させるために、順序立てて学べるオンライン学習サイトです。この機会にぜひどうぞ💁‍♂️

僕は、こんな人です

わかチン
本業を捨てずに、ブログを主軸に収益を発生させています。また、副業を始めた人が迷わずに学べるオンラインスクール【Wakablog College】を運営しています。当ブログではみなさんにとって有益な情報を無料で提供していきます。一緒に頑張っていきましょう!「サラリーマンや主婦の方向け!個人の力でお金を稼ぐための講座」を無料配信中!無料で集中して作業ができる環境→ もくもく作業会
» プロフィール詳細はこちら

チップをいただけると、心から喜びます

特別配信【THE 副業大百科】個人の力でお金を稼ぐ【無料で受講できる特別講座】

挫折防止【1人じゃない!】ZOOM もくもく作業会〜孤独社会からの脱却〜