ブログにApple Podcastプレイヤーを埋め込み表示する方法
こんにちは。ブロガーのリッキー(@rickey_blog)です。ブログとポッドキャストで誰でもデキるライフハック情報を毎日配信しています🎙
Apple Podcastに新しい機能が加わり、Apple Podcastのプレイヤーをブログ記事などに貼り付けることができるようになりました。
動画の次は音声配信という波がきています💦ブログにポッドキャストのリンクを貼っておくと、サイトの滞在時間を長くすることができます。
Apple Podcastでポッドキャストを配信している方にとっては、必須の機能となっています‼️まだ貼り付けの仕方をチェックしていなかったという方は本記事を最後までみてください。
このブログを書いているリッキーのプロフィール
Apple Podcastテクノロジー分野で最高３２位のポッドキャストをやっている人
今まで、Spotifyのポッドキャストを埋め込んでいた人
ブログとポッドキャストでライフハックに関する情報を発信している人
WebページやブログにApple Podcastを埋め込む方法
先日、AppleからPodcast Creator宛にこんなメールが届きました👇
英語だったので、見逃してしまいそうだったのですが、、、
Apple Podcastで、ポッドキャストをWebサイトやブログに埋め込むことができるようになったという内容☝️
埋め込む方法を備忘録としてシェアしておきます🎤
Apple Podcastをブログに埋め込む手順
まず、Apple Podcast Marketing Toolsへアクセス▼
🔗 https://tools.applemediaservices.com/apple-podcasts
自分のポッドキャストの番組名などで埋め込みたいコンテンツを表示させます。
検索欄に「リッキー」と入力👇
大本のPodcastとエピソードが表示されます。
埋め込みたいエピソードを選ぶと、以下の項目が表示されます▼
Content Link
Podcast Player
Short Link
Badges and Lockups
App Icon
QR Code
ここで、ブロガーにとって一番便利なのが、Podcast Payerによる埋め込みです。
ブログ上でPodcastを再生できるようになります☝️
※わざわざApple Podcastを立ち上げなくてよい👍
Podcast Playerはこのように表示されるので、「Copy Embed」をクリックして、貼り付け用のコードを入手します👇
ブログ記事の編集画面で「カスタムHTML」を呼び出し、さきほどコピーしたコードを貼り付けます👇
ここでプレビューを表示すると、このようになります👇
ブログのページ上でポッドキャストを再生できるようになりました。
右の・・・をクリックすると👇
エピソードに移動をすると、Macの場合はPodcastアプリが起動。
リンクのコピーはURL、埋め込みは埋め込み用のコードが生成されます☝️
なので、ポッドキャストのシェアがよりカンタンになりました💦
Spotifyのポッドキャストを埋め込む場合
SpotifyのポッドキャストはリンクURLをペーストするだけで、埋め込まれます👇
Apple PodcastとSpotifyを比較すると、こんなかんじ👇
Spotifyの方が大きく表示されます。
Apple Podcastのプレイヤーの表示大きさは、コードのHeightとWidthの数値を書き換えれば調整することができます。
しかし、縦幅は175pxでジャストサイズになるようになっていました💦
横幅を800px、縦幅を200pxにした場合、縦幅が少し収まりません👇
Apple Podcastの埋め込みプレイヤー
Apple PodcastそのものをEmbed Playerでブログなどに埋め込むことができます。
Apple Podcast Embed Playerはブログの記事下に入れておこう！
Apple Podcast Marketing Toolsをクリック👇
🔗 https://tools.applemediaservices.com/apple-podcasts
検索で、自分のPodcastを表示させます。
ここで、Copy Embedをクリックし、カスタムHTLMで貼り付ければ、貼り付け完了✅
実際に埋め込むと、ポッドキャストのアイコン、最新のエピソード５つがブログに表示されます👇
実際に１つのエピソードを再生すると、左側のプレイヤーに表示されます。さらに、エピソードに添付した概要欄も見れるようになります。ただし、概要欄に貼り付けたリンクは飛べなかったです💧
ブログの記事下に入れておくと、フォローに繋がりますね☝️
バッジ、アイコン、QRコードを生成する
あなたへのリンクとなるバッジ、QRコードを生成がカンタンにできます。
さらに、貼り付け用のコードも生成されるので、カンタンにブログに貼り付けできます。
バッジは色や言語を選択👇
アイコンをモノブラックにした場合👇
日本語表示の場合👇
アイコンはこんなかんじ👇
ブラックにもできます👇
QRコードも同様に色を選択できます。
一般的なQRコード👇
黒背景のQRコード👇
紫のQRコード👇
QRコードの真ん中にポッドキャストのアイコンをいれることもできます👇
これは、ちょっと絵的に微妙かな〜と思います💧
まとめ
Apple Podcastのプレイヤー埋め込みはカンタン
ブログに貼り付けると、サイト滞在時間が伸びる⤴️
バッジ、アイコン、QRコードも生成できる
リッキーのポッドキャストへのCTAにApple Podcastのアイコンも追加することができました👇
記事下をプレイヤーだけにしようか・・・ちょっと悩みます💧
【関連記事】
コメント
No comments yet