WordPress最適化

WordPressのサイドバーにTwitterを埋め込む方法

パソコンとTwitterの画像

 

ひしはり
ひしはり
WordPressのサイドバーに
Twitterを埋め込むにはどうしたらいいの?

本記事では
このような疑問にお答えします。

 

本記事の内容

❶ WordPressのサイドバーにTwitterを埋め込む方法

❷ 「Twitterボタン」の設置方法

❸ ブログ運営に欠かせない「SNS」との連携

 

ブログでの収益化を目的とした
多くの方が「WordPress」を使って
自分のブログを運営されています。

ブログで収益化する上で
欠かせないのが
「SNS」との連携です。

本記事を読めば、
そんな「SNS」の代表格である
「Twitter」
「WordPress」ブログのサイドバーに
埋め込む方法がわかります。

わかりやすく画像付きで
解説していますので、
ぜひ、あなたのブログにも
「Twitter」を埋め込んで
より多くの読者に
あなたの発信が届くように
連携させてくださいね。

 

この記事を書いている人

この記事を書いている私はブログ歴4年目

現在は本業のサラリーマンの傍ら副業ブロガーとして活動しています。

Twitter(ひしはり人生再構築ブロガー)のフォロワーは1800人ほど。

WordPressのサイドバーにTwitterを埋め込む方法

Twitter埋め込みの画像

 

「WordPress」のサイドバーに
「Twitter」を埋め込む方法は
とてもかんたんです。

「Twitter」を埋め込むための
「コード」をコピーして
それを「WordPress」
サイドバーウィジェットに
貼り付けるだけです。

 

WordPressのサイドバーにTwitterを埋め込む方法

① Twitterを埋め込むためのコードをコピー

② WordPressのサイドバーウィジェットにそのコードを貼り付け

 

ひしはり
ひしはり
画像付きでわかりやすく
ご紹介しますので安心してくださいね。

 

それではさっそく始めて行きましょう。

① Twitterの埋め込み「コード」を取得

 

まず、「WordPress」のサイドバーに
「Twitter」を埋め込むためには
「Twitter」のアカウントが必要です。

まだアカウントをお持ちでない方は、
まずは、以下の記事を参考に
アカウント作成をどうぞ!

 

Twitterのマークの画像
初心者必見!Twitterを始めるためのアカウント登録方法Twitterを始めるためのアカウントの登録方法を知りたいですか?本記事ではTwitter初心者の方にもわかりやすくアカウントの登録方法を画像付きでご紹介しています。Twitterを始めるためのアカウントの登録方法を知りたい方はぜひ、記事をご覧ください!...

 

すでにアカウントをお持ちの方は、
最初に「WordPress」のサイドバーに
「Twitter」を埋め込むための
「コード」を取得する必要があります。

「コード」を取得するためには
まず「Twitter」にログインして
自分のページ(プロフィール)を
表示させます。

画面上部に「URL」
表示されていますので、
コピーしておきます。

 

Twitterの埋め込み画像

 

「URL」とは
「http://」「https://」
などから始まる文字列のことです。

サイトやブログを開いたときに
画面の上部に「鍵マーク」とともに
表示されていることが多いです。

「http://」「https://」
省略されて表示されていますので、
その部分をクリックすれば
「http://」「https://」形式で
表示されます。

次に以下の
「publish.twitter.com」のリンクから
「コード」を作成します。

 

 

アクセスすると
以下の画面に移動しますので
先ほどコピーしておいた
「URL」を貼り付けて
「→」をクリックします。

 

Twitterの埋め込み画面の画像

 

「表示オプション次のとおりです」
画面に移動しますので、
「埋め込まれたタイムライン」
選択してクリックします。

 

表示オプションの画像

 

次の画面に移動したら
「カスタマイズオプションを設定する」
クリックして表示設定を
カスタマイズして行きます。

 

カスタマイズオプションの設定の画像

 

ここではサイドバーに表示させる
「Twitter」の高さや横幅などの
大きさをお好みで設定できます。

「px数」を入力すると
すぐ下の「プレビュー」
大きさを確認できますので、
参考にしながら設定してください。

設定画面の画像

 

設定後は実際の大きさを
必ずサイドバーで
確認するようにしましょう。

参考までに私のブログでは、
高さ「400px」横幅「300px」
設定しています。

背景色はお好みで設定してください。

言語は「自動」でかまいません。

「Twitterの調整のオプトアウト」という
あまり意味のわからない
チェックボックスですが、
これは「Twitter」
おすすめユーザー欄に
表示するかどうかの設定ですので
表示したくない場合は
チェックを入れて下さい。

設定が終わったら
「更新」をクリックしてください。

クリックすると
先ほどの画面に戻って来ますので
「コードをコピーする」
クリックします。

 

カスタマイズオプションの設定の画像

 

これで「WordPress」のサイドバーに
「Twitter」を埋め込むための
「コード」を取得できましたので、
次は「WordPress」
この「コード」を貼り付けて行きます。

② WordPressに埋め込み「コード」を貼り付け

 

続いて取得した「コード」
「WordPress」
貼り付けて行きます。

「WordPress」
「ウィジェット」を使って
「コード」を貼り付けて行きますので、
まずは「WordPress」の管理画面から
「外観」「ウィジェット」の順に
クリックします。

 

Twitter埋め込みの設定の画像

 

