Adding your Instagram widget to your SITE123 website 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 website.
SITE123 allows you to add sections to your pages. This can include one of the following:
o Articles
o Blog
For the purpose of this tutorial we have created 2 pages, i.e. Grid Display and Slideshow Display. We have used the Articles page type but you could also use the Blog page type. The item types for both page types are called Articles.
Log in to your SITE123 website and on the dashboard click on Edit.
On the Edit page, click on Pages.
Click on EDIT next to the page you want to add the widget to.
This will open the page editor allowing you to add an article to your page.
Click on Add New Article. This will display the editor page for adding your article.
Add a Title for your article. We have used the widget type as a Title, you will of course use your own applicable Title.
Before you enter your widget snippet in the Content input box, make sure you have selected the Custom Code toolbar option.
This will display the Custom HTML input text box.
Moving you mouse over this Custom HTML box will display the Change option.
Click on Change to display the actual Custom HTML Editor. This will display the HTML code for the initial gray area with the Custom HTML wording.
Overwrite this content with your snippet code.
Click on Update to save the code. This will display a preview of your widget.
Depending on your settings, this could display different from what it would show on your live actual website.
To view the actual page with your widget click on Save at the bottom of the page.
This will return to the Articles selection page. Click on Preview at the left bottom of the page.
This will then display the page allowing you to select the article you have just added.
Your widget will then display as follows.
The above was for your Grid Display widget.
If you add your Slideshow Display Widget the process will be the same and the widget will display as follows on your website.
Clicking on any item in your Grid Display or Slideshow Display will display the selected item in a lightbox.
