BLOG WordPress

WordPressにTwitterを埋め込む方法

投稿日:




どうも、べ〜やんです。

このブログもようやくTwitterのタイムラインをサイドバーに常時埋め込みするようにしたので、Twitterの埋め込み方法を紹介したいと思います。







メリット&デメリット

メリット

フォロワーが増える

Twitterを埋め込んでいれば、ブログから見てもらえフォロワーになってくれる人も増えるかも。

信頼性が高まる

今はインターネットの発達により情報がありすぎる時代なのでどんな情報を書いているかより誰が書いているかが重要になっています。

Twitterのツイート内容やフォロワー数なども信頼性のひとつの指標になります。

いいブログを書く → 誰が書いているか知りたい → Twitterのフォロワーが増える → 信頼性が増す → この人が書いている情報なら信用できる → また読みたい→ 新しい記事の通知が欲しい →…

と、言う感じでブログとTwitterの相乗効果で信頼性が高まる可能性がある。

コンタクトを貰いやすくなる

webサイトにはコンタクトフォームがあるのが一般的ですが、名前やアドレス、電話番号を入力してなど、めんどくさい作業ですのでTwitterで気軽にコンタクトをもらえれば思わぬ仕事が舞い込んだりします。

ただ、Twitterは気軽にコンタクトが取れる分必ず返信がもらえるかわからないのでどうしても返信が欲しい場合は正式なコンタクト先を探しましょう。

デメリット

サイトが重くなる

Twitterの埋め込みも多様しすぎるとサイトを重くしてしまいます。

表示が遅いサイトは読む気がなくなりますよね。ユーザーに優しいサイト作りを心がけましょう。




Twitterの埋め込み方法

Twitterを埋め込む三つの方法を紹介します。

基本的にTwitter Publishでコードをコピーしてテキストに貼り付けるだけなので簡単です。



タイムライン

Twitterのタイムラインを埋め込むには、まず自分のTwitterのURLを確認しましょう。

https://twitter.com/自分のユーザー名

↑が自分のTwitterのURLです。ユーザー名はTwitterで@ユーザー名という形で表示されています。

Twitter Publishにアクセスします。↓

https://publish.twitter.com/#

引用元:Twitter Publish

中央のバーに先ほどの自分のTwitterのURLを入力します。

埋め込みのタイプを選択します。ここではタイムラインを選択します。

引用元:Twitter Publish

カスタマイズを選択して、大きさや色を指定できます。

引用元:Twitter Publish

高さ、横幅を選択。(このブログのサイドバーでは、高さ500px、横幅350pxで埋め込んでます)

ライトモードかダークモードかを選べます。

色の指定は、ツイート内のリンクのURLを何色で表示するかを選べます。

言語を選択してTwitterのシステムの言語を変えられます。

下にプレビューが表示されるので確認しながら設定したら、更新ボタンをクリック。

引用元:Twitter Publish

500pxと350px、ダークモード、リンクは緑色、日本語表示にしてみました。

こんな感じ↓



更新するとコードをコピーするボタンが出てくるので、クリックしてコピーします。

WordPressの記事内に埋め込むには、投稿編集画面からカスタムHTMLモード(テキストモード)のブロックにそのまま貼り付けるだけです。

サイドバーに表示させるには、外観 > ウィジェット に移動してテキストをサイドバーウィジェットに引っ張って追加します。

追加したテキストをテキストモードに切り替えてコードを貼り付ければOKです。



ボタン

次は、埋め込みタイプをボタンにしてみます。

引用元:Twitter Publish

さらに、フォローボタンかツイートボタンかを選択できます。

引用元:Twitter Publish

選択するとコードをコピーするボタンが出てくるので、クリックしてコピーします。

WordPressの記事内に埋め込むには、投稿編集画面からカスタムHTMLモード(テキストモード)のブロックにそのまま貼り付けるだけです。



フォローボタン↓

ツイートボタン↓



単発ツイート

単発のツイートだけを埋め込むにはツイートの右上にある > みたいなマークをクリックします。

</>ツイートを埋め込むを選択すると、コードのコピーページに移動するのでコードをコピーします。

WordPressの記事内に埋め込むには、投稿編集画面からカスタムHTMLモード(テキストモード)のブロックにそのまま貼り付けるだけです。

こんな感じ↓




おわりに

TwitterもWordPressもバージョンによって若干違う部分があるかもしれませんが、2019年10月現在の方法を紹介しました。

あと、Twitterのフォローよろしくお願いします。




-BLOG, WordPress
-,

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

BLOGはじめました

はじめまして、べ〜やんです。 このブログは、大分県の田舎に住む31歳、高卒、低学歴のべ〜やんが未経験からWEBデザイナーになるために学んだことを公開していくブログです。 コーディングや勉強法を自分用の …

[WordPress]プライバシーポリシー設定法

どうも、べ〜やんです。 今回は、WordPressでプライバシーポリシーを簡単に掲示する方法を紹介します。 プライバシーポリシーとは プライバシーポリシーは、取得した個人情報の利用目的や管理方法を記載 …

Googleアドセンス審査通過

どうも、べ〜やんです。 今回は、このブログがGoogleアドセンスの審査を通過したので、審査に通過した時点のブログの状態を紹介します。 同じようにGoogleアドセンスの審査を受けようと思っている方の …

[WordPress] 目次を作るプラグインEasy Table of Contents

どうも、べ〜やんです。 今回は、WordPressのブログに手軽に自動で目次を作るプラグインEasy Table of Contentsを導入したので紹介したいと思います。 ブログに目次は必要か? 読 …