ItzJavaCraft ItzJavaCraft - 7 months ago 18
HTML Question

Change pixels to percentage in the Google commenting script

Is it possible to change the pixel width value to percentage in the Google Plus comment script?

In my opinion, it looks very nice and works quite well, as well as integrating into Google+. Only problem is, the comment system is only officially available for Blogger, and it's not obvious how to add it to non-blogger websites.

Here is the embeddable code:

<script src="https://apis.google.com/js/plusone.js"></script>
<div id="comments"></div>
<script>
gapi.comments.render('comments', {
href: window.location,
width: '624',
first_party_property: 'BLOGGER',
view_type: 'FILTERED_POSTMOD'
});
</script>

Answer

If the script will only accept a specific value in pixels and not allow you to specify a percentage width, you can calculate one yourself based on the current viewport width:

<script src="https://apis.google.com/js/plusone.js"></script>
<div id="comments"></div>
<script>
gapi.comments.render('comments', {
    href: window.location,
    width: Math.round(window.innerWidth * 0.60), //for 60%
    first_party_property: 'BLOGGER',
    view_type: 'FILTERED_POSTMOD'
});
</script>
Comments