動画データをYoutubeなどにアップして、それをブログやホームページに貼り付けている人はよく見かけます。
でも、音声をブログやホームページに貼り付けている人は、ほとんど見たことがありません。
音声を貼り付けるというのは、↓ このような形で、音声を再生するためのバーを表示されるということです。
再生ボタンをクリックしてみてください。
これは、Googleドライブに音声データをアップしたものを掲載しています。
今回は、音声データをGoogleドライブにアップロードし、そのデータをブログやホームページに掲載する手順を書いていきます。
Zoomで音声を録音する
Zoomで音声データを作成するには、設定が必要です。
パソコンのZoomアプリで、起動画面の右上にある歯車をクリックして、設定に入ります。
「レコーディングしています」を選択し、「各話者の音声トラックを記録」にチェックを付けます。
これで、Zoomミーティングに入り、パソコンにレコーディングをします。
ミーティングを終了したら、データの生成が始まりますので、それが終わるのを待ち、上の図の「開く」をクリックします。
「Audio Record」フォラダの中に、音声データができています。
Googleドライブにアップロード
このファイルを、Googleドライブにアップロードします。
アップロードしたファイルを右クリックして、「共有」をクリック。
「リンクをコピー」をクリックして、音声データのリンクを取得します。
メモ帳などに貼り付けると、こんな文字列が表示されます。
https://drive.google.com/file/d/1YQ-NJJKkLXfblIzZRLJ1bcRAG6oX5YqJ/view?usp=sharing
ブログやホームページに掲載
この赤文字の部分が必要になってきます。
https://drive.google.com/file/d/1YQ-NJJKkLXfblIzZRLJ1bcRAG6oX5YqJ/view?usp=sharing
赤文字の部分を切り出して、赤色以外の部分は、このまま使用してください。
<audio controls src=”https://drive.google.com/uc?id=1YQ-NJJKkLXfblIzZRLJ1bcRAG6oX5YqJ“></audio>
このコードをブログやホームページに貼り付けます。
繰り返し再生をしたい場合は、「loop」を追加します。
<audio controls loop src=”https://drive.google.com/uc?id=1YQ-NJJKkLXfblIzZRLJ1bcRAG6oX5YqJ”></audio>
ページを開いたときに自動再生させたいときは、「autoplay」を追加します。
<audio controls autoplay src=”https://drive.google.com/uc?id=1YQ-NJJKkLXfblIzZRLJ1bcRAG6oX5YqJ”></audio>
今回は、Googleドライブにアップロードしたファイルを使いましたが、他のどのサーバーにアップロードしても同じです。
src= の部分にアップロードしたファイルを指定してください。
<audio controls src=”アップロードしたファイル“></audio>
上記URLをコピー＆ペーストで貼る時の注意
上記のURL
<audio controls src=”https://drive.google.com/uc?id=1YQ-NJJKkLXfblIzZRLJ1bcRAG6oX5YqJ“></audio>
をブログやホームページに貼れば、音声再生のコントロールが表示さるのですが、この記事のHTMLをそのままコピーすると、ダブルクォーテーション「 ” 」が、全角になってしまい、音声を再生できません。
貼り付けたあと、ダブルクォーテーションを半角に直してくださいね。
