【改善のお知らせ】音楽サービスのコンテンツ埋め込みについて

音楽サービスのコンテンツ埋め込みについて

いつもAmebaをご利用いただきましてありがとうございます。
Amebaプロダクトマネージャーの田熊です。

Amebaでは特定の外部サービスのコンテンツを埋め込みコードを使い記事に貼り付けることができますが、この度、以下のサービスにつきましても貼り付けができるようになります。
※来週4月27日(月)よりご利用いただけるようになります。(27日16時20分頃よりご利用いただけるようになりました。)
※当日夕方以降にご利用いただける予定です。(多少前後する場合がございます。ご了承ください。)


 

■新たに利用できるようになるサービス

音楽サービス:


なお、現在も以下のサービスに関しご利用いただけますので、あわせてご利用いただければと思います。



■利用可能な外部サービスの一覧
https://helps.ameba.jp/faq/blog/article/post_55.html


■ご利用方法
1.あらかじめ貼り付けをしたい外部サービスにて、埋め込みコードを取得します

例)

  • Spotifyのプレイリストの埋め込みコード

<iframe src="https://open.spotify.com/embed/playlist/37i9dQZF1DX9vYRBO9gjDe" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>

 

  • Apple Musicの埋め込みコード

<iframe allow="autoplay *; encrypted-media *;" frameborder="0" height="450" style="width:100%;max-width:660px;overflow:hidden;background:transparent;" sandbox="allow-forms allow-popups allow-same-origin allow-scripts allow-storage-access-by-user-activation allow-top-navigation-by-user-activation" src="https://embed.music.apple.com/jp/playlist/%E3%83%88%E3%82%A5%E3%83%87%E3%82%A4%E3%82%BA-%E3%83%81%E3%83%AB/pl.2bb29727dbc34a63936787297305c37c"></iframe>

 

2.ブログを書くにてHTML表示にし、あらかじめ取得した外部サービスの埋め込みコードを貼り付けます

本文入力エディタ下部の「HTML表示」をクリックしてHTML表示にし、エディタに取得したコードを貼り付けます
外部サービスを埋め込んだ記事のプレビュー画面


 

3.記事を公開します
外部サービスを埋め込んだ記事の公開されたイメージ


また、その他記事内に埋め込みを行いたい外部サービスがございましたら、コメント欄にてお知らせください。Amebaブログ開発ディレクター・エンジニアにて拝見させていただきます。

これからもご利用の皆様の声を実現できるよう努めて参ります。
今後ともAmebaをよろしくお願いいたします。