Menu Close

How to add social media buttons to Shopify

  1. Knowledge Base
  2. Shopify

Social media is an extremely valuable tool for promoting your marketing content. Social media is used with the aim of creating leads, boosting their sales and spreading brand awareness digitally.
Social media has the ability to increase sales because strong online presence on sites such as Facebook and Twitter provide a cost effective way to interact directly with prospective consumers. Companies use social media with the aim of creating leads, boosting their sales and spreading brand awareness digitally.
Social media has the ability to increase sales because strong online presence on sites such as Facebook and Twitter provide a cost effective way to interact directly with prospective consumers.

Social Media Buttons can be added by two ways:

Easy Way

In the Social Media Section of the App Store, there are some themes in the Theme Store which already has a social media button added. You can check this by going to customized theme page and see the Header, Sidebar, Homepage, and/or Footer menus.

Advanced Way

You can even add social media button into any theme you want to. Some social media even provides a ready to use button on your website.

 The following steps will guide you to add social media buttons into your theme:

  • Login to Shopify admin.
  • Navigate “Online Store” and then click “Themes”.
  • Open the Asset folder
  • By scrolling down you will find a link “Add a new asset”. Click on the link.
  • After clicking you will get a list of icons file, select the icon file you want to upload and then click “Upload asset”
  • The icon button is now available. The button will start working once you add in the code to it. To add code open the “theme.liquid” file.
  • The button will be displayed in your theme depending on the code you have pasted in the line. You can see an example of the code for Twitter below. The same can work for Facebook, Pinterest and other social media also.

 

 

{{ ‘my-twitter-button.png’ | asset_url | img_tag | link_to: ‘https://twitter.com/iamawesome’, ‘follow me on twitter’ }}

 

  • For HTML, you can use a code given below with an example for Twitter:

 

<a href=”https://twitter.com”><img src=”/assets/my-button.jpg?1504124251″ alt=”Follow  on Twitter”/></a>

 

  • Click on save changes.

 

Leave a Reply

Your email address will not be published. Required fields are marked *