Before you proceed with this tutorial, make sure you have add Facebook like, comment and login option inside your webShaper store. You can click here to learn how.
Facebook like box allows your customer to like your page directly from your store. It is an easy way to help you build your customer base.
Note: It is a good practice to back up coding before edit
1. Go to Facebook Developer (Page Plugin)
2. Configure your like box as you like
3. Click on Get Code
4. Copy code on the top (do not close this window)
5. Open a new tab and go to your webShaper Control Panel
6. Go to Design
7. Click on Template Files
8. Click edit on template.html
9. Find <body> tag (press Ctrl + F and type “body” into the box)
10. Under body tag, type “<ws_text><![CDATA[”
11. Paste the code
12. After the code, type “]]></ws_text>”
13. Click on Save
14. Go back to Facebook Developer page again
15. Copy the second code
16. Go back to webShaper Control Panel
17. Go to Design
18. Go to Template Files
19. Click edit on leftbar.html
20. Put code to one of these places
- Put code after <div id=”Col2Left”>, to have it on the top of leftbar
- Put code before <!– List of available components, to have it at the bottom of leftbar
21. Click on Save
This is how it looks
Alternative looks
1. Display like box without timeline
How to achieve this:
- On step 2, leave Tabs text box empty (Facebook configurations)
2. Put on Footer (like box without timeline)
How to achieve this:
3. Place on Static Pages
How to achieve this:
- Copy the code
- Place on any Static Page you like