WordPressの設定 その2 SNSとの連携

WordPressの設定 その2 SNSとの連携

公開日: : 最終更新日:2013/11/02 WordPress設定


WordPressの設定 その2

その2は、SNSとの連携について・・・

くまはちの覚書です。

ちょっと長文になります。この設定無理かもって思う方は、有料で設定代行します。

likebox2

例えば、facebookのLikeBoxやTwitterのウィジェット・Google+のウィジェットなど・・・

また、facebookは、OGPの設定なども・・・

これらは、まずプラグインを使います。

FacebookのLikeBoxから・・・

Guerrilla’s Facebook Like Box Widgetを使用しています。

プラグイン→新規追加→Guerrilla’s Facebook Like Box Widgetを検索

すると一覧に出てくるので「今すぐインストール」をクリック

数秒後にインストールされています。「有効化」をクリックします。

widget01

左のメニュー「外観」の中に「ウィジェット」が入っています。そこをクリックします。

widget02

するとこの画面になります。

widget03

赤枠の部分がさっきインストールして有効化したウィジェットですよ。

widget04

横にあるメインサイドバーにドラッグします。(あっこれWindowsの方ね。)

ドラッグとは、クリックしたままスライドさせることですよ。

widget05

画像の通り入力したら、保存をクリックして完了です。

どうですか?

くまはちと同じようにFacebookのLikeBoxが表示されていますか?

次にOGPの設定をします。

最初に準備からですよ。

https://developers.facebook.com/

上のアドレスにアクセスします。

dev_ogp01

するとこんな画面が出ます。赤丸の部分ウェブをクリックします。

dev_ogp02

するとこんな画面に・・・えー全部英語やん・・・

赤丸の「OpenGraph」をクリックします。

dev_ogp03

するとこんな画面に・・・赤丸の「Get Started」をクリックします。

dev_ogp04

この画面が出てきておっ日本語で読めるラッキー・・・

赤丸の「日本語」をクリック

dev_ogp05

やった・・・これで普通に読める・・・少しスクロールします。

dev_ogp06

赤丸部分の「アプリダッシュボード」をクリックします。

dev_ogp07

ここで「新しいアプリを作成」ボタンをクリック

dev_ogp08

するとこんな画面が出てきます。アプリ名「OGP」空間名「kumaogp」で作成

dev_ogp09

これで「続行」をクリックします。

dev_ogp10

するとセキュリティチェックが・・・これも入力して終わらせます。

dev_ogp11

するとこんな画面が出てきます。

ここで上の赤枠部分のApp ID:と数字をメモします。

メモ帳にコピペしてもいいですね。

次に自分のfacebookのタイムラインを開きます。

どれでもいいので写真をクリックしてください。

dev_ogp12

その時に表示されるアドレスバーのURLの一部が必要・・・

赤枠で囲んだ部分の数字があなたのfacebookでのIDになります。

これもメモします。

これでWordPressに戻ります。

プラグインをインストールします。

使用するのは、「Open Graph Pro」です。

先ほどの要領でインストールして有効化します。

dev_ogp13

するとそのまま設定画面が・・・ならない場合は、左メニューの設定の中に「Open Graph Pro」があるのでそこをクリックしてください。

Object Typeは、Blogのままで

Admin user IDは、写真を開いて調べたURLの一部を入力

Application IDは、OGPを作成したときのAPP IDを入力します。

どちらも数字のみですよ。

dev_ogp14

ここまで来たら「変更を保存」クリックしてOGPの設定終わりですね。

どうですか?くまはちと同じようにできていますか?

次にTwitterGoogle+のウィジェットを追加します。

新たなプラグインを使わずシンプルにサクっと終わらせましょう。

左メニューの「外観」の中にある「ウィジェット」を開きます。

dev_ogp15

Likeboxの時と同じように右のメインサイドバーにドラッグします。

dev_ogp16

ドラッグしてタイトルとテキストボックスに入力します。

テキストボックスに入れるソースを作成します。

まずは、TwitterからしますのでTwitterを開きます。

くまはちの例に沿って進めてくださいね。

tw_widget01

開くと赤丸の歯車のマークをクリックします。

tw_widget02

すると上の画像のように出ますので「設定」をクリック

tw_widget03

