2011年12月11日

FC2ブログの個別記事にfacebookコメント投稿フォームを設置(2)

Category : 2011 Diary, FC2 Blog, SNS

以前の記事で、FC2ブログの個別記事に設置したfacebookコメント投稿フォームですが、
記述、設置場所が間違えてしまっていたようなので訂正しました。
しかし、その間にコメントしてもらったものは、
行き場所がなくて表示されなくなった為、
対応策として画像ファイルにキャプチャしてコメントだけは残すようにしました。


問題点は、表示コードに記入した

独自タグ<%topentry_link>は、
<!--topentry--> ~ <!--/topentry-->
(エントリーを繰り返し表示させるブロック)
というブロック変数の中でしか有効にならない。

という事でした。
個別記事ページに使用した<%topentry_link>は、
それぞれの個別記事の識別が出来ず、結局、
FC2ブログのルートアドレスにfacebookコメントが付けられた状態になってしまい、
どの個別ページを開いても同じコメントが表示されるという状況になっていました。


という事で、解決策は、

<!--permanent_area--> ~ <!--/permanent_area-->
(固定リンク画面(blog-entry-x.html)で表示されるブロック(フラグ)どの場所でも有効)
という変数を、<!--topentry--> ~ <!--/topentry-->のブロック変数中に
設置し、そこにfacebookコメント投稿フォームを設置する。

ようにしました。

以下のようなテンプレート構成と言うとわかりやすいかな?

<!--topentry-->

エントリー記事

<!--permanent_area-->
facebookコメント投稿フォーム
<!--/permanent_area-->

<!--/topentry-->

これによって個別ページのみにfacebookコメント投稿フォームが表示されるようになりました。
FC2ブログにfacebookコメント投稿フォームを設置されているサイトは時々見かけますが、
設置や表示がうまくいっていない方には参考になるかと思います。

参考: FC2ブログテンプレート用変数一覧


2011年10月 2日

FC2ブログの個別記事にfacebookコメント投稿フォームを設置

Category : 2011 Diary, FC2 Blog, SNS

Fc2ブログの個別記事ページに、facebookのコメントフォームを設置しました。

参考にしたサイトは以下です。

これまたFacebookのソーシャルプラグイン機能で、コメント投稿フォーム(Comments Box/コメントボックス)があります。先ほど当サイトでも設置しましたが、ものの5分で設置できました。


続きの部分に設置コードの取得の仕方を忘備録として載せています。
上記エントリーより、html5、XFBMLというコードの選択肢が増えているようです。


FC2ブログを使った私の写真ブログ
Pleasure Fruits EN


追記: 2011年12月11日
個別記事に表示するには、設置場所が重要ですので、
当サイトの、
FC2ブログの個別記事にfacebookコメント投稿フォームを設置(2)
を必ず参考にして下さい。



FC2ブログの個別記事にfacebookのLike(いいね)ボタンを再設置

Category : 2011 Diary, FC2 Blog, SNS

FC2ブログの個別記事ページにfacebookのLike(いいね)ボタンを設置していたのですが、
うまく機能していなかったので再設置しました。

私のブログでこのボタンを使う人は、ほとんどいないと思いますが、
うまく動いていないと気になるものです。


実は、FC2ブログにはLike(いいね)ボタンを表示する機能が
デフォルトでついているのですが、この場合、
Indexページの記事毎にボタンが現れるので、
デザイン的には、大変見苦しくなります。

という事で、コメントをする為の個別ページにLike(いいね)ボタンをつけていましたが、
いつの間にかそれぞれのエントリーではなくブログ全体のLike(いいね)ボタン
になっていました。
といううのは、エントリーURLを表示を表示する<%topentry_link>という変数は、FC2ブログでは
<!--topentry--> ~ <!--/topentry-->
というエントリーを繰り返し表示させるブロック内で有効になる変数らしいのです。
という事で、個別記事の部分に<%topentry_link>を使っていた為、
うまく機能していないと判断しました。


いろいろ検索してトライをした結果、以下のリンク先を参考にLike(いいね)ボタンを
再設置することが出来ました。

「いいね(like)ボタン」とセットで「送信(send)ボタン」を表示するには条件があります。それは、「いいね(like)ボタン」の設置方法にはiframeを使う場合とXFBMLを使う場合の2通りがありますが、XFBMLで設置する必要があります。 XFBMLで設置するメリットとしては、 顔写真の表示有無によって高さを自動調整してくれる 記事毎にいいねを押せるようになる があるようです。一方、表示が少し遅くなるというデメリットを感じました


長くなるので、続きの部分に具体的なやり方を記録しておきます。


FC2ブログを使った私の写真ブログ
Pleasure Fruits EN


追記: 2011年12月11日
個別記事に表示するには、設置場所が重要ですので、
当サイトの、
FC2ブログの個別記事にfacebookコメント投稿フォームを設置(2)
を必ず参考にして下さい。



2011年10月 1日

FC2ブログにMETAタグを追加

Category : 2011 Diary, FC2 Blog

MTにMETAタグを追加したエントリーに続き、
写真ブログとして使っているFC2ブログにもMETAタグを追加しました。

<head>~</head>の部分に
変更と追加したタグは以下の通り。

Titleタグ:
<title><%sub_title> <%blog_name></title>
を池のように変更。

<title>
<!--index_area--><%blog_name>|<%introduction><!--/index_area-->
<!--titlelist_area-->Site map of <%blog_name><!--/titlelist_area-->
<!--permanent_area--><%sub_title>|<%blog_name><!--/permanent_area-->
<!--category_area-->Category : <%sub_title>|<%blog_name><!--/category_area-->
<!--tag_area-->Tag : <%sub_title>|<%blog_name><!--/tag_area-->
<!--titlelist_area--><%sub_title>|<%blog_name><!--/titlelist_area-->
<!--date_area--><%sub_title>|<%blog_name><!--/date_area-->
</title>

Meta Descriptionタグ、Meta Keywordsタグ:
以下のタグを追加

<!--permanent_area-->
<!--topentry-->
<meta name="description" content="<%topentry_discription>" />
<meta name="keywords" content="<!--tag_list--><%topentry_tag_list_name>,<!--/tag_list--><%topentry_category>" />
<!--/topentry-->
<!--/permanent_area-->
<!--date_area-->
<meta name="description" content="<%sub_title>│<%blog_name>" />
<!--/date_area-->
<!--category_area-->
<meta name="description" content="Category : <%sub_title>│<%blog_name>" />
<!--/category_area-->
<!--search_area-->
<meta name="description" content="Search result : <%blog_name>│<%blog_name>" />
<!--/search_area-->

参考にしたサイト、エントリーは以下の通り。
知っておきたいSEOを意識したFC2ブログの簡単設定|Webpark
SEOを意識したFC2ブログの設定をいくつか紹介します。実際このブログでも使っているものがほとんどですが、SEOのプロではないので効果は保証できません。けど、基本的なものなので大丈夫なはず。
なお今回は個別記事のSEOを意識したもの中心に、head内の設定を紹介します。

FC2ブログでページによってmetaタグの「description」を切り替える方法│自由人万歳ν(ニュー)タイプ
今回はFC2ブログでmetaタグの「description」の内容を、ページによって切り替える方法を説明。

これでFC2ブログの方も、facebookやGoogle+への引用時には
少しわかりやすくなったと思います。
また、Title部分も表現も変更したので、
SEO対策も少し向上したのかと思います。


FC2ブログを使った私の写真ブログ
Pleasure Fruits EN


1