Cocoonで埋め込みリンクの簡単なやり方【インスタの方法も】

こんにちはシュージです。

皆さんCocoonでブログを書いているときに

埋め込みリンクが上手くいかない

そんな悩みがございませんでしょうか。

今回そんな方に向けに記事を書かせて頂きます。

結論から言うとメモにいったん貼り付けです。

以下から読みたい箇所をどうぞ

Cocoonで埋め込みが上手くいかない

ブラウザによってかは分かりませんが、

URLをコピーして記事内に貼り付けても

文字だけ出てきて内部にリンクがある状態です
（その状態で問題ない方はそれで大丈夫です）

これはブログカードに貼り付けても同じ現象が起きます。

これでは画像が出てこないので見た目のインパクトが落ちてしまいます。

↓こんな表示にしたいのにそのままだと出来ない

そこで、メモ（文字が書き込めるソフト何でも）に埋め込みたい記事のコピーを貼り付け

そのメモに貼り付けられたURLを又コピーです
（ちょっとややこしいですが、
一回テキストに戻してコピーし直すイメージです）

そして貼り付けたい場所で貼り付け。

何か聞かれると思うので埋め込みで大丈夫だと思います

内部リンクで見栄えを良くしたいなら

「ブログカード」で同じ手順で貼り付ければ良いと思います

こちらも該当のつぶやきのURLをコピーして、

メモで貼り付け＆コピーし直し！

そして該当箇所で貼り付け！

上のやり方が分ってるなら同じです。

手順①：インスタ側
インスタの投稿を埋め込みたい場合は
その投稿の右上の…（三点リーダー）をクリックそして「埋め込み」を押して、
「埋め込みコードをコピー」でコピー

手順②：Cocoon側
貼り付けたい記事の編集画面にて、
貼り付けたい場所でHTMLとして編集
（空白だったら適当に１文字入れる
→点々のオプションを押すとHTML編集がある）
その中に先ほどコピーした埋め込みコードを貼り付ける

手順③：確認する
プレビューでキチンとなってるか確認します。
（ビジュアル編集では反映されてない可能性が高いのでプレビューで念のため確認）

恐らくこれでインスタの投稿画面がそのまま表示されていると思います。

Cocoonで埋め込みが初見だと難しいけど、やってみると簡単だよ！
メモに一旦貼り付けてコピーし直して記事に貼り付けだけ！

インスタは少し手順いるので注意が必要！

それでは皆さんに良いブログライフを！