larrybotha
3/31/2014 - 11:31 AM

Custom social sharing icons

Custom social sharing icons

Custom Social Sharing Buttons

Custom social sharing buttons for Twitter, Facebook, Google Plus, LinkedIn, StumbleUpon, and Pinterest.

via http://siliconstation.com/how-develop-custom-google-plus-button/

<a class="icon-twitter" rel="nofollow"
    href="http://twitter.com/"
    onclick="popUp=window.open(
        'http://twitter.com/intent/tweet?text=\'[Page Title]\' via @[handle] - [url]',
        'popupwindow',
        'scrollbars=yes,width=800,height=400');
    popUp.focus();
    return false">
    <i class="visuallyhidden">share on twitter</i>
</a>

<a class="icon-facebook" rel="nofollow"
    href="http://www.facebook.com/"
    onclick="popUp=window.open(
        'http://www.facebook.com/sharer.php?u=http://example.com',
        'popupwindow',
        'scrollbars=yes,width=800,height=400');
    popUp.focus();
    return false">
    <i class="visuallyhidden">share on facebook</i>
</a>

<a class="icon-gplus" rel="nofollow"
    href="http://www.plus.google.com/"
    onclick="popUp=window.open(
        'https://plus.google.com/share?url=http://example.com',
        'popupwindow',
        'scrollbars=yes,width=800,height=400');
    popUp.focus();
    return false">
    <i class="visuallyhidden">share on google plus</i>
</a>

<a class="icon-linkedin" rel="nofollow"
    href="http://www.linkedin.com/"
    onclick="popUp=window.open(
        'http://www.linkedin.com/shareArticle?url=http://example.com',
        'popupwindow',
        'scrollbars=yes,width=800,height=400');
    popUp.focus();
    return false">
    <i class="visuallyhidden">share on linkedin</i>
</a>

<a class="icon-stumbleupon" rel="nofollow"
    href="http://www.stumbleupon.com/"
    onclick="popUp=window.open(
        'http://www.stumbleupon.com/submit?url=http://example.com',
        'popupwindow',
        'scrollbars=yes,width=800,height=400');
    popUp.focus();
    return false">
    <i class="visuallyhidden">share on stumbleupon</i>
</a>

<a class="icon-pinterest" rel="nofollow"
    href="http://www.pinterest.com/"
    onclick="popUp=window.open(
        'http://pinterest.com/pin/create/button/?url=http://example.com&amp;media=[full image url]&amp;description=[page title]',
        'popupwindow',
        'scrollbars=yes,width=800,height=400');
    popUp.focus();
    return false">
    <i class="visuallyhidden">share on pinterest</i>
</a>

<a class="icon-email" rel="nofollow"
    href="mailto:?subject=[Page Title] via [Site Name]&amp;
    body=I've just read '[Page Title]' at [url]">
    <i class="visuallyhidden">share via email</i>
</a>