画面の左側に上の画像のように出てくるので「ウィジェット」をクリック

widget06

上の画面になります。

赤枠のテキストボックスにソースが表示されますのでWordPressのウィジェットにコピーペーストします。Likeboxもソースからここに入れても問題ないです。

どうですか?くまはちと同じようにTwitterのウィジェット表示されていますか?

次にGoogle+のウィジェットを作成します。

まず、自分をフォローしてもらうウィジェットは、下記にアクセスします。

Google+ Widgets
http://widgetsplus.com/

g_widget01

赤枠の中のボタンをクリックします。

g_widget02

この画面になります。赤枠の部分にGoogle+でのIDを入れます。

必ず自分のIDを入れてくださいね。同じようになるとくまはちしか出てきませんよ。

g_widget04

Google+でプロフィールを開いた時のアドレスの一部がIDになります。

g_widget03

するとコードが表示されます。

このコードを先ほど貼り付けたTwitterのソースの下に貼り付けます。

どうですか?くまはちと同じようにあなたのGoogle+のADD MEが表示されていますか?

次にGoogle+ページのバッジのウィジェットのソースを作成します。

下記のサイトにアクセスします。

Google+ Badge
https://developers.google.com/+/web/badge/

g_widget05

Google+ページ作成していると選択できるようになっています。

個人ページも作成できます。

Google+にログインした状態でアクセスしてくださいね。

g_widget06

上の画像にあるようにソースをコピペします。

どうですか?

くまはちと同じように表示できていますか?

かなり長文でしたが、facebookTwitterGoogle+の連携設定の覚書でした。

 


  • このエントリーをはてなブックマークに追加
  •    
  • 0
    follow us in feedly

関連記事

くまはち

WordPress プラグインAll In One SEO Pack 続編

Facebook講師とブログ開設サポート しているくまはちです! Facebookページ

記事を読む

投稿一覧

ブログ記事が増えてきたら目次が必要

  本業に活かせるFacebook講師とブログ開設サポート しているくまはちで

記事を読む

アメブロ

ブログのアクセスアップ とその前に・・・

Facebook講師とブログ開設サポート しているくまはちです! Facebookページ

記事を読む

WP Social Bookmark Light

WordPress WP Social Bookmark Light

  本業に活かせるFacebook講師とブログ開設サポート しているくまはちで

記事を読む

no image

WordPress設定のはじまり・・・

WordPressの設定 まずはじめにアクセスするのは、こちらの画面ですね。 イ

記事を読む

STINGER3

WordPress STINGER3の修正した方がいい7つのポイント

  本業に活かせるFacebook講師とブログ開設サポート しているくまはちで

記事を読む

STINGER3

WordPressのテーマ STINGER3

  本業に活かせるFacebook講師とブログ開設サポート しているくまはちで

記事を読む

アメブロランキング

ブログランキング活用 検証してみました

くまはちです! SEO対策というよりは、 アクセスの集め方の方が ハマってる感じで

記事を読む

wordpress

WordPress プラグインAll In One SEO Pack

Facebook講師とブログ開設サポート しているくまはちです! Facebookページ

記事を読む

wordpress

WordPress プラグインって何?

Facebook講師とブログ開設サポート しているくまはちです! Facebookページ

記事を読む

仕事に活かすためのブログシェア
予約投稿でソーシャルメディアに投稿する

    本業に活かせるFacebook

Facebook
SNSやブログを仕事に活かすための個別レッスン

本業に活かせるFacebook講師とブログ開設サポート して

アメブロ
くまはちが制作したアメブロは、アクセスが増えます!

くまはちが制作したアメブロは、アクセスが増えます! くま

ダイエットして身も心も美しく歳を重ねるために・・・
アメブロから集客できるには、理由があるんです!

アメブロで集客できます。 よく聞く言葉ですよね。

くまはち
繰り返し投稿すると・・・

  本業に活かせるFacebook講師とブログ開設サポート

→もっと見る

  • メルマガ登録

    E-Mail

    Name

    powered byメール配信CGI acmailer
     
  • Instagram
     

     

     
    Pinterest
     
    pixiv
     
  • 2017年6月
    « 6月    
     1234
    567891011
    12131415161718
    19202122232425
    2627282930  
PAGE TOP ↑