← back to the blog


Google Plus Share

Posted in JavaScript by dake

1. Copy Google Plus Javascript - iframe

Following screen is if use google plus code by default, you just need to copy following code and put to your html.


<!-- Place this tag in your head or just before your close body tag. -->
<script src="https://apis.google.com/js/platform.js" async defer></script>

<!-- Place this tag where you want the share button to render. -->
<div class="g-plus" data-action="share"></div>

2. Google plus shared link

This is better choice, since it is not iframe so it'll be easy to change style.

Following 2 example of the html.


<a href="https://plus.google.com/share?url=http://www.dakehe.info/blog/post/facebook-share-button" onclick="javascript:window.open(this.href,    '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;"><img src="https://www.gstatic.com/images/icons/gplus-64.png" alt="Share on Google+">
              </a>

<a href="https://plus.google.com/share?url=http://www.dakehe.info/blog/post/facebook-share-button" onclick="javascript:window.open(this.href,    '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;" class="soc-google"></a>

After improve little bit of above, I re-write as following.



var dhe = dhe || {};
dhe.share_core = (function () {
    
    function openPopup(url, height, width) {
        height = height || 500;
        width = width || 500;
        window.open(url, "myWindow", "status = 1, height = " + height + ", width = " + width + ", resizable = 0");
    }

    /*
     * get current url, remove the hash or querystring
     */
    function getCurrentUrl() {
        var _location = window.location;
        var url = _location.origin + _location.pathname;
        return url;
    }

    return {
        getCurrentUrl : getCurrentUrl,
        openPopup: openPopup
    };
})();



Also, following is what the html looks like.


<a href="http://www.dakehe.info/blog/post/facebook-share-button" class="soc-google dhe_g_share"></a>