Home > User Manual > Marketing > Facebook Social Stores > Adding the Like button to homepage & products details page

Adding the Like button to homepage & products details page

Adding the Like button to homepage & products details page  

Go to this link and use the configurator to make the code for your buttons https://developers.facebook.com/docs/reference/plugins/like/ 

Once you have the 2 codes needed, highlight and copy the 1st code then go back to your Admin panel in Ashop

Go to Design > Themes > click on the theme you are using.

Make sure the Home Page is selected then select Edit Header as shown in screen shot below

Click on Source and paste the code to the bottom of anything already in there. leave the boxes in the red circle in screen shot unchecked. as seen in screen shot below & click Apply & Close then click Save Theme Settings.

Now click on Sections as seen in screen shot above.


Now go back to the facebook page and copy the 2nd set of code you generated earlier, and go back to your admin panel in Ashop

Then you must decide where you want the Like button to actually appear, and choose that section, in our example we have chosen Section 6 so you click on it on left side to highlight it.

Now click on add new widget to section 6 right below as seen in screen shot below and you choose a text field 


Then click on the Words Text Field 7 as shown above ( yours may have a different number behind depending on how many text field widgets you've already inserted)

This will bring up your rich text editor again, and as before you will click on Source and paste the code into the box.

Click apply and close and click on save theme settings above on left, as seen in screen shot below. You must click Save.

Final products should look similar to screenshot below


Adding the like button to your products 

  1. Open your admin panel, go to details > products detail design
  2. Click on the edit button on right hand side next to the choice that has LIVE lit up
  3. Copy this code        

<!-- FACEBOOK STARTS -->
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=222611597773740&amp;xfbml=1"></script><fb:like href="" send="false" layout="button_count" width="50" show_faces="false" font=""></fb:like>
<!-- FACEBOOK ENDS -->

4. Look under the HTML tab and find where you want to place the button, IE: We will for our example add it right after the Add to cart button as seen below
 
              <td>[AddToCart]</td>
            </tr>
          </tbody>
        </table></td>
      </tr>
  </table>
<br><!-- FACEBOOK STARTS -->
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=222611597773740&amp;xfbml=1"></script><fb:like href="" send="false" layout="button_count" width="50" show_faces="false" font=""></fb:like>

<!-- FACEBOOK ENDS -->

 

5. Click save. The Like button will now be on each of your products!


Translate and Localize your website with 'Localizer pluggin

Shopping Cart Software by Ashop