12 7月wordpressの各記事にFacebookのコメント欄を設置挿入する覚えがき。

 

yahoonewsをはじめ、最近いろいろなサイトを見ると、記事の下のコメント欄にFacebookのコメント欄を引っ付けているサイトを多く見るようになりました。

↑こんな奴です。

ワードプレスなどのblogシステムにはもともとコメントシステムがありますが、時代の流れは自前のコメントシステムではなくFacebookやTwitterの「ソーシャルプラグイン」と呼ばれるこういったプラグインをつける方向です。

「ソーシャルプラグイン」をつけることにはどんなメリットがあるのでしょうか?

一番に考えられるのは、「広がり」です。
Facebookのソーシャルプラグインのコメント欄にされたコメントは、そのブログの記事内に表示される他、コメントした本人と友達のFacebookのニュースフィードにblog記事のリンクと共に表示されます。

あとはSNSの特徴通り、いいねやシェアを繰り返し記事のリンクが拡散されて行きます。
と言うことで、Facebookのコメント欄をワードプレスの各記事毎に設置する方法です。
まずは下のリンクから「Facebookソーシャルプラグイン」のページに行きます。
http://developers.facebook.com/docs/plugins/

ここで赤枠のコメントをクリック

 

 

 

下の画面が表示されたら「width」でコメント欄の左右のサイズを調整します。


「http://example.com」は後ほどwordpressのタグを挿入するのでそのままでOKです。

 

最後に「Get Code」ボタンをポチッとな!
※初めて「ソーシャルプラグイン」を使う場合はFacebookのアプリケーションIDが必要です。
アプリケーションIDの取得方法は下の「iFrame版 Facebookページ作成方法(最新版 仕様変更対応)」をご覧ください。
ワードプレスに挿入されるコードが表示されました。
プラグインのコードには「HTML5」「XFBML」のどちらかが使用できます。
今回は簡単なHTML5で設置します。

 

※HTML5はIE9以上・googlechrome・Firefoxなど対応ブラウザ出なければ表示されません。

まずは指示通り、上のテキストエリアのソースを<body>タグのすぐ後ろに挿入します。
ワードプレスのテーマの場合、多くのテーマでは「header.php」内を探してください。

次に「プラグインを表示したい場所にプラグインのコードを配置します」のコードをコピペします。

ここでみそですが、図の赤枠部分に記事のURLを取得するコード

<?php the_permalink(); ?>

を挿入します。
後はコメントを埋め込みたい部分にソースをペーストして終了です。

一般的にはindex.phpやpage.phpのワードプレスのデフォルトコメント欄の

<?php comment_form(); ?>

を探して差し替えるのが簡単でしょうか。

これで普通のワードプレスもソーシャルブログに早変わりです。

 

 

 

16 2月ワードプレスの不要コメントを一括削除するプラグイン

超便利なplug-inがあったので覚えがき

ワードプレスをしばらくほったらかしていると、spamコメントや未承認コメントが山のようにたまることがある。

一括削除する場合、phpmyadminのデータを消すなどしていたが、ちょっとだけリスクが高い

こんな時はこの「WP-Optimize」プラグインで不要なコメントを一括削除が可能!

使い方は簡単 英語プラグインなのがちょっとだけ残念だが 下の様なメニューが出るので、不要なコメントのチェックを入れて「PROCESS」ボタンを押すだけ

Remove all Post revisions

No post revisions found

Remove all auto draft posts(自動保存された下書きを削除)

1 auto draft post(s) in your database

Clean marked Spam comments(スパムコメントを削除)

No spam comments found

Clean Unapproved comments(未承認コメントを削除)

No unapproved comments found

Optimize database tables(データベースの最適化)

※使用は自己責任で行ってください。当サイトは「WP-Optimize」に関しての一切の責任は負いません

30 8月iFrame版 Facebookページ作成方法(最新版 仕様変更対応)

iframeアプリを作るためのデベロッパーページの仕様が変更されたようなので、最新版を解説。

Facebookページの作り方。 その3
でも書いたが、Facebookページを簡単に作成する方法として、FacebookアプリのiFrameを利用した方法が一般的である。

