How to implement a LinkedIn share button in Webflow

Wondering how to set up a LinkedIn share button in Webflow? I'll show you how this is done in this blog article.

You see them on many websites: social media share buttons. These allow users to share your content on various platforms such as Facebook or even via email. I have previously already written a brief tutorial on how to implement Facebook and Twitter share buttons, as well as an email share button. You can read the article here, if you haven't done so already: xxx In this article I'll show you how to integrate a LinkedIn share button on your Webflow site. This also requires a little bit of custom code, which needs to be placed on each page you want to use the share button on. Let's get started...

  1. Insert the following code in the page settings (custom code area) of your page (not the custom code area of your project settings!). Note that you will have to add the code in the Before </body> tag section instead of the Inside <head> tag section.

    <script>
       const linkedinButton = document.getElementById('linkedin-button');
       linkedinButton.setAttribute('target', '_blank');
       linkedinButton.setAttribute(
           'href',
           `https://www.linkedin.com/shareArticle?mini=true&url=${window.location.href}&title=${document.title}`
       );
    </script>
  2. Create a new button on your Webflow page (alternatively you can also use a link block), which you want to use as your LinkedIn button. Style the button to your liking and give it an ID of "linkedin-button".
  3. Publish your site and your users should now be able to share the page via LinkedIn

Hope this works for you as well as it did for me! Questions? Get in touch with me and I'm happy to help.

Got any Questions?

Fill out the form below or get in touch with me via email.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.