Adding your Instagram, Facebook or Twitter widget to your CubeCart 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.
Looking at your CubeCart website you will see the following in the Footer of all your pages.
These are links to specific pages in your website structure. You can add your widget to any of these pages as well as the Home page by selecting FILE MANAGER > Documents. The exception here is the Contact Us page. This you can edit by selecting FILE MANAGER > Contact Form.
Log in to your CubeCart website.
To add your widget to the Home page, About Us page, T&C’s page, Privacy Policy page or the Returns Policy page select Documents under FILE MANAGER. To add your widget to the Contact Us page select Contact Form under FILE MANAGER.
On your dashboard, click on FILE MANAGER > Documents (or FILE MANAGER > Contact Form for the Contact Us page).
You will be presented with a list of Site Documents where you can choose which page you want to add the widget to. The first one is marked as Homepage and will therefore be your main page. In this part of the tutorial we will add the snippet to your Home page (the process for the About Us page, T&C’s page, Privacy Policy page, Returns Policy page as well as the Contact Us page is exactly the same).
Click on the Title of the Document or on the Edit button to start editing the Document.
Click on the Content tab to start the Rich Text Editor.
You will see the current contents of the page displayed in the text box (i.e. a welcome message).
Click on <> Source on the Editor toolbar. This will change the visible content to actual HTML source code allowing you to insert your snippet code (formatting, etc. is now disabled).
Insert your snippet below (or above) any existing content.
Click on <> Source again to view the actual content in the Rich Text Editor text box.
In the above figure you will notice that the widget is not displayed as it will be done on your website via a browser. Instead you will see some placeholders.
These are the
<link ... />and<script>...</script>tags and the<iframe>...</iframe>tags. The Rich Text Editor cannot display the widget as it is displayed on your website via a browser, it will only display placeholders.
If you want to add a Header above your widget just add the line in the Rich Text Editor and format the Header the way you want it using the Formatting options on the toolbar.
Click on <> Source again to view the HTML source code and you will see that the editor has added a
<h3>Header with all the HTML formatting to the content.
Click on Save to save your changes to your website.
Your CubeCart Home page will now display the following (the Featured Product part is a different area of the Home page).
Adding your widget to your Categories.
Looking at your CubeCart website you will see something like the following in your Header of all your pages. This shows the categories you have set up on your website
In this figure the category we will add the widget to is called Sweet. On your webpage it will show the following (without the widget).
On your dashboard, select INVENTORY > Categories.
You will be presented with a list of categories (in this example there is only one called Sweet as shown in the Page header).
Click on the Edit button and select the Description Tab to open the Rich Text Editor.
The process for adding your widget in the Rich Text Editor is exactly the same as above for the other pages.
Here is an example of what the Sweet category will look like with the widget added.
