Add the LinkedIn share button to all blog posts

Follow

Rob

• July 05, 2019 00:58

On all blog posts under the articles I need a LinkedIn share button. I'm using the turbo Portland theme the "show social media share icons" is on but LinkedIn is not part of it. How do I custom code this in?

 

0

• 

  Jennifer

  • October 23, 2019 17:42

  I am having a similar issue. I don't want Pinterest but I do want Instagram. Why can't I change this? 

   

  0

  Comment actions Permalink
• 

  Rob

  • October 24, 2019 05:59

  If you don't need Pinterest, just hide it in the CSS.

  .share-btn.pinterest {
      display: none;
  }

  0

  Comment actions Permalink
• 

  Crysta Hammond

  • December 19, 2019 15:49

  I too need to add a social share icon for LinkedIn. Where can I change this?

  0

  Comment actions Permalink
• 

  Rob

  • December 19, 2019 22:26

  @ Crysta Hammond

  Open /snippets/social-buttons.liquid

  Add your Linkedin code below the other social media icons like so

  -- CODE --

  <div class="share-btn linkedin"><!--linkedin-->
  <a target="_blank" class="icon-linkedin-share" href="http://www.linkedin.com/shareArticle?mini=true&url=http://{{ shop.domain }}{{ article.url }}&title={{ article.title }}&summary={{ article.content | strip_html | truncate: 240 }}&source=http://{{ shop.domain }}{{ article.url }}"></a>
  </div>

  -- STYLES --

  Search your style sheet for -share:before and just copy the styles from another icon to the new element.class e.g. .icon-linkedin-share:hover and .icon-linkedin-share:hover:before

  You might need to also add the icon in to the styles. Note that "\eaca" might be another icon (this happened to me) so you just need to find what code linkedin is.

  .icon-linkedin-share:before { content: "\eaca"; }

  Hope that helps

  0

  Comment actions Permalink

Please sign in to leave a comment.