Skip to content

Instantly share code, notes, and snippets.

@cioddi
Last active June 8, 2023 04:32
Show Gist options
  • Save cioddi/6147319 to your computer and use it in GitHub Desktop.
Save cioddi/6147319 to your computer and use it in GitHub Desktop.
social media share buttons with custom Text

Facebook

source: https://developers.facebook.com/docs/reference/dialogs/feed/

Init facebook api javascript object as described here https://developers.facebook.com/docs/reference/javascript/ create a share dialog with

FB.ui({
  method: 'feed',
  link: 'https://developers.facebook.com/docs/reference/dialogs/',
  picture: 'http://fbrell.com/f8.jpg',
  name: 'Facebook Dialogs',
  caption: 'Reference Documentation',
  description: 'Using Dialogs to interact with people.'
}, function(response){});

Twitter

source: https://dev.twitter.com/docs/tweet-button

put the custom tweet text into the data-text attribute of your a.twitter-share-button tag


<a href="https://twitter.com/share" class="twitter-share-button" data-text="{_tweet_content_}">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>

Xing

source: https://dev.xing.com/plugins/share_button/

<div data-counter="top" data-type="XING/Share" data-url="{_url_to_share_}"></div>
<script>
  ;(function (d, s) {
    var x = d.createElement(s),
      s = d.getElementsByTagName(s)[0];
      x.src = "https://www.xing-share.com/js/external/share.js";
      s.parentNode.insertBefore(x, s);
  })(document, "script");
</script>

Linked in

source: https://developer.linkedin.com/plugins/share-plugin-generator

<script src="//platform.linkedin.com/in.js" type="text/javascript">
 lang: en_US
</script>
<script type="IN/Share" data-url="{_url_to_share_}" data-counter="top"></script>

Google+

source: https://developers.google.com/+/web/share/

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

<!-- Place this tag after the last share tag. -->
<script type="text/javascript">
  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>

Share URLs

@mahakris123
Copy link

kjkjbnb

@tranthongrealestate
Copy link

Hello, can you help me create Zalo, Viber share buttons with custom Text?

Thank you so much.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment