ブログ開設&設定&操作

ワードプレスでツイッター&インスタを記事に埋め込みする方法を画像付きで解説!プラグインは必要なし!

めいた
めいた
ワードプレスの記事の中にツイッターやインスタを埋め込むってどうやるの?プラグインいる?
めいこ
めいこ
ツイッターとかインスタの画像を記事に使いたいなーってとき、簡単にできるもんなの?

ブログ記事を見ているとツイッターやインスタを埋め込みしている人が多いですが、これはワードプレスのプラグインなしで簡単にできます!

ブログ記事を書いていると自分のツイートや人様のインスタ画像を引用したい!

ってことありますよね。

今回は誰でも簡単にツイッター・インスタを埋め込む方法を解説していきます。

早速見ていきましょう!

カズマ
カズマ
こんにちは、カズマです。

僕は副業でブログをスタートして、現在は家族との時間を大切にしながら在宅で自由にビジネスをしています。

僕がいまのような家族中心の生活を手に入れた方法を、期間未定で特別に公開しています。

是非一度、見てみてくださいね。

この記事でわかること
  • ワードプレスにツイッターを埋め込む方法
  • ワードプレスにインスタの画像を埋め込む方法

 

ワードプレスでツイッターを記事に埋め込みする方法【画像で解説・プラグイン不要】

まずワードプレスで書く記事にツイッターを埋め込むメリットを最初にご説明します。

めいこ
めいこ
なんで多くの人はツイッターを埋め込んでるの?

そんな疑問にお答えした上で、実際の埋め込み方法をご説明しますね。

 

ツイッターをブログ記事に埋め込むメリット

ツイッターをブログ記事に埋め込むメリットは4つ!

  1. 自分のツイートで共感の多いものを埋め込めば読者にも刺さる
  2. ブログ記事のネタをツイートから補える
  3. 人様のツイートでも共感が多いものを引用できる
  4. ツイートで使われる画像を活用できる

人によっては他にもあるかもしれませんが、私が考えるメリットは上記です。

例えば、実際に私の共感の多いツイートを用いて①を試してみましょう。

 

例文:人に行動を起こさせる方法

仕事で部下や後輩に行動してもらうには、相手の脳が4つのうちどのタイプか見極めることが重要です。

基本的に人はこの4つのどのタイプも持ち合わせていますが、優先度がそれぞれ違います。

・・・

いかがでしょう。

この様に共感の高かった自分のツイートを用いることで、読み手を納得させるためのツールになるんですね。

ツイッターの埋め込みはどんどん活用していきましょう。

※なお、ツイッターの埋め込みは著作権で大丈夫なのか?と心配される方がいますが、全く問題ありません。Twitter社の規約にも書いてありますので、心配な方はこちらをどうぞ。

 

ツイッターをてっとり早く埋め込みするなら

ツイッターの埋め込みは2種類あります。

一番手っ取り早いのが、埋め込みたいツイートのURLをコピーして、ワードプレスの貼りたいところに直接ペーストするだけ。

これだけです、超簡単!

ただ、この方法は簡単シンプルな一方でデメリットとして、

  • テキストが文字数に反映されない
  • サイズの調整ができない

などがあります。

ツイートのテキストにキーワードが含まれている様な場合、せっかくなら埋め込んだツイートの文章もブログの文字数にカウントさせたいですよね。

またサイズの調整もできないので、基本的には次にご紹介するコードを貼り付ける方法を推奨します。

 

ツイッターの埋め込み方法①:ツイッターのコードをコピー

埋め込みたいツイートの右上にある▽マークをクリックして、次にツイートを埋め込むをクリック。

▽マークをクリックすると、メニューが出てきますのでその中から「ツイートを埋め込む」を選択します。

「ツイートを埋め込む」をクリクすると、新しい画面が表示されます。

 

赤枠の中のコードと呼ばれる長い文字列をクリックしてコピーします。

コピーができると、コピー完了画面に切り替わるので、ここまできたらワードプレスの記事作成画面へいきましょう。

 

ツイッターの埋め込み方法②:ワードプレスに埋め込み

続いてはワードプレスに先ほどコピーしたコードを貼り付けましょう。

この時ビジュアルエディタでなく、テキストエディタに貼り付けることを間違えない様にしてください!

これでワードプレスへのツイッターの埋め込みは完了です。

問題なく表示されるかどうか、必ずプレビューで確認しましょう!

カズマ
カズマ
たまにプレビューで表示されてないことがあるので、必ず確認してね。

 

ツイートの会話を外す方法

続いて、ツイートのリプライの部分をワードプレスに埋め込みたい場合に、その会話全てを埋め込むこともできれば、リプライだけを埋め込むことも可能です。

