Edit your website code and add this HTML:
<script src="https://apis.google.com/js/plusone.js">
</script>
<g:comments
href="[URL]"
width="642"
first_party_property="BLOGGER"
view_type="FILTERED_POSTMOD">
</g:comments>
<script src="https://apis.google.com/js/plusone.js">
</script>
<div class="g-comments"
data-href="[URL]"
data-width="642"
data-first_party_property="BLOGGER"
data-view_type="FILTERED_POSTMOD">
</div>
To insert a comments counter, add this HTML code instead of <g:comments>
:
<g:commentcount href="[URL]"></g:commentcount>
or an HTML5 version instead of <div class="g-comments">
:
<div class="g-commentcount" data-href="[URL]"></div>
Replace [URL] with the URL of your web page and fit the width. Link your web page to your Google+ profile to verify authorship. And if you prefer to load Google+ Comments dynamically, insert this HTML code:
<div id="comments"></div>
<script>
gapi.comments.render('comments', {
href: window.location,
width: '624',
first_party_property: 'BLOGGER',
view_type: 'FILTERED_POSTMOD'
});
</script>
Similarly with Google+ Comments Counter:
<div id="commentscounter"></div>
<script>
gapi.commentcount.render('commentscounter', {
href: window.location
});
</script>