All of our WHMCS Themes Have Been Updated for WHMCS 8.11
All of our WHMCS Themes have been updated for full compatibility with the latest versions of WHMCS, 8.11.0 - 8.11.2.

Simplicity WHMCS Theme Documentation


Contents


  1. Theme requirements
  2. Installation instructions
  3. Upgrade instructions
  4. Configurable theme options
  5. Configurable orderform template options
  6. Customising Simplicity theme
  7. Trouble-shooting and support
  8. Changelog and release history

Theme requirements


Before purchasing or installing Simplicity theme for WHMCS, please ensure that you have purchased and installed the latest version of the WHMCS software.

The current version of Simplicity theme is designed to work with WHMCS version 8.11.2.

Installation instructions


Please follow the instructions below to download and install the latest version of Simplicity theme.

Step 1: download Simplicity theme

To download the latest version of Simplicity Theme, please follow the steps below:

  1. Log in to My Account
  2. Select Account Overview from the My Account menu
  3. Scroll down the Account Overview page to the My Products section and select Simplicity WHMCS Theme from the list of available products
  4. Scroll down the Simplicity WHMCS Theme page to the Product Downloads section
  5. Choose the version of the theme you would like to download (we would always recommend using the latest available version of Simplicity Theme) and click the download button
  6. Extract the contents of the downloaded zip file on your computer

Step 2: install Simplicity theme

In order to install Simplicity Theme on your server, you will need to use an FTP client (such as FileZilla) to connect to your server.

After downloading and extracting the Simplicity Theme product zip file, you will find the following directories:

  • simplicity – contains the main Simplicity WHMCS theme files
  • orderforms – contains the three matching Simplicity order form / shopping cart templates:
    • simplicity_compare – contains the matching Simplicity order form template – comparison product selection version
    • simplicity_slider – contains the matching Simplicity order form template – slider product selection version
    • simplicity_standard – contains the matching Simplicity order form template – standard product selection version
  • third party addons – contains compatible themes / templates for various third party addons, including:
Step 2.1: install the main theme files

Using your FTP client, upload the simplicity directory to the following location on your server:

/your-whmcs-install-location/templates/

Step 2.2: install the order form theme/template files

Using your FTP client, upload the simplicity_compare, simplicity_standard and simplicity_slider directories from the orderforms directory to the following location on your server:

/your-whmcs-install-location/templates/orderforms/

Please note: simplicity_compare and simplicity_slider are child templates of simplicity_standard. simplicity_standard must be uploaded to your server if you intend to use either simplicity_compare or simplicity_slider.
Step 2.3: install any relevant third party theme/template files

This step is only necessary if you are using any of the following third party addons/modules:

Official WHMCS Project Management Addon

To install the matching theme/template for the Official WHMCS Project Management Addon using your FTP client, upload the simplicity directory from the third party addons / project management addon directory to the following location on your server:

/your-whmcs-install-location/modules/addons/project_management/templates/

Modules Garden DNS Manager

To add the DNS Manager link the primary navigation, you need to upload the included hook file (hook_primary_nav_add_manage_dns.php) which can be found in the Simplicity theme download zip file (in the third party addons folder) to the following location:

/your-whmcs-install-location/includes/hooks/

Modules Garden Domain Orders Extended

In order for the module to function, you must update the following additional required theme/template files from the module download zip to the Simplicity theme folder. Find the template files in the Domain Orders Extended download zip in the following folder:

…your php version…/templates/six/

Upload them to:

/your-whmcs-install-location/templates/simplicity/

Note regarding addons from Modules Garden: Our themes support the majority of modules from Modules Garden out of the box, with no requirement for additional theme/template files. Supported addons include cPanel Extended, Direct Admin Extended, Plesk Extended and many more. Styles for these modules are specified within the main Flare theme stylesheets to ensure that they match with the style/layout of Flare theme.

Step 3: activate Simplicity theme

Please follow the instructions below to activate and begin using Simplicity theme.

Step 3.1: activate the main client area theme

Log in to the WHMCS admin area and follow the instructions below to activate Simplicity theme:

  1. Navigate to Setup > General Settings
  2. On the General tab, scroll down to the Template option
  3. Select Simplicity from the list of available themes
  4. Click the Save Changes button at the bottom of the page
Step 3.2: activate the matching order form template(s)

Follow the steps below to activate the matching Simplicity order form template:

  1. Navigate to Setup > General Settings
  2. Navigate to the Ordering tab, scroll down to the Default Order Form Template option
  3. Select Simplicity Standard from the list of available order form templates
  4. Click the Save Changes button at the bottom of the page