この方法を使うには、Facebookとは別にコンテンツを設置するためのサーバーが必要となるが、その分できることの自由度も増す。

以前FacebookiFrameアプリの作り方を紹介したが、いつの間にか仕様が変更されているようなので改めて解説しよう。

手順1.サーバーの準備
Facebookアプリで表示するコンテンツを、自分で用意したサーバー上に用意する。
今回は当ページで配布している「Facebook様wordpressテーマ」を利用したワードプレスをFacebookページ上に表示できるよう設定してゆく。

手順2.Facebookのデベロッパーページにて開発者登録を行う。

【開発者登録ページ】

https://www.facebook.com/developers/

手順3.アプリの登録

上のURLにaccessして開発者ページにログイン後、右上の「create New App」ボタンをクリック。

「NEW APP」のダイアログボックスが表示されるので

App name に任意のアプリの名前
local に「日本語」を選択
利用規約を読んだ上でチェックボックスにチェックを入れて「続行」ボタンをクリック

セキュリティー認証のダイアログボックスが表示されるので、表示されている文字を入力して「送信」ボタンをクリック

上の画面が表示されるのを確認してください。

「Select how your app integrates with Facebook」のなかの

「App on Facebook」と「Page Tab」に必要な項目を入力します
※「Website」「Mobile and Devices」は今回は使いません。
開いてしまった場合は右上の「×」マークで削除してください。

■「App on Facebook」の入力

Canvas URL: には自分のサーバーのWPをインストールしたURLを入力

Secure Canvas URL: SSL対応ページがある場合はSSL対応ページのURLをココに入力

入力例)

Canvas URL: http://ftown.pupu.jp/wp/

Secure Canvas URL: https://pupu-ftown.ssl-lolipop.jp/wp/

今回はロリポップの共有SSLを使ってSSLページを用意しています。SSLページがない場合は空白でOK

■「Page Tab」の入力

Page Tab Name:Facebookページの左メニューに表示されるタブ名を入力(任意の名前

Page Tab URL: タブがクリックされた場合iFrame内に表示されるページのURLを入力

Secure Page Tab URL:タブがクリックされた場合iFrame内に表示されるページのURLを入力(SSLページがある場合のみ)

Page Tab Edit URL:空白

設定例)

Page Tab URL:http://ftown.pupu.jp/wp/index.php

Secure Page Tab URL:https://pupu-ftown.ssl-lolipop.jp/wp/index.php

Page Tab Edit URL:空白

上記を入力後「保存」ボタンをクリックして設定を保存してください。

手順4.設定したアプリをFacebookページに関連つける

1.下記左メニューの「View App Profile Page」をクリックして設定したアプリを表示

2.画像赤枠の「自分のFacebookページのお気に入りに追加」をクリックして自分のFacebookページを表示して追加ボタンをクリック

残りは「Facebookページの作り方。 その3」を参照

これでFacebookページのいっちょあがりです

21 4月予定に基づいたメンテナンスを行っているためしばらくの間ご利用できません。少し間をおいて再度確認してください の時の対処法

wordpressで作業中「予定に基づいたメンテナンスを行っているためしばらくの間ご利用できません。少し間をおいて再度確認してください」と

表示されたまま直らなくなった場合、FTPで接続して、 .maintenance と言うファイルを削除!

20 4月記事のタイトル、記事内容、タグから関連した記事のリンクを記事の下部に自動的に表示してくれるプラグイン

Yet Another Related Posts Plugin

記事のタイトル、記事内容、タグから関連した記事のリンクを記事の下部に自動的に表示してくれるプラグイン。

○○の記事 その1、~~その2と言った投稿がある場合、関連記事のタイトルのリンクを自動設置してくれるので非常に便利

10 3月フェイスブックのシェアボタンをワードプレスの各記事に自動挿入

SexyBookmarks

フェイスブックのシェアボタンをワードプレスの各記事に自動挿入できる。

また、フェイスブック以外のソーシャルサイトにも選択するだけでシェアボタンの追加が可能

10 3月ワードプレスに簡単にフェイスブックのいいねボタンを設置

WordPress Facebook Like Plugin

インストールするだけで、WORDPRESSの各記事に自動的にいいねボタンを挿入できる