microCMSの埋め込みプレビューをブラウザに表示させる方法
解決したいこと
microCMSの埋め込みプレビューをブラウザに表示させる方法を知りたいです。
QiitaにてQ&Aでも投稿してしまいましたが、microCMSを利用して、通常のサイトをリンクカードで表示させる方法を知りたいです。
現在添付写真のようにmicroCMS側で埋め込み編集を設定すると、
Next.js側で画面表示させる時にエラーが出てしまいます。
getStaticPropsで取得したcontent内にある、該当箇所のHTMLを直接JSXに記載し、表示させても同様にエラーがでます。
content内の該当箇所のHTMLは以下の通りです。
<p></p>
<div class="iframely-embed">
<div class="iframely-responsive" style="height: 140px; padding-bottom: 0">
<a
href="https://zenn.dev/chida/articles/882d9fb1d71fa1"
data-iframely-url="//cdn.iframe.ly/api/iframe?card=small&url=https%3A%2F%2Fzenn.dev%2Fchida%2Farticles%2F882d9fb1d71fa1&key=c271a3ec77ff4aa44d5948170dd74161"
></a>
</div>
</div>
<script async src="//cdn.iframe.ly/embed.js" charset="utf-8"></script>
<p></p>
<div class="iframely-embed">
<div class="iframely-responsive" style="height: 140px; padding-bottom: 0">
<a
href="https://expressjs.com/ja/starter/installing.html"
data-iframely-url="//cdn.iframe.ly/api/iframe?url=https%3A%2F%2Fexpress.com%2Fja%2Fstarter%2Finstalling.html&key=c271a3ec77ff4aa44d5948170dd74161"
></a>
</div>
</div>
<script async src="//cdn.iframe.ly/embed.js" charset="utf-8"></script>
SSGでやっているから悪いのでしょうか。
microCMSを利用してリンクカードを表示することができている方、いらっしゃいましたら、
ぜひご教示頂けますと幸いです。
0 likes