Get Responsive Google+ Comments

Written on April 29th, 2013. We've got comments, too!

The unofficial Google+ comments code asks for a width in the markup, but it’s pretty easy to make it responsive-ready.

Simply wrap it in another div with a fluid width, such as width: 100%, like so:

<div style="width: 100%">
<div class="g-comments"
    data-href="example.com/page-permalink/"
    data-width="600"
    data-first_party_property="BLOGGER"
    data-view_type="FILTERED_POSTMOD">
</div>
</div>

When set this way, that width of 600 appears to become the maximum width, instead. Now it scales down perfectly!

responsive-comments

Note: As of writing, this whole Google+ comments thing is an unofficial feature (it was lifted from Blogger, the only place that officially has it), so it could break practically any time — and this tweak may not function the next time you get up from bed. Keep an eye on it… At least until Google releases an official API.