Streaming live at 10am (PST)

Social Sharing Links


#1

Please help. I’m desperate.

I’m trying to add social sharing links to my CMS collection pages. I created my own, however, I can’t seem to link each individual post by editing an individual post in Blog Collection Template. No matter which blog post I click on, the social sharing element will have the same link. Understandable.

So I decided to use AddThis, but I’m not sure if there’s a seamless integration for it. Adding the code in Custom Code in Settings doesn’t seem to work.

How to create social sharing links/elements that actually work with the CMS?


Here is my public share link: LINK
(how to access public share link)


#2

Sorry brother. No better idea about CMS.


#3

Curious if you ever found a solution to this? I’m in the same boat right now


Edit:
Actually I found it did work with the Add This code. Thanks for sharing that resource!


#4

The API for Facebook/twitter/linkedin and so on - change over time (Read the docs for each platform).

Linkedin:

For linkedin for example this works perfectly (Change to your slug and absolute path):

<script src="//platform.linkedin.com/in.js" type="text/javascript">lang: en_US</script>
<script type="IN/Share" data-url="https://www.sitename.co.uk/post/{{cms slug her}}"></script>

Facebook:

Add some share icon (JPEG)

<a title="share on facebook" class="social-icon facebook"  href="javascript:fbshareCurrentPage()" target="_blank" alt="Share on Facebook">
<img height="21" src="https://some-facebook-icon.gif" alt="share on facebook button">
</a>

<script language="javascript">
    function fbshareCurrentPage()
    {window.open("https://www.facebook.com/sharer/sharer.php?u="+escape(window.location.href)+"&t="+document.title, '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');return false; }
</script>

Twitter

<a title="Share on Twitter" href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-show-count="false">Tweet</a>

<script src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

OPEN GRAPH

You should add Open Graph (OG) data (Title/image and so on):


#5

Hey @Siton_Systems

Do you know how to prevent my preloader gif from interfering with OG image?

When I share a CMS page, the first time it gets the preloader gif, then I close the window and share again and it gets the good OG.

Thanks!