Module Display

Title

Standard module display

Title

Standard module display + header icon

Title

Standard module display + badge Badge

Title

Standard module display + module class suffix mod-box

Title

Standard module display + module class suffix mod-box + icon

Title

Standard module display + module class suffix mod-box + badge Badge

Title

Standard module display + module class suffix mod-box bg-success

Title

Standard module display + module class suffix mod-box bg-warning

Title

Standard module display + module class suffix mod-box bg-info

Title

Standard module display + module class suffix mod-box bg-danger

Title

Standard module display + module class suffix mod-box align-center

Title

Standard module display + module class suffix mod-box align-right

How to add header icon to a module

To add header icon to any module please follow the below steps.

  1. Go to Module Manager.
  2. Open your desired module to which you want to add the icon.
  3. Go to the tab called VP Framework - Extended.
  4. Select your desired icon against the field called Header Icon.
  5. Save them module.

How to add badge to a module

To add badge to any module please follow the below steps.

  1. Go to Module Manager.
  2. Open your desired module to which you want to add the icon.
  3. Go to the tab called VP Framework - Extended.
  4. Enter your desired text for the badge in the field called Badge Text.
  5. Select your desired badge color against the field called Badge Style.
  6. Save them module.

While entering css class suffix in Module Class Suffix field, please ensure to leave a space at the starting.

If you are using any WYSIWYG editor you may not be able to enter or save raw HTML codes properly in articles or in custom HTML Module or in VirtueMart Editor type custom field. It is recommended that you set the Default Editor as Editor - CodeMirror in Joomla! Global Configuration before trying to add any HTML codes. CodeMirror Editor makes your life easier when you are dealing with raw HTML codes.