ちょっとわかりづらいかもしれませんが、

  1. 元ツイートとそれに対するリプを一緒に埋め込む
  2. 元ツイートはいらないのでリプだけを埋め込む

といった感じです。

①の場合はそのまま貼り付ければOK!

それでは②の場合はどうするのかご説明します。

 

右上にあるset customization optionsをクリック。

埋め込みたいリプライの部分で「ツイートを埋め込む」を選択するとこの様な画面になります。

今回は下にぶらさがっている画像付きのリプライだけを埋め込む方法です!

 

左上のHide Conversationをクリック。

Hide Conversationをクリックすると、次の画像の様に元ツイートが消えてリプライだけになります。

 

Updateをクリックして、コードをコピーする。

Updateを押したら元の画面に戻るので、コードをコピーして先ほどの手順通りにワードプレスに貼り付ければ完了です。

リプライだけを埋め込むのも非常に簡単ですね!

ワードプレスでインスタを記事に埋め込みする方法【画像で解説・プラグイン不要】

続いてはインスタをワードプレスの記事に埋め込む方法です。

基本的にはやり方はツイッターと変わらないので、非常に簡単ですよ!

 

インスタをブログ記事に埋め込むメリット

インスタをブログ記事に埋め込むメリットは3つ!

  1. フリー画像や有料画像にはない素敵な写真が見つかる
  2. 投稿した人の個性を出せる
  3. 著作権など気にしなくて良い

インスタもツイッターと同様に引用できることが利用規約に書かれています。

ですので、自分の好きなインスタグラマーの写真や芸能人の写真を、自分のブログに載せることができるんですね。

フリー画像や有料画像に自分の意図する画像がどうしても見つからない様な場合など、インスタで探してみてもいいかも。

 

インスタをてっとり早く埋め込む方法

インスタもツイッターと同様、URLをコピーして埋め込みたいところにペーストすれば簡単にできます。

インスタの場合は画像がメインでテキストは少ないので、URLを貼り付けする方法でも良いかもしれないですね!

サイズの調整などができないので、

  • サイズを調整したい
  • キャプションを外したい(後ほど説明)

ような場合は次に説明する方法での埋め込みをおすすめします。

 

インスタの埋め込み方法:インスタのコードをコピぺ

埋め込みたいインスタ画像の右上にある…マークをクリックして、次に埋め込むをクリック。

これでコピーしたコードをツイッターの時と同様にワードプレスのテキストエディタに貼り付けるだけです。

超簡単ですね!

自分のインスタ写真を貼り付ければ、拡散の効果にもなるので是非活用してください。

 

キャプションの追加とは?

もう一点、インスタのコードをコピーする際に、「キャプションを追加」の項目があったかと思います。

キャプションとはタイトルや説明文のことをいいますが、インスタの画像下にある文章のことを指します。

最初からチェックが入っていますが、外すとどうなるのか確認してみましょう。

 

  • キャプションを追加にチェック有り

  • キャプション追加にチェック無し

 

この投稿をInstagramで見る

 

@cocomi_553_officialがシェアした投稿

こんな感じで、キャプションの追加のチェックを外すと、かなりすっきりしたインスタ画像を貼り付けることができます。

文章の部分はいらないな、と思う方はキャプションの追加のチェックを外しておきましょう。

 

まとめ

今回はワードプレスでツイッター&インスタを記事に埋め込みする方法について画像使って説明してきました。

プラグインも使わず非常に簡単にできちゃいます!

ワードプレスで書いた自分のブログ記事にツイッターやインスタを埋め込みするメリットは様々あるので、是非活用してみてください。

カズマ
カズマ
ツイッターやインスタの埋め込みで装飾の幅はぐっと広がるよ!

最後に1つだけ、インスタの画像はあまりたくさん貼りすぎると画面の読み込みが遅くなると言われています。

テキストエディタに貼るコードのボリュームがかなりありますので、使い過ぎにはご注意くださいね!

最後までお読みいただきありがとうございました。

新しい働き方を今、あなたの手の中に

※1:登録直後に自動返信メール1通目似て登録者限定の特典をお届けしています。
※2:お預かりしたメールアドレスなどのプライバシー情報は当サイトのプライバシーポリシーに則り厳守します。
※3:メール最下部の解除リンクからいつでも登録を解除できます。

\1年後を変えるなら、いま!/
知識0経験0文章力0でも、初年度で年収100万円UPする方法。
無料特典を受け取る
\1年後を変えるなら、いま!/
知識0経験0文章力0でも、初年度で年収100万円UPする方法。
無料特典を受け取る