好きなもの、好きなだけ、盛り合わせ

AWAの曲をプレイヤー形式でサイト(ブログ)に埋め込む方法!

      2017/02/11

サイバーエージェントとエイベックスが共同出資して設立した「AWA株式会社」が提供する音楽配信サービス「AWA(アワ)」。

  • Spotify
  • Apple Music
  • Google Play Music

などの大手音楽配信サービスと比較すると、利用者はそこまで多くないはずですが、無料でも利用できたり、直感的に操作できたり、色々と使い勝手の良いサービスではあります。

Spotify Apple Music Google Play Music などの海外勢の

そして、そんなAWAに最近また新しい機能が実装されました。

サイト(ブログ)にプレイヤー形式で曲を埋め込める!

その新機能とは、自分のサイト(ブログ)にプレイヤー形式で曲を埋め込める機能です。

簡単に言うと、AWAのアプリを起動しなくても、AWAを利用していなくても、その場で曲を再生できるようになります。(再生時間は30秒ほど)

例えば、この下に僕の作った曲を埋め込んでみましたが、再生ボタンを押すと曲が流れるはずです。

YouTubeなどは別として、僕の記憶によると、プレイヤー形式で埋め込めるのは「SoundCloud」や「Spotify」くらいで、音楽配信サービスでこのような機能を実装するのは珍しいです。

曲を埋め込む方法

では、どうやってサイトに曲を埋め込むのかご紹介しましょう。

コードをコピーする

まずは、曲の埋め込みコードをコピーします。(今回はPCの時の手順ですが、スマホの時も手順は同じです)

埋め込みたい曲を再生し、お気に入りアイコンの右隣にある「三点リーダー」をクリック。

 

  1. この曲をシェア
  2. 埋め込みコードをコピー

と進むと、コードがコピーされます。

コードを貼り付ける

YouTubeの埋め込みコードと同じく「iframe」形式でコピーされるので、YouTubeの動画を埋め込むようにコードを貼り付ければOKです。

例えば、WordPressであれば、「テキストエディタ」にして、コードを貼り付けるだけ。これで埋め込み完了です。簡単ですね!

プレイヤーの幅や高さを変える方法

デフォルトでは、

  • 幅:100%(レスポンシブで画面幅いっぱいになる)
  • 高さ:354px

ですが、任意のサイズに変更することも可能です。

例えば、横幅400px、高さ300pxにする場合は、コードの中の値をそれぞれ「width=”400″」と「height=”300″」にすればOKです。

まとめ

  • WordPress
  • はてなブログ
  • ライブドアブログ

などはもちろんのこと、アメブロにも埋め込みできる(執筆時点では、LINEブログは不可)ので、お気に入りの曲を埋め込んでみてはいかがでしょうか?

以上、AWAの曲をプレイヤー形式でサイト(ブログ)に埋め込む方法のご紹介でした!

カテゴリー 音楽配信サービス

注目 初めての就職・転職で失敗しないためのおすすめサービス一覧!

注目 会計ソフト「MFクラウド確定申告・経理」の使い方を徹底解説!

注目 クラウド会計ソフト「freee」の使い方とスマホでの操作方法!

この記事が気に入ったらいいね!しよう

最新情報をお届けします

この記事を書いた人:シェフ

WEBメディア「MORIAWASE」の運営者。求人広告会社の元施設長で、趣味は音楽制作(DTM)。育児に奮闘中です!

閉じる

CLOSE

アーカイブ

CLOSE