続いて左側の
「利用できるウィジェット」の中から
「テキスト」をクリックして選びます。

 

Twitter埋め込みの設定の画像

 

するとプルダウン式の
メニューが開きますので、
その中から「サイドバーウィジェット」
選択して「ウィジェットを追加」
クリックします。

 

Twitter埋め込みの設定の画像

 

すると右側の
サイドバーの項目の場所に
新たに設定用の「テキスト」
ウィンドウが開きますので、
各種設定を行なっていきます。

まず「テキスト」「タイトル」は、
「Twitter」「ツイッター」
などと入力しましょう。

この「タイトル」が実際の
ブログ画面に表示さます。

 

Twitter埋め込みの設定の画像

 

次に「テキストモード」
切り替えてから
先ほどコピーした「コード」
貼り付けます。

ここで注意しなければならないのが、
「ビジュアルモード」のままで
気づかずに「コード」を貼り付けても
表示されませんので、
必ず「テキストモード」に切り替えてから
貼り付けるようにして下さい。

貼り付けが終わったら
「保存」をクリックします。

 

Twitter埋め込みの設定の画像

 

これで設定が完了となり
「Twitter」
「WordPress」のサイドバーに
埋め込んで表示させることができました。

設定が完了したら必ず
実際の画面でイメージどおりに
表示されているかを
確認するようにしましょう。

また今回ご紹介した
「Twitter」同様に
「Facebook」
「WordPress」
サイドバーに埋め込むことが可能です。

「Facebook」
埋め込みに関しても
こちらの記事でわかりやすく
画像付きでご紹介していますので、
まだの方は合わせてぜひ、どうぞ!

 

Facebook画面のパソコンの画像
WordPressのサイドバーにFacebookを埋め込む方法WordPressブログのサイドバーにFacebookを埋め込む方法を知りたいですか?本記事ではWordPressブログのサイドバーにFacebookを埋め込む方法を画像付きでわかりやすくご紹介しています。WordPressブログのサイドバーにFacebookを埋め込む方法を知りたい方はぜひ、記事をご覧ください!...

 

「Twitterボタン」の設置方法

Twitterの画像

 

次に「Twitterボタン」の設置方法も
ご紹介しておきますね。

「Twitterボタン」とは、
ブログ画面に表示させる
以下の部分です。

読者への行動を促す部分になりますので
必ず設置されることをおすすめします。

 

Twitter埋め込みの設定の画像

 

先ほどの
「表示オプションはこちら」の画面で
「Twitterのボタン」
クリックします。

Twitterボタンの画像

すると以下の画面が表示されます。

 

Twitterボタンの画像

 

設置できるボタンは2種類あって
それぞれ以下のようになります。

ここはお好みで選択してください。

 ・「フォローボタン」を選ぶと

Twitter埋め込みの設定の画像

 ・「メンションボタン」を選ぶと

Twitter埋め込みの設定の画像

「設置コード」取得から
「WordPress」への
貼り付けまでの流れは、
基本的に「Twitter」
埋め込み方法と同じです。

各設定はお好みでどうぞ!

 

Twitterボタンの設定画面の画像

 

「Twitterボタン」
「設置コード」
先ほど「Twitter」「コード」
貼り付けたテキスト内の
すぐ下の箇所に続けて貼り付けます。

ボタンの配置が
うまくセンターにならない場合は、
以下の文字列の赤文字の部分
「設置コード」を貼り付けて
テキスト内に貼り付けましょう。

そうすることでボタンの位置が
センターになります。

 

<div align=”center”>この部分に設置コード</div>

 

設置コードの画像

 

Twitter埋め込みの設定の画像

 

以上が「Twitter」
「WordPress」への埋め込みと
「Twitterボタン」
設置方法についての解説でした。

ブログ運営に欠かせない「SNS」との連携

ソーシャルネットワークの画像

 

サイトやブログ運営を
行なっていく上で、
「Facebook」「Twitter」
といった「SNS」との連携は
もはや欠かせない重要なものです。

「ブログ」「SNS」とを
連携させることによって
より効率よく集客が出来たり、
自分のサイトやブログの存在を
より多くの方に知ってもらえる
可能性が高まります。

新しいブログ記事をアップするたびに
「SNS」でブログを更新したことを
発信してフォロワーに告知することで
集客効果が期待できます。

中にはさらにその先の
フォロワーご自身のフォロワーに対して
拡散してもらえる可能性も期待できます。

そんな「SNS」の拡散力を
うまく活用して行きたいものですね。

実際の私のブログ画面では、
以下のような感じで表示させています。

 

Twitterの埋め込み画像

 

今回ご紹介したように
「WordPress」のサイドバーに
「Twitter」のタイムラインを
埋め込む方法は
とてもかんたんですので、
ぜひとも行なっておきましょう。

まとめ

 

今日は「WordPress」のサイドバーに
「Twitter」を埋め込む方法と
「Twitterボタン」の設置方法について
ご紹介しました。

サイドバーの有効活用は、
アクセスアップや集客に
大きく影響する要素です。

特にSNSとの連携は、
強力な相乗効果を
生み出せる可能性があります。

最適なブログ構築のために
ブログを立ち上げたら
早い段階でしっかりと
サイドバーを充実させて行くことを
意識して行きましょう。

SNSとの連携を最大限に活かしたいと
必死に張り切る ひしはり でした。
今日は、ここまで。

関連記事