How do I add social icons to the top of my store?

This article will show you how you can add social networking icons to the top of your BigCommerce template. These instructions are specifically for the Default (blue) template, but can be modified for any of the BigCommerce template files that don't have a built-in carousel.

Please note that while we offer this tutorial and it is tested and working at the time of creation, any customization of or support for these types of articles is outside of our scope of support. If you require assistance with any design or customization, we recommend that you either visit our community forums or contact one of our fantastic design partners.

Video Overview

How to add social media icons to the top of your store

1.) Go to the bottom of this article and download the zip file with the icons referenced in the article.

2.) Login to your store via FTP or WebDAV, and copy the contents of the ZIP folder into the content directory on the remote server. Once you've finished, your remote side should look similar to the following:

3.) Now, login to your BigCommerce store.

4.) Click on Design.

2012-05-08_1507.png

5.) Click on the Browse Template Files button.

2012-05-08_1508.png

6.) Click on Header.html in the top left corner.

2012-05-08_1508_001.png

7.) Then click on TopMenu.html. This is the file that we will be editing in order to add the graphics.

2012-05-08_1509.png

8.) Now, type in the code like you see in the screenshot below:

You need to change all of the red links above to your proper pages.

2012-05-08_1515.png

9.) Save your changes.

2012-05-03_1133.png

Thanks to Komodo Media for their social icon pack.

Attachments

62 votes 82% thumbs up 17% thumbs down

Did this article resolve the issue?

Was this article helpful?

Related Articles

No related articles were found.

Continue