Installing and Configuring Widget Areas
Getting Started with Widgets
Custom functionality is available with our Widgets. The following will allow you to install and configure the widgets and plugins available in the Administrator Backend.
To view detailed instructions on getting started with the Administrator Backend follow this link
Admin Tutorial
Locating the correct widget area
The first step is finding the widget area you want to work with. For a detailed layout of your available widget areas follow this link and choose the template layout you selected for your site.
Loading the Widget
In the Administrator Backend, click 'Blog Settings' on the top menu bar. From there, click 'Widgets' from the tabbed sub-nav toolbar. Click example image below to enlarge.
You will now see a list of the available widget areas for your blog listed in alphabetical order. Choose the area you want to add a widget to by selecting 'Add Widget' located on the right side of the screen for that widget area. Click example image below to enlarge.
Listed on this screen are all of the widgets available for installing in the container you have chosen. To install the widget, click on the title of the widget you want to place in the container. A full description of each widget is available in the help section which you can find by following this link.
After selecting the widget you want to use, you will be redirected back to the Widgets page. You will now see your widget loaded in the container you chose. In the example image below, we have chosen the Custom HTML widget. To edit the widget settings, see Editing a Widget below.
Editing a Widget
To edit a widget select the Widgets Tab located in Blog Settings.
Click the Edit Icon on the right side of the page for the widget you want to edit.
A new screen opens with the editable features of that widget. We are using the Custom HTML widget for this example. For detailed instructions on each widgets settings follow this link.
All widgets have a few common features on the edit page. They are listed in the Params section of the edit page. These fields are Name, CSS Class, DOM ID, and Show on.
- Name - Allows you to give your widget a name so you can easily locate it on your Widgets Screen. This name is only seen by you in the Administrators Backend and not by anyone viewing your site.
- CSS Class (Advanced Feature) - This allows you to apply a CSS Class name to your widget area. This is used when external CSS Style Sheets are uploaded to modify your site's layout. (Not currently in use!)
- DOM ID (Advanced Feature) - Same as CSS Class except it is applying an ID instead of a Class. (Not currently in use!)
- Show on - This allows you to choose what pages your widget appears on. You can select multiple pages by holding the Control Key while clicking the different options. The default for widgets is to display on all pages of your site. The only time you would need to change this is if you want to limit the appearance of your widget.
When you are satisfied with your selections click the Update button at the bottom of the Edit Screen. If you want to undo your changes, click the Reset button and the selections will return to their default state.
Deleting a Widget
To remove a widget from its container, select the Widgets tab located in Blog Settings.
Click the Delete Icon on the right side of the page for the widget you want to remove. You will be propted with a popup if you are sure you want to remove the selected widget. Click OK and the widget will be removed from that container.
Changing Display Order of Widgets in a Container
To change the display order of the widgets on your site located within the same container, select the Widgets tab located in Blog Settings.
If you have more then one (1) widget in any container area you will see arrows pointing up and down to the left of the Edit Icon. Click on the example image below to enlarge for an example.
Choose the widget you want to move and click the corresponding arrow to move that widget either up or down inside of the container. This will change the order of how the widgets in that container are displayed on your blog.
