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に書いたようなネタの有償対応のご相談は「ゆうそうと」へいただければと思います(^^)/
無償での対応をご希望の場合は、コメントをいただけましたら可能な場合はコメントを返させていただきます。

シェアする

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

フォローする

スポンサーリンク
ゆうそうとITブログはMIXHOSTで運営中
スポンサー広告
ブログをメールで購読

メールアドレスを記入して購読すれば、更新をメールで受信できます。

280人の購読者に加わりましょう

トップへ戻る

ゆうそうとについての説明

ゆうそうと とは東京都八王子市を中心として、WordPressによるWEBサイトの作成や、スポットでのIT相談を行ったり、年間契約でのIT顧問をなりわいとして活動しています。

特徴としては30年以上IT業界でプログラムを中心として仕事をしてきたものと、美大出身のデザイナーがワンストップで対応するため、幅広い対応が可能であることです。

IT相談は直接お会いしてのご相談の他、ZOOMによるオンライン相談も可能です。