> Google+ | カスタマイズ | コメント | テンプレート >
Blogger ブログに従来のコメント欄と Google+ のコメント欄の両方を表示する方法
(cc) THOR
2013 年 4 月に、Blogger ブログに、通常のコメント欄と入れ替える形で Google+ のコメント欄が設置できるようになりました(参考)。複数のブログについたコメントや他人のブログにつけたコメントが Google+ で一元的に閲覧できるので非常に便利なんですが、その一方で通常のコメント欄と比べ不便なところもいくつか指摘されています。
ということで、従来のコメント欄も Google+ のコメント欄も両方ブログに載せてしまおうと思ったわけです。参考にしたのはこちらのブログ。
導入してみた様子が、次の画像です。

導入方法
1.Blogger の管理画面「Google+」から「このブログで Google+ のコメントを使う」のチェックを外します。元々 Blogger ブログを Google+ プロフィールと関連付けていない人は、そのままで。
2.Blogger 管理画面「テンプレート > HTML の編集」から
というコードを見つけます。「Ctrl + f」キーからエディタの検索機能を使うと便利です。
3.2のコードのすぐ後に
というコードを挿入して「テンプレートを保存」ボタンを押します。赤字部分は Google+ コメント欄の最大幅です。通常のコメント欄の幅に合わせて調整するのがいいと思います。
青字の部分は、Google+ コメント欄の上部に表示されるメッセージで、自由に書き換えることができます。閲覧者がどちらにコメントすればいいのか迷わないように、何か説明を書いてもいいかもしれませんね。
なお、
ということで、「Google+ のコメント欄を置きたいけど、前についたコメントも表示しときたいんだよな…」という人も、「Blogger アカウントと Google+ アカウントをまだ関連付けていないんだけど…」という人も、ぜひお試しください。
ちなみに
テンプレートによっては、Blogger のコメント欄が 425px 幅で固定になっているものがあります。これは、Blogger 公式の外部 CSS ファイルで指定されているもので、Blogger 管理画面「テンプレート > HTML の編集」から、テンプレートの CSS 部分
のすぐ後にでも、
と挿入することで、テキストエリアの幅の上書きが可能です。Google+ のコメント欄と幅を合わせたいというときに思い出してください。
スポンサードリンク:
お願い:

2013 年 4 月に、Blogger ブログに、通常のコメント欄と入れ替える形で Google+ のコメント欄が設置できるようになりました(参考)。複数のブログについたコメントや他人のブログにつけたコメントが Google+ で一元的に閲覧できるので非常に便利なんですが、その一方で通常のコメント欄と比べ不便なところもいくつか指摘されています。
- Google+ ユーザーしかコメントできない。
通常のコメント欄なら Google ユーザー、OpenID ユーザーに加え、「匿名」も選べます。 - 公開範囲が分かりにくい。
Google+ のサークルが適用されるため、誰にどのコメントが見えているのか把握しにくいかと。 - ブログのドメインを変えられない。
Google+ 上でのコメントは、リンクの URL で Blogger ブログと関連付けられているため、ドメインを変更してしまうと、ブログから以前のコメントが見れなくなってしまいます。 - 記事ごとのコメント表示・非表示、新規受け付けの可否設定ができない。
Blogger の投稿エディタのオプション指定が効きません。 - コメントの「オーナー承認後公開」ができない。
ブログにコメントがつくというより、Google+ での言及をブログに表示できる、というのが本質なので、しょうがないといえばしょうがないんですが。 - ブログについたコメント一覧が確認できない。
通常のコメントだと、ダッシュボードやコメントフィードで確認できますね。
ということで、従来のコメント欄も Google+ のコメント欄も両方ブログに載せてしまおうと思ったわけです。参考にしたのはこちらのブログ。
導入してみた様子が、次の画像です。