It is recommended to use Simplicity Standard as the default order form / shopping cart template rather than Simplicity Compare or Simplicity Slider. Simplicity Compare or Simplicity Slider can be applied to particular product groups following the instructions below.

Follow the additional optional steps below if you want to apply a specific order form template, such as Simplicity Compare or Simplicity Slider, to a particular product group:

  1. Navigate to Setup > Products/Services > Products/Services
  2. Click the edit button edit button next to the product group you wish to apply a custom template to
  3. Scroll down to the Order Form Template option and select Use Specific Template
  4. Select the order form template you wish to use from the list of available order form templates
  5. Click the Save Changes button at the bottom of the page

Upgrade instructions


The upgrade process varies depending on whether or not you have made any changes or customisations to any of the theme files (including theme-options.tpl, custom.css or any other theme files).

Note: we always recommend backing up your existing website files (including theme files) before upgrading.

If you have not changed or customized any of the theme files, you can simply download the latest version of the theme files from our website and upload them to your web server, overwriting the previous version of the theme files.

For details of how to download and install the theme files, please follow steps 1 and 2 of the installation instructions section above.

Remember: you must select the overwrite option when prompted by your ftp client, to overwrite the existing theme files with the newer version.

If you have made changes or customizations to any of the theme files, the following upgrade process is recommended.

Step 1: download Simplicity theme

To download the latest version of Simplicity Theme, please follow the steps below:

  1. Log in to My Account
  2. Select Account Overview from the My Account menu
  3. Scroll down the Account Overview page to the My Products section and select Simplicity WHMCS Theme from the list of available products
  4. Scroll down the Simplicity WHMCS Theme page to the Product Downloads section
  5. Choose the version of the theme you would like to download (we would always recommend using the latest available version of Simplicity Theme) and click the download button
  6. Extract the contents of the downloaded zip file on your computer

Step 2: check which files need updating

Please refer to the Simplicity theme release notes and changelog to identify which theme files have been changed/updated since your installed version. If more than one new version has been released since you last installed or updated your current version, you will need to check the release notes and changelog for each subsequent version to identify all the files that need updating.

Step 3: update required files

After you have identified which files need updating, you will then need to update each file individually.

For each file that needs updating, check whether or not you have edited or customized the installed version of that particular file. If you’re not sure, you can use an online tool such as diffchecker.com to compare the original version and the version on your server to check for any differences.

Tip: it’s always a good idea to keep a record of any files that you edit/customize for future reference.

If you haven’t edited/customized the file in question, you can simply upload the new version of the file to the relevant location on your server, overwriting the existing file.

If you have edited/customized the file in question, you will need to either upload the new version of the file and re-apply any edits/customizations, or manually apply any changes in the new version to your existing edited/customized version of the file (see the release notes and changelog for details of file changes in the new version). Which method you choose will depend on the amount of changes in the new version of the file and how extensively you have edited/customized the original file. You will most likely want to choose the method which results in the least required work.

Configurable theme options


Simplicity theme includes the following configurable theme options:

  • Main navbar and brand display options – including breadcrumb display options
  • Tabs & Sidebar options
  • Resource Minification options
  • Theme debug options

These options can be configured by editing the theme-options.tpl file located within the includes directory, in the main simplicity theme directory, in accordance with the instructions below.

Each order form template also has a number of configurable options. Instructions for editing these options can be found in the relevant section below.

Main navbar and brand display options

Simplicity theme can be configured to display either an image logo or brand text in the main nav bar, or neither (a useful option if you are including Simplicity theme within your own website template). Additional options also allow you to you enable or disable the display of the following elements:

  • Breadcrumbs
  • Shopping cart icon
  • Notifications icon
  • Language icon
Option 1.1: enable or disable navbar brand display

This option allows you to specify whether or not the brand (either text or image based logo can be configured by subsequent options) is displayed in the main navbar and can be changed by editing line 25 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itBrandDisplay.

For example:

{assign var=itBrandDisplay value="enabled" scope="global"}

or:

{assign var=itBrandDisplay value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.2: specify navbar brand type

This option allows you to specify the type of brand to be displayed in the navbar, either text or an image based logo. This option can be changed by editing line 28 in the theme-options.tpl file, specifying a value of either text or logo for the variable itBrandType.

For example:

{assign var=itBrandType value="text" scope="global"}

or:

{assign var=itBrandType value="logo" scope="global"}

If no value is specified, the default behaviour is text.

Option 1.3: specify the navbar brand logo url (if applicable)

In order to use an image based logo, after specifying the value logo on line 31 (as described above), please provide the url path to your logo image by specifying a value for the variable itBrandLogoUrl on line 26 in the theme-options.tpl file.

For example:

{assign var=itBrandLogoUrl value="http://www.yoursite.com/logo.png" scope="global"}

Please note: the maximum recommended image height is 30px.

Option 1.4: specify navbar brand custom text (if applicable)

If you choose to use brand text rather than an image based logo, you can also provide optional custom text by specifying a value for the variable itBrandText on line 34 in the theme-options.tpl file.

For example:

{assign var=itBrandText value="My Company Name" scope="global"}

Please note: if you choose to use brand text, but do not specify a value for the variable itBrandText the company name, as specified in the WHMCS admin area, will be used.

Option 1.5: enable or disable breadcrumb display

This option allows you to specify whether or not the breadcrumb trail (showing the navigational path to the current page) is displayed below the main navbar. This option can be changed by editing line 37 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itBreadcrumbDisplay.

For example:

{assign var=itBreadcrumbDisplay value="enabled" scope="global"}

or:

{assign var=itBreadcrumbDisplay value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.6: enable or disable cart icon display on desktop view

This option allows you to specify whether or not the shopping cart icon (along with a label showing the current number if items in the shopping cart) is displayed in the main navbar on larger screen sizes (such as desktop or laptop computers). This option can be changed by editing line 40 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itCartIconDisplayDesktop.

For example:

{assign var=itCartIconDisplayDesktop value="enabled" scope="global"}

or:

{assign var=itBreadcrumbDisplay value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.7: enable or disable cart icon display on mobile view

You can also specify whether or not the shopping cart icon is displayed in the main navbar on smaller screen sizes (such as mobile or tablet devices). This option can be changed by editing line 43 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itCartIconDisplayMobile.

For example:

{assign var=itCartIconDisplayMobile value="enabled" scope="global"}

or:

{assign var=itCartIconDisplayMobile value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.8: enable or disable notifications icon display on desktop view

This option allows you to specify whether or not the notifications icon (along with popover notifications list) is displayed to logged-in users in the main navbar on larger screen sizes (such as desktop or laptop computers). This option can be changed by editing line 46 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itNotificationsIconDisplayDesktop.

For example:

{assign var=itNotificationsIconDisplayDesktop value="enabled" scope="global"}

or:

{assign var=itNotificationsIconDisplayDesktop value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.9: enable or disable notifications icon display on mobile view

You can also specify whether or not the notifications icon (along with popover notifications list) is displayed to logged-in users in the main navbar on smaller screen sizes (such as mobile or tablet devices). This option can be changed by editing line 49 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itNotificationsIconDisplayMobile.

For example:

{assign var=itNotificationsIconDisplayMobile value="enabled" scope="global"}

or:

{assign var=itNotificationsIconDisplayMobile value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.10: enable or disable navbar language icon display on desktop view

This option allows you to specify whether or not the language icon (along with popover language list) is displayed (when language change is enabled) in the main navbar on larger screen sizes (such as desktop or laptop computers). This option can be changed by editing line 52 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itLanguageIconDisplayDesktop.

For example:

{assign var=itLanguageIconDisplayDesktop value="enabled" scope="global"}

or:

{assign var=itLanguageIconDisplayDesktop value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.11: enable or disable navbar language icon display on mobile view

You can also specify whether or not the language icon (along with popover languages list) is displayed (when language change is enabled) in the main navbar on smaller screen sizes (such as mobile or tablet devices). This option can be changed by editing line 55 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itLanguageIconDisplayMobile.

For example:

{assign var=itLanguageIconDisplayMobile value="enabled" scope="global"}

or:

{assign var=itLanguageIconDisplayMobile value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.12: enable or disable footer language icon display

You can also choose to display the language icon (along with popover languages list) in the footer, either instead of or in addition to the navbar language icon. This can be a useful way to create more space in the main nabber if you have a large company name / logo, or additional navbar menu options, or if you simply want a less cluttered navbar. When this option is enabled the language icon will be displayed in the bottom right hand corner of the website footer, and applies to all screen sizes / devices.

This option can be changed by editing line 58 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itLanguageIconDisplayFooter.

For example:

{assign var=itLanguageIconDisplayFooter value="enabled" scope="global"}

or:

{assign var=itLanguageIconDisplayFooter value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Tabs & sidebar options

WHMCS version 6.0 saw the introduction of client area sidebars to provide additional contextual menus, such as data-table filters, common actions and quick links to other relevant pages, throughout the client area.

Simplicity makes use Bootstrap’s inbuilt tabbed navigation functionality to present some of these menus in a more user friendly and intuitive manner. We’ve also incorporated bootstrap-tabdrop.js to improve the display of tabs on small screen sizes, for a completely responsive experience.

Prefer the default sidebars to tabs? Not a problem. Our theme options allow you to choose between tabs, sidebars or a combination of the two.

More information on client area sidebar menus (introduced in WHMCS version 6.0), including how to edit the menu content, can be found in the WHMCS documentation on the WHMCS website here.

If neither the primary or secondary sidebar is shown, the main content panel will automatically increase in size to use up the empty space.

Option 2.1: enable or disable primary tabs display

If primary tabs are enabled, the primary sidebar menus detailed in the table below will be displayed as a tabbed navigation menu, below the page title, instead of the default sidebar list menu.

Template Page Menu Name Menu Description
clientareadomains.tpl My Domains Status Filter Status filter menu for my domains table
announcements.tpl Announcements Months Announcement date links
clientareadomainaddons.tpl,
clientareadomaincontactinfo.tpl,
clientareadomaindetails.tpl,
clientareadomaindns.tpl,
clientareaemailforwarding.tpl,
clientareadomaingetepp.tpl,
clientareadomainregisterns.tpl
Domain Details Management Domain details page management link (eg. addons, auto renew, cancel)
clientareainvoices.tpl My Invoices Status Filter Status filter menu for my invoices table
clientareaproductdetails.tpl Service Details Overview,
Service Details Actions
The service details overview menu switches between content on the product details page (eg. product overview, product addons, etc.),
The service details actions menu provides product action links (eg. login to channel, login to webmail, cancel product, etc.)
When displayed as a tabbed menu, both menus are merged together
clientareaproducts.tpl My Services Status Filter Status filter menu for my products and services table
clientareaquotes.tpl My Quotes Status Filter Status filter menu for my quotes table
serverstatus.tpl Network Status Network status category links
supportticketslist.tpl Ticket List Status Filter Status filter menu for my support tickets table

On pages not listed above with primary sidebar menus, or if any of the pages listed above have additional primary sidebar items not included in the list, these will be displayed as sidebar items in the default style (unless the primary sidebar is disabled by option 2.1).

When tabs are enabled and there are no additional primary sidebar items, the primary sidebar will not be displayed.

This option applies to all screen sizes / devices and can be changed by editing line 63 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itPrimaryTabs.

For example:

{assign var=itPrimaryTabs value="enabled" scope="global"}

or:

{assign var=itPrimaryTabs value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 2.2: enable or disable primary sidebar display

This option allows you to choose whether or not the client area primary sidebar is displayed throughout your website. If primary tabs are enabled (see option 2.1 above), the menus defined in the table above will be shown as tabbed menus, shown below the page title, rather than in the sidebar.

This option applies to all screen sizes / devices and can be changed by editing line 66 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itPrimarySidebar.

For example:

{assign var=itPrimarySidebar value="enabled" scope="global"}

or:

{assign var=itPrimarySidebar value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 2.3: enable or disable secondary sidebar display

This option allows you to choose whether or not the client area secondary sidebar is displayed throughout your website. This option applies to all screen sizes / devices and can be changed by editing line 69 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itSecondarySidebar.

For example:

{assign var=itSecondarySidebar value="enabled" scope="global"}

or:

{assign var=itSecondarySidebar value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Resource minification options

The following options allow you to define whether minified or full versions of the main theme and order form template JavaScript and CSS files are loaded. We would always recommend using minified versions for day to day use, but it can be useful to useful to load the full versions for customization/testing purposes.

These options were introduced in Simplicity theme version 2.1.0.

Option 3.1: enable or disable use of minified CSS

You can enable to disable the use of minified CSS by editing line 74 of the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itCSSMin.

For example:

{assign var=itCSSMin value="enabled" scope="global"}

or:

{assign var=itCSSMin value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 3.2: enable or disable use of minified JS

You can enable to disable the use of minified JS by editing line 77 of the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itJSMin.

For example:

{assign var=itJSMin value="enabled" scope="global"}

or:

{assign var=itJSMin value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Theme debug options

Simplicity theme also includes a debug option which can be used to provide useful information on theme options and function variables for development and trouble-shooting purposes.

Option 4.1: enable or disable theme debug mode

Theme debug mode can be enabled or disabled by editing line 82 in the theme-options.tpl file, specifying a value of either enabled or disabled for the variable itThemeDebug.

For example:

{assign var=itThemeDebug value="enabled" scope="global"}

or:

{assign var=itThemeDebug value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Configurable order form template options


Each order form / shopping cart template also has a number of configurable options.

These can be configured by editing the cart-options.tpl file in the relevant order form template folder.

Simplicity Standard order form template options

The Simplicity Standard order form template has a number of configurable options which apply to all included order form pages, unless specified otherwise.

Option 1.1: enable or disable sidebar display on order form / cart pages

This option allows you to choose whether or not the sidebar is displayed on all order form / cart pages. This option applies to large screen sizes / desktop devices and can be changed by editing line 24 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartSidebarDisplay.

For example:

{assign var=itCartSidebarDisplay value="enabled" scope="global"}

or:

{assign var=itCartSidebarDisplay value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.2: enable or disable mobile friendly sidebar display on order form / cart pages

This option allows you to choose whether or not the sidebar is displayed on all order form / cart pages. This option applies to small screen sizes / mobile devices and can be changed by editing line 27 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartSidebarMobileDisplay.

For example:

{assign var=itCartSidebarMobileDisplay value="enabled" scope="global"}

or:

{assign var=itCartSidebarMobileDisplay value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 2.1: specify page header text for view products and view addons pages

This option allows you to choose the text that is displayed as the main page header / title on the view products and view addons pages. This option can be configured by editing line 32 in the cart-options.tpl file, specifying a value of either default, category or custom for the variable itCartProductsHeaderText.

For example:

{assign var=itCartProductsHeaderText value="default" scope="global"}

or:

{assign var=itCartProductsHeaderText value="category" scope="global"}

or

{assign var=itCartProductsHeaderText value="custom" scope="global"}

If category is specified, the current product category will be displayed (as defined in wHMCS admin) for the view products page, and the text “Addons” for the view addons page. If custom is specified, you can define custom text to be used in option 2.2 (see below). If default is specified, or no value is specified, the default text will be used – the language variable {$LANG.navservicesorder} – by default in English this would equate to “Order New Services”.

Option 2.2: specify custom page header text for view products and view addons pages

If you have specified the value custom for option 2.1, this option allows you to specify the custom text to be used, by editing line 35 in the cart-options.tpl file and specifying a value for the variable itCartProductsHeaderCustomText.

For example:

{assign var=itCartProductsHeaderCustomText value="My Awesome Products" scope="global"}
Option 2.3: enable or disable product category tabs on view products and view addons pages

This option allows you to choose whether or not the product categories are shown as a tabbed navigation menu are shown at the top of the view products page and view addons page. This is a useful alternative way of linking to the various product categories if you decide to disable the cart sidebar. This option can be configured by editing line 38 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartProductsTabs.

For example:

{assign var=itCartProductsTabs value="enabled" scope="global"}

or:

{assign var=itCartProductsTabs value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 3.1: enable or disable currency chooser on all cart pages

This option allows you to choose whether or not the currency chooser button is shown at the bottom of relevant pages (when applicable). This is a useful alternative way of allowing users to change currency if you decide to disable the cart sidebar. This option can be configured by editing line 43 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartCurrencyChooser.

For example:

{assign var=itCartCurrencyChooser value="enabled" scope="global"}

or:

{assign var=itCartCurrencyChooser value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 4.1: Configure the number of products shown per row on the view products page

This option allows you to choose the number of products shown per row on the view products page, choosing between 1 and 4 products per row.

This option can be changed by editing line 48 in the cart-options.tpl file, specifying a value of either 1, 2, 3 or 4 for the variable itCartNumberProductsPerRow.

For example:

{assign var=itCartNumberProductsPerRow value="1" scope="global"}

or:

{assign var=itCartNumberProductsPerRow value="2" scope="global"}

If no value is specified, the default behaviour is 1.

This option was introduced in Simplicity theme version 2.2.0.

Option 4.2: Configure the number of addons shown per row on the view available addons page

This option allows you to choose the number of addons shown per row on the view available addons page, choosing between 1 and 4 addons per row.

This option can be changed by editing line 51 in the cart-options.tpl file, specifying a value of either 1, 2, 3 or 4 for the variable itCartNumberAddonsPerRow.

For example:

{assign var=itCartNumberAddonsPerRow value="1" scope="global"}

or:

{assign var=itCartNumberAddonsPerRow value="2" scope="global"}

If no value is specified, the default behaviour is 1.

This option was introduced in Simplicity theme version 2.2.0.

Option 5.1: select order summary display position for Configure Product page

This option allows you to choose where the order summary panel is shown on the configure product page, either at the bottom of the page (underneath any configurable product options) or at the righthand side of the page (alongside any configurable product options). This option can be changed by editing line 56 in the cart-options.tpl file, specifying a value of either bottom or side for the variable itCartConfProdOrderSummaryDisplayMethod.

For example:

{assign var=itCartConfProdOrderSummaryDisplayMethod value="bottom" scope="global"}

or:

{assign var=itCartConfProdOrderSummaryDisplayMethod value="side" scope="global"}

If no value is specified, the default behaviour is bottom.

This option was introduced in Simplicity theme version 2.6.0.

Option 5.2: enable or disable autoscroll for the order summary panel on the Configure Product page

If you have chosen to display the order summary panel at the side of the main content (see cart option 5.1 above), you can use this option to specify whether or not the order summary panel should autoscroll, that is automatically move up and down the page (when you scroll the page) to remain in view. This option can be changed by editing line 59 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartConfProdOrderSummaryAutoScroll.

For example:

{assign var=itCartConfProdOrderSummaryAutoScroll value="enabled" scope="global"}

or:

{assign var=itCartConfProdOrderSummaryAutoScroll value="disabled" scope="global"}

If no value is specified, the default behaviour is enabled. This option will only be used if option 5.1 (see above) is set to side.

This option was introduced in Simplicity theme version 2.6.0.

Option 6.1: select order summary display position for Domain Renewals page

This option allows you to choose where the order summary panel is shown on the configure product page, either at the bottom of the page (underneath any configurable product options) or at the righthand side of the page (alongside any configurable product options). This option can be changed by editing line 64 in the cart-options.tpl file, specifying a value of either bottom or side for the variable itCartDomRenewOrderSummaryDisplayMethod.

For example:

{assign var=itCartDomRenewOrderSummaryDisplayMethod value="bottom" scope="global"}

or:

{assign var=itCartDomRenewOrderSummaryDisplayMethod value="side" scope="global"}

If no value is specified, the default behaviour is bottom.

This option was introduced in Simplicity theme version 2.6.0.

Option 6.2: enable or disable autoscroll for the order summary panel on the Domain Renewals page

If you have chosen to display the order summary panel at the side of the main content (see cart option 2.1 above), you can use this option to specify whether or not the order summary panel should autoscroll, that is automatically move up and down the page (when you scroll the page) to remain in view. This option can be changed by editing line 67 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartDomRenewOrderSummaryAutoScroll.

For example:

{assign var=itCartDomRenewOrderSummaryAutoScroll value="enabled" scope="global"}

or:

{assign var=itCartDomRenewOrderSummaryAutoScroll value="disabled" scope="global"}

If no value is specified, the default behaviour is enabled. This option will only be used if option 1.1 (see above) is set to side.

This option was introduced in Simplicity theme version 2.6.0.

Simplicity Compare order form template options

The Simplicity Compare order form template has its own cart-options.tpl file, however these options will only apply to the Simplicity Compare view products page. This is because Simplicity Compare is a child templates of the Simplicity Standard order form template, and all other cart pages are handled by the Simplicity Standard template.

Option 1.1: enable or disable sidebar display on order form / cart pages

This option allows you to choose whether or not the sidebar is displayed on all order form / cart pages. This option applies to large screen sizes / desktop devices and can be changed by editing line 24 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartSidebarDisplay.

For example:

{assign var=itCartSidebarDisplay value="enabled" scope="global"}

or:

{assign var=itCartSidebarDisplay value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.2: enable or disable mobile friendly sidebar display on order form / cart pages

This option allows you to choose whether or not the sidebar is displayed on all order form / cart pages. This option applies to small screen sizes / mobile devices and can be changed by editing line 27 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartSidebarMobileDisplay.

For example:

{assign var=itCartSidebarMobileDisplay value="enabled" scope="global"}

or:

{assign var=itCartSidebarMobileDisplay value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 2.1: specify page header text for view products and view addons pages

This option allows you to choose the text that is displayed as the main page header / title on the view products and view addons pages. This option can be configured by editing line 32 in the cart-options.tpl file, specifying a value of either default, category or custom for the variable itCartProductsHeaderText.

For example:

{assign var=itCartProductsHeaderText value="default" scope="global"}

or:

{assign var=itCartProductsHeaderText value="category" scope="global"}

or

{assign var=itCartProductsHeaderText value="custom" scope="global"}

If category is specified, the current product category will be displayed (as defined in wHMCS admin) for the view products page, and the text “Addons” for the view addons page. If custom is specified, you can define custom text to be used in option 2.2 (see below). If default is specified, or no value is specified, the default text will be used – the language variable {$LANG.navservicesorder} – by default in English this would equate to “Order New Services”.

Option 2.2: specify custom page header text for view products and view addons pages

If you have specified the value custom for option 2.1, this option allows you to specify the custom text to be used, by editing line 35 in the cart-options.tpl file and specifying a value for the variable itCartProductsHeaderCustomText.

For example:

{assign var=itCartProductsHeaderCustomText value="My Awesome Products" scope="global"}
Option 2.3: enable or disable product category tabs on view products and view addons pages

This option allows you to choose whether or not the product categories are shown as a tabbed navigation menu are shown at the top of the view products page and view addons page. This is a useful alternative way of linking to the various product categories if you decide to disable the cart sidebar. This option can be configured by editing line 38 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartProductsTabs.

For example:

{assign var=itCartProductsTabs value="enabled" scope="global"}

or:

{assign var=itCartProductsTabs value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 3.1: enable or disable currency chooser on all cart pages

This option allows you to choose whether or not the currency chooser button is shown at the bottom of relevant pages (when applicable). This is a useful alternative way of allowing users to change currency if you decide to disable the cart sidebar. This option can be configured by editing line 43 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartCurrencyChooser.

For example:

{assign var=itCartCurrencyChooser value="enabled" scope="global"}

or:

{assign var=itCartCurrencyChooser value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 4.1: Configure the number of products shown per row on the view products page

This option allows you to choose the number of products shown per row on the view products page, choosing between 1 and 6 products per row.

This option can be changed by editing line 48 in the cart-options.tpl file, specifying a value of either 1, 2, 3, 4, 5 or 6 for the variable itCartNumberProductsPerRow.

For example:

{assign var=itCartNumberProductsPerRow value="1" scope="global"}

or:

{assign var=itCartNumberProductsPerRow value="2" scope="global"}

If no value is specified, the default behaviour is 1.

This option was introduced in Simplicity theme version 2.2.0.

Simplicity Slider order form template options

The Simplicity Slider order form template has its own cart-options.tpl file, however these options will only apply to the Simplicity Slider view products page. This is because Simplicity Slider is a child templates of the Simplicity Standard order form template, and all other cart pages are handled by the Simplicity Standard template.

Option 1.1: enable or disable sidebar display on order form / cart pages

This option allows you to choose whether or not the sidebar is displayed on all order form / cart pages. This option applies to large screen sizes / desktop devices and can be changed by editing line 24 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartSidebarDisplay.

For example:

{assign var=itCartSidebarDisplay value="enabled" scope="global"}

or:

{assign var=itCartSidebarDisplay value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 1.2: enable or disable mobile friendly sidebar display on order form / cart pages

This option allows you to choose whether or not the sidebar is displayed on all order form / cart pages. This option applies to small screen sizes / mobile devices and can be changed by editing line 27 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartSidebarMobileDisplay.

For example:

{assign var=itCartSidebarMobileDisplay value="enabled" scope="global"}

or:

{assign var=itCartSidebarMobileDisplay value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 2.1: specify page header text for view products and view addons pages

This option allows you to choose the text that is displayed as the main page header / title on the view products and view addons pages. This option can be configured by editing line 32 in the cart-options.tpl file, specifying a value of either default, category or custom for the variable itCartProductsHeaderText.

For example:

{assign var=itCartProductsHeaderText value="default" scope="global"}

or:

{assign var=itCartProductsHeaderText value="category" scope="global"}

or

{assign var=itCartProductsHeaderText value="custom" scope="global"}

If category is specified, the current product category will be displayed (as defined in wHMCS admin) for the view products page, and the text “Addons” for the view addons page. If custom is specified, you can define custom text to be used in option 2.2 (see below). If default is specified, or no value is specified, the default text will be used – the language variable {$LANG.navservicesorder} – by default in English this would equate to “Order New Services”.

Option 2.2: specify custom page header text for view products and view addons pages

If you have specified the value custom for option 2.1, this option allows you to specify the custom text to be used, by editing line 35 in the cart-options.tpl file and specifying a value for the variable itCartProductsHeaderCustomText.

For example:

{assign var=itCartProductsHeaderCustomText value="My Awesome Products" scope="global"}
Option 2.3: enable or disable product category tabs on view products and view addons pages

This option allows you to choose whether or not the product categories are shown as a tabbed navigation menu are shown at the top of the view products page and view addons page. This is a useful alternative way of linking to the various product categories if you decide to disable the cart sidebar. This option can be configured by editing line 38 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartProductsTabs.

For example:

{assign var=itCartProductsTabs value="enabled" scope="global"}

or:

{assign var=itCartProductsTabs value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Option 3.1: enable or disable currency chooser on all cart pages

This option allows you to choose whether or not the currency chooser button is shown at the bottom of relevant pages (when applicable). This is a useful alternative way of allowing users to change currency if you decide to disable the cart sidebar. This option can be configured by editing line 43 in the cart-options.tpl file, specifying a value of either enabled or disabled for the variable itCartCurrencyChooser.

For example:

{assign var=itCartCurrencyChooser value="enabled" scope="global"}

or:

{assign var=itCartCurrencyChooser value="disabled" scope="global"}

If no value is specified, the default behaviour is disabled.

Customizing Simplicity theme


All of our code is fully open, unencrypted and editable, meaning that should for any reason our products provided as are do not suit your exact requirements, you are free to customise the code as necessary. Whilst you are perfectly welcome to do this, please note that our support team is unable to provide support or assistance with this process. We are only able to provide assistance with the installation, configuration and use of our products as provided in accordance with our theme documentation.

Tip: it’s always a good idea to keep a record of any files that you edit/customize for future reference.

Trouble-shooting and support


If you can’t find a solution to your problem in this theme documentation or our frequently asked questions, please open a support ticket to request technical support.

Changelog and release history


Theme Version Release Date WHMCS Version Compatibility Release Notes
2.23.023 September 20248.11.0-8.11.1Release Notes
2.22.027 April 20248.10.0-8.10.1Release Notes
2.21.013 March 20248.9.0Release Notes
2.20.124 October 20238.8.0Release Notes
2.20.026 September 20238.8.0Release Notes
2.19.14 May 20238.7.2Release Notes
2.19.026 March 20238.7.0-8.7.1Release Notes
2.18.06 November 20228.6.0Release Notes
2.17.114 September 20228.5.0-8.5.1Release Notes
2.17.013 June 20228.5.0-8.5.1Release Notes
2.16.020 January 20228.4.0Release Notes
2.15.228 December 20218.3.1-8.3.2Release Notes
2.15.11 December 20218.3.1-8.3.2Release Notes
2.15.018 October 20218.3.0Release Notes
2.14.210 October 20218.2.1Release Notes
2.14.114 July 20218.2.1Release Notes
2.14.023 June 20218.2.0Release Notes
2.13.419 April 20218.1.2-8.1.3Release Notes
2.13.325 February 20218.1.2-8.1.3Release Notes
2.13.211 February 20218.1.1Release Notes
2.13.123 January 20218.1.0Release Notes
2.13.05 January 20218.1.0Release Notes
2.12.420 November 20208.0.1-8.0.4Release Notes
2.12.324 October 20208.0.1-8.0.3Release Notes
2.12.217 October 20208.0.1-8.0.3Release Notes
2.12.17 October 20208.0.1-8.0.3Release Notes
2.12.029 September 20208.0.0Release Notes
2.11.07 April 20207.10.0 - 7.10.2Release Notes
2.10.113 January 20207.9.0Release Notes
2.10.09 January 20207.9.0Release Notes
2.9.25 October 20197.8.0 - 7.8.3Release Notes
2.9.16 September 20197.8.0 - 7.8.3Release Notes
2.8.023 January 20197.7.0 - 7.7.1Release Notes
2.7.06 August 20187.6.0 - 7.6.1Release Notes
2.6.223 July 20187.5.0 - 7.5.2Release Notes
2.6.18 April 20187.5.0 - 7.5.2Release Notes
2.6.04 April 20187.5.0 - 7.5.2Release Notes
2.5.110 January 20187.4.0 - 7.4.3Release Notes
2.5.018 November 20177.4.0 - 7.4.3Release Notes
2.4.05 October 20177.3.0 - 7.3.1Release Notes
2.3.33 September 20177.2.2 - 7.2.3Release Notes
2.3.24 June 20177.2.2 - 7.2.3Release Notes
2.3.117 May 20177.2.0 - 7.2.1Release Notes
2.3.016 May 20177.2.0 - 7.2.1Release Notes
2.2.01 May 20177.1.0 - 7.1.2Release Notes
2.1.115 January 20177.1.0 - 7.1.2Release Notes
2.1.017 December 20167.1.0 - 7.1.2Release Notes
2.0.219 October 20167.0.1 - 7.0.2Release Notes
2.0.117 October 20167.0.1 - 7.0.2Release Notes
2.0.04 October 20167.0.0Release Notes
1.1.030 September 20166.3.1Release Notes
1.0.121 April 20166.3.1Release Notes
1.0.08 April 20166.3.0Release Notes