Adding your Instagram, Facebook or Twitter widget to your Shopify online store is easy. Follow these steps to create your widget.

Once you've created your widget, follow the appropriate steps below to add it to your Weebly website.

Log into your Weebly website. On your dashboard select Edit Site:

Existing pages

  • Go to Pages
  • Select the page you want to add your widget to (e.g. Home, Contact, etc.).

Create a new Page

  • Click on + to add a new page and select a Page type
  • Add a Page name and click on Done
  • Select the new page and continue
  • Once you have selected a page click on Build
  • Under Structure, select Section and drag it onto the page where you want to place your widget.
  • NB! Ignore Choose Section Layout by clicking outside the area on the web page
  • Under BASIC, select Embed Code and drag the item onto the newly placed section. 
  • Move your mouse over the newly placed item and click on Click to set custom HTML
  • Set Position to Center & click on Edit Custom HTML
  • Add your snippet (overwrite any characters already in the HTML box)

Note: If the editor page doesn’t display the changes you have made just refresh your page.

  • Click on Publish
  • When viewing your Weebly website, your widget will be displayed as follows
  • Note that the above shows the widget with no header. 
  • You can also use a few HTML tags to improve the appearance of the widget on Weebly. Including a header (<h1>, <h2> or <h3>) and a <br/> tag will also allow you to provide a heading to your displayed widget and break between the header and the widget. The width of your widget can also be changed in the snippet you pasted under Custom HTML but note that if it is done here it will only be applicable to this instance.
<h1>Our Products</h1>
<!-- SnapWidget -->
<script src=""></script>
<link rel="stylesheet" href="" />
<script src=""></script>
<iframe src="" class="snapwidget-widget" allowTransparency="true" frameborder="0" scrolling="no" style="border:none; overflow:hidden; width:75%; "></iframe>

Example with header and <br/> tag added and width set to 75%

Did this answer your question?