導入方法
1.Blogger の管理画面「Google+」から「このブログで Google+ のコメントを使う」のチェックを外します。元々 Blogger ブログを Google+ プロフィールと関連付けていない人は、そのままで。
2.Blogger 管理画面「テンプレート > HTML の編集」から
<div id='backlinks-container'>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
というコードを見つけます。「Ctrl + f」キーからエディタの検索機能を使うと便利です。
3.2のコードのすぐ後に
<div id='g-comments-container'>
<h4 id='g-comments-label'>Comments on Google+:</h4>
<div class='g-comments' data-first_party_property='BLOGGER' data-view_type='FILTERED_POSTMOD' data-width='600' expr:data-href='data:blog.canonicalUrl'/>
</div>
<h4 id='g-comments-label'>Comments on Google+:</h4>
<div class='g-comments' data-first_party_property='BLOGGER' data-view_type='FILTERED_POSTMOD' data-width='600' expr:data-href='data:blog.canonicalUrl'/>
</div>
というコードを挿入して「テンプレートを保存」ボタンを押します。赤字部分は Google+ コメント欄の最大幅です。通常のコメント欄の幅に合わせて調整するのがいいと思います。
青字の部分は、Google+ コメント欄の上部に表示されるメッセージで、自由に書き換えることができます。閲覧者がどちらにコメントすればいいのか迷わないように、何か説明を書いてもいいかもしれませんね。
なお、
<div id='backlinks-container'>
は 2 箇所あるので、両方のコードの後に同じコードを貼り付けてください。ということで、「Google+ のコメント欄を置きたいけど、前についたコメントも表示しときたいんだよな…」という人も、「Blogger アカウントと Google+ アカウントをまだ関連付けていないんだけど…」という人も、ぜひお試しください。
ちなみに
テンプレートによっては、Blogger のコメント欄が 425px 幅で固定になっているものがあります。これは、Blogger 公式の外部 CSS ファイルで指定されているもので、Blogger 管理画面「テンプレート > HTML の編集」から、テンプレートの CSS 部分
/* Comments
----------------------------------------------- */
----------------------------------------------- */
のすぐ後にでも、
.comment-form{max-width:600px;}
と挿入することで、テキストエリアの幅の上書きが可能です。Google+ のコメント欄と幅を合わせたいというときに思い出してください。
スポンサードリンク:
「この記事役に立った!」と思ったら、ぜひフィード登録をお願いします。 

