wordpress以外のブログサービスで記事内にSpotifyを埋め込む方法

photography of furniture and appliances at home webツール
Photo by Alina Vilchenko on Pexels.com
スポンサーリンク

wordpress以外でも出来る?Spotifyを記事に埋め込む方法とは。

※Seesaaブログ利用時に投稿した記事を編集しています。

この曲、みんなと共有したい!
ブログに埋め込んで、少しかっこよく魅せたい!

そう思った方いるんぢゃないですかね?

adult beautiful blur casual
Photo by Burst on Pexels.com

私も、そのうちの1人です😝😅

でわ
どうすれば、埋め込みが出来るのか?

私はスマホで、Spotify使って、カーオーディオにBluetoothで飛ばして聴いたりする事もあります

スマホアプリのSpotifyには共有ボタンがありますが、リンクをコピー迄しかありません

埋め込みコードをコピーという項目が存在しないんですね💦

埋め込みコードがない・・・

ぢゃどぉやって埋め込もうか?出来るのか分かりませんが、ググりましたよ!

最初はスマホからクロームでSpotifyにログインで、パソコンモードにて閲覧で、埋め込みコードがあるだろうと勝手に思い込んでましたがありませんでした💦

どぉやらパソコンにSpotifyのアプリをインストールすると、埋め込みコードのコピーが出来るようです

で、パソコンにSpotifyアプリをインストールしたよ🎵

ありましたね!埋め込みコードのコピー

埋め込みコードをコピーしたので、Seesaaブログに、埋め込みしてみましたよ

実際にSpotify埋め込みしてみました

パソコンアプリのSpotifyから埋め込みコードを取得して埋め込んだものが下記
なかなか魅せてくれますね🎵

※下記より曲が違いますが、方法は同じです。

埋め込みコード説明

肝心な埋め込みコードですがこのようになってました↓↓↓

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

こちらは同じ曲をスマホのアプリでリンクをコピーしたもの【URL部分】↓↓↓

https://open.spotify.com/track/1WmoDex6I3RyAyYSAgRAvL?si=48IamaYBQC6MhqwVgdF1gg
https://open.spotify.com/ここからコードが異なりますね

こちらがパソコンから埋め込みコードを取得したもの↓↓↓

https://open.spotify.com/embed/track/1WmoDex6I3RyAyYSAgRAvLs://open.spotify.com/embed

embedがプラスされてます

またパソコンで埋め込みコードを取得したものは
スマホでコピーしたリンクのクエスチョンマーク以下がありません

でわ埋め込みコードは・・・?

埋め込みコードは下記となります

<iframe src="https://open.spotify.com/embed/ここにスマホでコピーしたリンクのalbum or trackから?マーク直前迄を貼る" width="300" height="380" frameborder="0" allowtransparency="true" allow="encrypted-media"></iframe>

アルバム単位でも、コードの中身の差し替えは同じくクエスチョンマーク直前迄を、上記の埋め込みコードに挿入して頂けると問題なく
記事にSpotifyを埋め込みが可能
ですよ🎵
※数字は埋め込むサイズとなりますので変更も可能です

スマホアプリからのアルバムのリンク【URL部分】↓↓↓

https://open.spotify.com/album/7oPUiFyVwpKOyQ4TIBVg0J?si=e6QIc6H8SrS1IDY0KiRb1A



↑↑↑
説明通りにリンクを挿入し記事に貼り付けると
↓↓↓

肝心な埋め込みコードですがこのようになってました↓↓↓

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

※コード表記がトラック単位になってましたので修正しました。2020年8月29日

この方法だと、wordpress以外のブログでもSpotifyの埋め込みが可能なはずです。

機会があればお試し下さい🎵

追記※2020年8月29日

最後に、記事にcodeを表示させるには下記で置き換えます。

タイトルとURLをコピーしました