Documentation
Back to website >

HTML Widgets Documentation

This HTML Widgets plugin can be very useful and a great time saver to users with no technical knowledge. Bear in mind that an html widget is a block of html content, which you want to add to a page in your nopCommerce website.

Live DEMO - see how the HTML Widgets plugin would look like in your public store.

Admin DEMO - see the plugin administration.

General information on how to setup your html widgets.

HTML widgets - general settings

The General Settings section is comon for every plugin. In HTML Widgets General Settings section it you could find:

Creating an html widget

You can create as many html widgets as you need.
In order to create a new html widget go to Plugins -> Nop Html Widgets -> Manage Html Widgets. Click on the Add new Html Widget button as shown on the image above.

Html Widget Settings

The Html Widgets Settings tab, contains general settings for the current html widget.

  1. Name - This is the name of the html widget and is a required field. It is needed, so that you can discern between your html widgets in the administration as you can have many html widgets.
  2. Visible - Specifies whether the html widget is visible in the public website.
  3. Html Content - The html content which will be displayed in the public website.

html Widget Scheduling

From the scheduling tab you could choose how long your widget will be active, and also you could choose a time pattern to repeat and activate your html widget.

There are two sections in this tab:

NOTESchedule pattern settings will be used between starting date and ending date if specified.
  1. Schedule - From this section you could set a date interval in which you want your widget to be active.
  2. Schedule pattern - From this section you could set a schedule pattern that will occur in the specified time frames every day, month, week or whatever you choose for 
    • From time - The time from which the item will be displayed.

Together all the settings in this tab would create a schedule pattern that could be described like:

Occurs {schedule pattern option} between {From time} and {To Time}. Schedule will be used between {From Date} and {To Date}.
NOTE: All times are UTC times if you are using nopCommerce version 3.9 and below.
Note: The scheduling functionality in our products uses the Default Store Time Zone rather than UTC starting from nopCommerce version 4.0.  You will need to change your schedules if they were set according to the UTC time zone. You can find and change the Default Store Time Zone setting from Administration -> Configuration -> Settings -> Customer Settings

Add the html widget to a widget zone

From the Widget Zones you could choose the locations in which you want your html widget to appear in your public store.

If you want to add the html widget to widget zones click the the Add New Record button and from the drop-down select your desired widget zone as shown on the image above.

Optionally specify a display order.

Conditions Tab

In the Conditions tab you can specify conditions for the current html widget. If the conditions are met, the html widget will be shown.

Conditions consist of condition groups. For a Condition to be true at least one Condition Group needs to be true. In other words Condition Groups are evaluated with an OR between them.
Condition Groups consist of Condition Statements. For a Condition Group to be true all Condition Statements in the group need to be true. In other words Condition Statements are evaluated with an AND between them.

The Default State is a default Condition Group. This means, that if you do not add any other Condition Groups, the Default State will determine whether the Condition is true or false. This also means that if the Default State is set to Pass the whole Condition will evaluate to true because Condition Groups are evaluated with an OR between them (only one Condition Group needs to be true for the whole Condition to be true).
In other words if you set the Default State property to Pass the html widget will be shown on all products in your store, no matter if you add other Condition Groups.

  1. Condition Name - The name of the condition.
  2. Active - used if you want to activate/deactivate the condition.

To add a Condition Group you need to click on the Add Condition Group button.

Conditions

In the Conditions tab you can specify conditions for the current HTML Widget. If the conditions are met, the HTML Widget will be shown.

You could find more information of how the conditions work in the following article - Conditions.

Override Product Conditions

From the Override Product Conditions tab you can include or exclude products regardless of the conditions.

You could find more information of how the product overrides work in the following article - Conditions.

Override Customer Conditions

From the Override Customer Conditions tab you can include or exclude customers, for which the html widget will show on the product pages regardless of all conditions. 

You could find more information of how the customer overrides work in the following article - Conditions.