こんにちは、Rina（@Rina_wooooo）です。
前回「【簡単】初心者でもGoogleアドセンスに合格する7つのポイント」という記事を投稿しましたが、その中でインスタグラムの埋め込みについて少し触れました。
そこで今回は、インスタグラム、ツイッター、ユーチューブの3大SNSの埋め込み方法について解説します。
私はこれを学んでブログの書き方の幅が広がり、「他の人にもぜひ知ってほしい！」という思いで情報を共有しようと思いました。
もっと色々な表示のされ方をするにはプラグインを使うといいのですが、あまりプラグインを使いすぎると重たくなります。
”プラグインは使いたくない”
”シンプルで十分”
という方はこの記事をご覧ください。一発で理解できます。
ブログやネットが初心者の方にも分かりやすいように、画像をたくさん載せながら丁寧に解説しています。
SNSの埋め込みは、ブログを運営していくうえで知っていると何かと有利になる技です。
この記事を読んでSNSの埋め込みをマスターしましょう。
SNSの埋め込みとは？
SNSにはツイートや写真、動画などありとあらゆる情報が詰まっています。
そのようなSNSのリンクをブログの記事に貼ることができ、それを「埋め込む」と言います。
他人のSNSのリンクを貼って平気なの？と思うかもしれませんが、SNSの投稿画面には〈埋め込みタグ〉があります。
この機能を利用して引用することは著作権の侵害にはなりません。
※ただし、投稿者が”引用禁止”などの注意書きをしている場合は引用しないようにしましょう。
”写真や動画を挿入して記事をわかりやすいものにしたい”
”色々な人のつぶやきを挿入して世間の評判を説明したい”
ブログを書いているとこんな状況になりますよね。
とある風景、人、イラストなど、記事を見やすくするだけの目的に必要な場合はフリー素材を使うといいでしょう。
おすすめのフリー素材はこちら↓
何か紹介したい特定の場所や物の写真が必要な場合はフリー素材だとほとんど見つかりません。かと言ってその全てを自分で写真を撮るというのもなかなか難しいですよね。
そんな時に便利なのが「インスタグラムの埋め込み」です。
以下で埋め込みの詳しいやり方を解説していきます。
Instagramの埋め込み
①記事に埋め込みたいインスタグラムの写真を選び、その投稿の右上の「…」をクリック
②「埋め込み」をクリック
③「キャプションを追加」のチェックをはずし、「埋め込みコードをコピー」をクリック
（キャプションを追加にすると、その投稿のコメントやハッシュタグ部分も一緒に表示されます。）
④自分の記事の投稿画面に戻ります。
ワードプレスの場合だとビジュアルエディタとテキストエディタがありますが、一番右上の「テキスト」の方を選び、貼り付けます（ctrl+v）。
ちなみに、「インスタグラムでもっと見る」「いいね！～件」などの部分が文字数に含まれてしまいます。
この投稿をInstagramで見る
①～④の手順でやっていくとこのように表示されます。
※「テキスト」で張り付けて「ビジュアル」で確認すると、写真が表示されてなくてあれ？と思いますが「プレビュー」で見れば写真まで全て表示されます。
「キャプションを追加」にするとこのようになります。
ここから少し応用編です。
⑤<center></center>でコードを挟むとページの中央に表示されるようになります。
「メディアを追加」で画像を挿入するときは大抵の場合配置を「中央」にすると思いますが、埋め込みしたものも中央に表示されると見た目がきれいになります。
⑥大きさを変える
デフォルトだと「max-width: 540px; 」になっていますが、この部分の数字を変えると表示される大きさが変わります。
下で表示されているものは「max-width: 300px; 」で、<center></center>で中央に表示されるようにしています。
この投稿をInstagramで見る
Twitterの埋め込み
ここまでできたら他のSNSも手順はだいたい同じですが、一つずつ確認していきましょう。
①記事に埋め込みたいツイートを選び、右上の「∨」をクリック
②「ツイートを埋め込む」をクリック
③別のページに移動するので、真ん中あたりにある「Copy Code」をクリック
ブログ初心者です！
📝https://t.co/s6yeLXRkmGのコンテンツ#宮古島観光#宮古島グルメ#宮古島移住
私と同じブログ初心者の方、宮古島の旅行や移住を考えていて情報を知りたい方、フォローお待ちしてます。
また、もっとこんな情報を教えてほしい！というのがあればお気軽にコメントください🥳
— Rina@初心者ブロガー (@Rina_wooooo) December 19, 2019
④インスタグラムのときと同じように「テキスト」から貼り付ける（<center></center>でコードを挟んで中央に表示）とこのように表示されます。
YouTubeの埋め込み
①埋め込みたい動画を選び、右下の「共有」をクリック（「…」じゃないので注意！）
②「埋め込む」をクリック
③右下の「コピー」をクリック
（このときに「開始位置」にチェックを入れると好きな時間から開始するように設定できます）
④インスタグラムのときと同じように「テキスト」から貼り付ける（<center></center>でコードを挟んで中央に表示）とこのように表示されます。
まとめ
SNSを埋め込むときの手順まとめ
- 埋め込みたい投稿の右端でそれっぽいものをクリック
- 「埋め込む」をクリック
- コードをコピー
- 「テキスト」の方に貼り付け
- 貼り付けるときは<center></center>でコードを挟んで中央に表示
いかがでしたか？
一度やり方を知ってしまえば簡単にできます。
SNSの埋め込みをして、より豊かなブログライフを送りましょう。
最後まで読んでいただきありがとうございました！
下のボタンからシェア、Twitterのフォロー、コメントしてもらえたら嬉しいです☺
コメントを残す