【wordpress】ツイート埋め込み術について～ブログテーマ「JINの場合」～

【概要】

ブログのサイドバーにツイッターを埋め込む方法
ツイッターカード設定方法【ブログテーマJINでの方法】

こんにちは。いーか(@iika246)です。

ツイート、どうやって埋め込むの？
ツイッターで呟いたときのカードどうやるの？
「wordpress」ブログのテーマが【JIN】だけどどうやるの？

悩むかもしれません。
実際当ブログは2つ目の作成ですが、悩みました（笑）
やってみればそんなに難しくない設定であり、一度設定すると「twitter」でカードになって出てきます。
ここまで出来ると立派なブログっぽく見えるのでぜひ挑戦してみましょう。

iika246

「もちろん、Twitterのアカウントが無いと出来ないよ！！」

今回前提条件として

Twitterのアカウントを持っている人
「wordpress」でブログを作成している人
ブログのテーマが「JIN」の人

を対象にお話していきます。

mokuji

１．「wordpress」ブログトップに「twitter」を埋め込む方法
- 1-1.埋め込みツイート作成
２．「twitter」でブログのURLを貼るとかっこよく出す方法（ツイッターカード）
３．「wordpress」ブログ内で (@iika246)を出す方法
- プロフィールのSNSアイコンについて
終わりに

１．「wordpress」ブログトップに「twitter」を埋め込む方法

まずはブログのトップにツイートを出す方法からご説明します。
ブログでよく下記の部分見たことありますか？

こちらの方法についてご説明します。

iika246

「実はタイムラインと呼ぶみたいですよ」

1-1.埋め込みツイート作成

まず、下記へアクセスをお願いします。

【Twitter】カード作成用サイト

1-1-1.丸印の部分に自身のTwitterのURLを入力します。

iika246

「ツイッターのURL？？」

ツイッターのURLはブラウザから入ると確認出来ます。
私の場合は下記のようになっています。

恐らく変更されていなければ、【https://twitter.com/○○（○○の部分はユーザ名）】になっているでしょう。

1-1-2.「Embedded Timeline」を選択する

1-1-3.丸印のボタンを選択、コードをコピーします

次にこのコードに一部編集します。
※もし、追記せずにそのまま貼りつけると・・

iika246

「これは大変！！」

1-1-4.下記のように編集します。

【編集前のコード】

<a class=”twitter-timeline” href=”https://twitter.com/iika246?ref_src=twsrc%5Etfw”>Tweets by iika246</a> <script async src=”https://platform.twitter.com/widgets.js” charset=”utf-8″></script>

【編集後のコード】

<a class=”twitter-timeline” data-width=”300″ data-height=”400″ data-theme=”light” href=”https://twitter.com/iika246?ref_src=twsrc%5Etfw”>Tweets by iika246</a> <script async src=”https://platform.twitter.com/widgets.js” charset=”utf-8″></script>

iika246

「これできっと私と同じ形になる・・」