drew_n's profile

1.4K Messages

 • 

262.9K Points

Saturday, October 5th, 2013 2:53 PM

Closed

How do I add a 'Find us on Facebook' icon on my store?

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 contact a Homestead web advisor to discuss professional services.

In this article you will find the steps to add a Facebook icon that links directly to your store on Facebook. In this example, we'll be adding it to the Footer, but you can always add the code to a different panel in your store.

First, find a picture you want to use for your Facebook icon. You can use the one below, if you like.
findfacebook.jpg


1.) Login to your store's control panel.

2.) Click on Website Content and then Image Manager.

2012-01-21_1623.png

3.) Click on the Upload Image button.

2012-01-21_1623_001.png

4.) Choose the file from your computer, and then click Upload.

2012-01-21_1624.png

5.) The picture should now be uploaded to your store.

2012-01-21_1625.png

6.) Find the file, and then click on View Full Size.

2012-01-21_1625_001.png

7.) Copy everything after your domain anme in the URL from the new tab that appeared.

2012-01-21_1657.png

8.) Close the new tab, and then click on Design.

designlinky.png

9.) Click on the Template files tab.

templatetab.png

10.) Scroll down to the Panels folder, and click the plus sign next to it.

panelsplus.png

11.) Find the Footer.html file, and click on Edit.

2012-01-21_1644.png

12.) I want the Facebook file to be at the very bottom of the page, in this example, so I'll paste the code below the current content.

2012-01-21_1646.png

13.) We need to make this link to your Facebook profile page. First, we'll write the code for placing the image. Replace the IMAGE_URL in the code below with the address you copied from step #7.

<br /><a href="FACEBOOK_URL"><img src="IMAGE_URL" /></a>
2012-01-21_1655.png

14.) Now, go to your Facebook page and copy the URL from the address bar.

15.) Replace the FACEBOOK_URL in the code above with your code from step #14.

2012-01-21_1659.png

16.) Once you've pasted and edited your code, click Save.

2012-01-21_1653.png

Now, you should see the new Facebook link at the bottom of your screen.

This conversation is no longer open for comments or replies and is no longer visible to community members.

No Responses!