WordPressサイトにFacebook、Twitterへのボタンとタイムラインを表示する

Webサイトを作ったとき、blogやWebサイトを多くの人に見てほしいので各種SNSへのリンクを付けたり、タイムラインを表示したいと思います。
今回はテーマSimplicityとJetpackを使って簡単にWebサイトにリンクボタンとタイムラインの表示方法について書きます。

FacebookページとTwitterへのリンクボタンを付ける

Webサイトを作ったらまずFacebookページを作って、Twitterアカウントも作るといいと思います。

Facebookページの作り方については、

新しい個人事業を始めました「ゆうそうと」といいます。この事業を始めるに当たり、大急ぎでWebサイトを作ったのですが、まだFacebookページは作っていませんでした。 せっかく

こちらを参考にしてください。

今回は新しく作った ゆうそうと というWebサイトに付けたいと思います。作業をする前は、

このように Feedly と RSS のボタンが表示されています。

ここに、FacebookとTwitterのボタンを表示します。

ダッシュボード 外観>カスタマイズ をクリック

SNS をクリック

Twitterの

この部分にある @マーク以下の文字を入力します

Facebookは

このようにurlの最後の部分の文字を入力します。

保存して公開
 をクリックして、表画面を見ると、

このようにFacebookページとTwitterへのリンクボタンがつきました(^^)/

FacebookとTwitter のタイムラインをサイドバーに表示する

次にFacebookとTwitter のタイムラインをサイドバーに追加したいと思います。プラグインのJetpackのウィジェットを使います。

Facebookのタイムラインを指定する

ダッシュボード 外観>ウィジェット をクリック

Facebook ページプラグイン(Jetpack) をクリック、

サイドバーウィジェット をクリックして、ウィジェットを追加 をクリックします

入力画面が開くので、このように入力し 保存 をクリック。

すると、サイドバーに

このようにFacebookページのタイムラインが表示されました。

Twitterのタイムラインを指定する

Twitter タイムライン(Jetpack) をクリック、

サイドバーウィジェット をクリックして、ウィジェットを追加 をクリックします

このような画面が表示されます。Twitter.comでウィジェットを作成 をクリック

Twitter.comでウィジェットを作る画面になります。ウィジェットを作成 をクリック

すると、埋め込む というテキストエリアにコードが表示されるのでコピーします

このコードの中の data-widget-id= のあとにダブルコーテーションで囲まれた数字があります。これをコピーして、

ウィジェット ID という欄にペーストします。そして、保存 をクリック。

表画面を見てみると、

Twitterのタイムラインが表示されました(^^)/

兎本美佳
ブログを見た人がそのままできたらいいなと思って、できるだけ丁寧に書いています。blogに書いたようなネタの有償対応のご相談は「ゆうそうと」へいただければと思います(^^)/ 無償での対応をご希望の場合は、コメントをいただけましたら可能な場合はコメントを返させていただきます。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
スポンサー広告
トップへ戻る