クリボウさん、こんにちは。
ReplyDeleteさっそく使わせていただきました。
それでなんですが…従来のコメント欄にコメントがある場合に、設置したGoogle+コメントが消えてしまいました。ぼくのテンプレートの問題なのかもしれませんが、原因がつかめずにいます。
お手数かと思いますが、なにか解決のヒントをばいただけたらと思います。
2 箇所ある backlinks-container のコード、両方の後に、手順 3 で示したコードを入れないといけないみたいですね。記事本文で「最初の方です」としていたのを「両方」に改めました。コメントありがとうございます。
Deleteクリボウさん、ありがとうございます!
Deleteクリボウさん、いつも参考にさせていただいております。
ReplyDelete今回、私のブログで、G+コメントを表示するように変更しましたが、コメント行が固定されていて、コメント数が多いと下のコメント部分が表示されない状況が出ております。マウスでも矢印キーでも、表示できないため、何か良い方法がないか探しておりまーす。
1guoguo1019
ReplyDeleteburberry outlet
ralph lauren outlet
celine handbags
Hollister uk
coach outlet
michale kors outlet online
louis vuitton handbags
ralph lauren
coach outlet
louis vuitton
kobe shoes
michael kors handbags
Mont Blanc
michael kors outlet online
Canada Goose Outlet Online
coach factory outlet
jordan 13
hollister clothing
ugg boots
hermes birkin
oakley sunglasses wholesale
michael kors handbags
jordan shoes
louis vuitton handbags
ugg boots wholesale
michael kors outlet
ugg boots
canada goose jackets
michael kors outlet online
nike trainers
canada goose jackets
michael kors
ugg boots
nike air max
nike outlet,nike shoes,nike store,nike air max,nike free run,air max,nike free,nike blazers
Google+のコメント欄、デザインもシンプルで良いのに、Googleアカウントを持っていないと使用できないというのはとても残念ですね。。。
ReplyDelete2016-03-05keyun
ReplyDeletemichael kors
coach factory outlet
jordan 11
gucci handbags
beats by dr dre
nfl jerseys wholesale
louis vuitton
ray-ban sunglasses
oakley sunglasses
ray ban sunglasses
oakley sunglasses
ugg for cheap
canada goose outlet
pandora jewelry
the north face jackets
true religion jeans
ugg boots
discount jordans
cheap tods
michael kors outlet
coach outlet
vans sneakers
nfl jerseys
ugg outlet
oakley outlet
nike running shoes for men
ralph lauren home
ray-ban sunglasses
canada goose sale
ralph lauren sale
gucci handbgs
ugg outlet store
ralph lauren outlet
toms
nike air huarache
ugg outlet
true religion jeans
adidas originals store
north face jackets
jianbin0409
ReplyDeletemichael kors wallet sale
longchamp outlet
mulberry uk
rolex watches
michael kors online outlet
true religion canada
nba jerseys
marc jacobs
air jordan 13
camisetas futbol baratas
beats by dr dre
christian louboutin shoes
cheap jordans
mlb jerseys
cheap nfl jerseys
air jordan shoes for sale
michael kors outlet
louis vuitton outlet store
michael kors outlet
cheap jordans
mulberry outlet
thomas sabo outlet
beats headphones
louis vuitton outlet online
louis vuitton outlet
mbt shoes outlet
louis vuitton handbags
mizuno running shoes
michael kors outlet store
swarovski crystal
air max 90
juicy couture outlet
lacoste pas cher
michael kors outlet online
louis vuitton outlet
cheap jordan shoes
michael kors outlet
fitflops sandals
ReplyDeletefitflop shoes
fitflop sale
fitflop sandals
fitflop outlet
fitflops on sale
cheap ray bans
ray ban sunglasses
ray ban outlet
oakley sunglasses
Michael Kors Sunglasses
cheap oakley sunglasses
oakley outlet
http://www.sunglassshopinc.com
Stephen Curry Jerseys
Lebron James Jerseys
Kyrie Irving Jerseys
Kevin Durant Jerseys
Russell Westbrook Jerseys
Klay Thompson Jerseys
James Harden Jerseys
Derrick Rose Jerseys
Paul George Jerseys
Jimmy Butler Jerseys
Carmelo Anthony Jerseys
Chris Paul Jerseys
gucci sito ufficiale
ReplyDeletemichael kors handbags
nike outlet store
los angeles clippers
ghd flat iron
green bay packers jerseys
tiffany and co
san antonio spurs
dolce and gabbana outlet
instyler max
michael kors outlet
ReplyDeletecoach outlet
ralph lauren
adidas outlet store
oakley sunglasses outlet
coach outlet online
fitflops sale clearance
mont blanc ballpoint pen
michael kors bags
nike air max 90
hzx20170503
20170523 junda
ReplyDeletelongchamp handbags
michael kors outlet
camisetas futbol baratas
oakley sunglasses sale
longchamp outlet
coach outlet
nike shoes
louis vuitton outlet
cleveland cavaliers jerseys
louis vuitton
cheap oakley sunglasses
ReplyDeletemoncler outlet online
ugg outlet online
nike air max 97
coach outlet store online
coach outlet store online
ugg boots outlet
coach outlet online
ralph lauren sale
hermes outlet
caiting2018321
20180516 junda
ReplyDeletefitflops sale clearance
kobe bryant shoes
true religion uk
new balance shoes
swarovski crystal
swarovski outlet
76ers jerseys
cheap mlb jerseys
canada goose outlet
uggs
Cheap Jordans Outlet Store Air Jordan 1 Low All White Yellow Logo Air Jordan 11 New Retro Air Jordan 11 Color White Black Logo
ReplyDeleteAir Jordan 11 Premium Grey Suede Air Jordan 11 Future Glow Black Red New Air Jordan 14 Retro Low White Black New Air Jordan 29 Sale Red
Cheap Air Jordan 9 Mens Low Leather Black Womens Retro Air Jordan 13 Horizon Pink
Air Jordan Retro 11
ReplyDeleteKyrie Shoes
Red Bottom Shoes For Women
Pandora Outlet
Yeezy boost 350 v2
Red Bottom Shoes
Air Jordan 4 Retro
Jordans 11
Air Jordan 9
Pandora Jewelry Official Site
Lindsey20180913
Judi Gratis via Bandar QQ Kyu-Kyu Yuzhno-Sakhalinsk Region Capital Situs www.pokerrusia.net Melalui BPD Kalsel Indonesia Kode Bank 122.
ReplyDeleteCoach Factory Coach Factory Outlet Coach Outlet Online Fila Outlet Balenciaga Shoes Cheap Kate Spade Handbag Kate Spade Outlet Air Max Tn Plus Nike Air Max
ReplyDeleteVictoria Secret Outlet
Pandora
ReplyDeleteJordan 11
Pandora
Air Max 270
Pandora Jewelry
Red Bottom Shoes For Women
Jordans 11
Air Jordan
Jordan 9
Kyrie Irving Shoes
Latrice20190106
Jordan Retro 11
ReplyDeleteJordan 4
Jordan 9
Red Bottom Shoes
Pandora Jewelry
Jordans 11
Pandora Jewelry
Yeezy boost
Jordan 4 Retro
Ryan20190401
ReplyDeleteنجار بالرياض
شركة تنظيف كنب بالرياض
شركة صيانة مكيفات بالرياض
افضل شركة شفط بيارات بالرياض
ارخص شركة تنظيف بيارات بالرياض
Research Papers Writing Services should strive to ensure that all essays meets the pukka standards of the examining bodies. Consider hiring quality but also Qualified Research Paper Writers which are advantageous in terms of ensuring you get only top-quality grades on your Online Research Paper Writing Service.
ReplyDelete