Theme development

WP Customer Area has been built with modularity in mind. If you have some basic knowledge about WordPress theme development, you will find here some useful information to customize your private dashboard.

Theme supports

WP Customer Area provides a list of theme_supports. Please check the add_theme_support function documentation for more details.

Custom stylesheets

Tells WP Customer Area that this theme is providing its own stylesheet (will hide CSS settings from the plugin options page). This will disable the WP Customer Area skins.

add_theme_support( 'customer-area.stylesheet' );

Custom navigation menu

Tells WP Customer Area that this theme is already outputting the WP Customer Area navigation menu (will hide automatic navigation menu printing settings from the plugin options page).

add_theme_support('customer-area.navigation-menu');

Custom single templates

Tells WP Customer Area that this theme is providing single post templates for private content and containers (will disable the settings linked to ‘single post footer’ for the given post types).

add_theme_support('customer-area.single-post-templates', array(
    'cuar_private_file',    // Customize display in file single-cuar_private_file.php
    'cuar_private_page',    // Customize display in file single-cuar_private_page.php
    'cuar_conversation',    // Customize display in file single-cuar_conversation.php
    'cuar_project',         // Customize display in file single-cuar_project.php
    'cuar_tasklist',        // Customize display in file single-cuar_tasklist.php
));

Alternate custom single templates

Since 7.2.0

Sometimes you will need some more complex hierarchy for your single templates. That’s why we introduced the ability for you to create some others templates. When you’ll display a single private page, WP Customer Area will atempt to find theses templates in your theme folder, in the following order :

  1. single-cuar_private_file-test.php
  2. single-cuar_private_file.php
  3. cuar-single.php
  4. cuar.php
  5. single.php

Note : In this example, we assumed that the current private file had “test” as a slug.

Grabing the whole area with a single function

Since 7.2.0

Custom single templates were initially designed to let you build your own unique design, so you had to use all our different function to display the menu, the sidebar, the footer, etc..

However, some of you were needing to use some custom single templates, just to create a special full-width templates that should looks like the page template, so we introduced a new function that you can use on your custom single templates that will print the whole area at once. This function is called cuar_the_single_content(); and should be use instead of the_content(); in one of the following template :

  • single-cuar_private_file-test.php
  • single-cuar_private_file.php
  • cuar-single.php
  • single.php

Note : In this example, we assumed that the current private file had “test” as a slug.

Custom pages templates

Since 7.2.0

Like for custom single templates, we introduced the ability for you to create different templates files in your theme folder. When you’ll display a standard listing private page, WP Customer Area will atempt to find theses templates in your theme folder, in the following order :

  1. page-dashboard.php
  2. page-550.php
  3. cuar-page.php
  4. cuar.php
  5. page.php

Note : In this example, we assumed that the current private file had “test” as a slug and 550 as ID.

Custom librairies

Tells Customer Area that this theme is already providing its own styles and javascript files for the jquery.select2 library (otherwise, this library’s files would be taken from the Customer Area plugin folder).

This is also a way to disable those libraries if you want to use an alternative. In that case, you should also take care to write the corresponding javascript code and include the proper files (JS/CSS). For instance, the following line tells the plugin that we will take care of including the files required for the jQuery Select2 script. However, the plugin is still responsible for writing the markup to enable the jQuery Select2 library on the appropriate elements.

add_theme_support('customer-area.library.jquery.select2', array('files'));

If we want to disable jQuery Select2 and replace it with our own alternative, we should tell the plugin that not only we don’t want it to include the files, but also that we don’t want it to output any related markup.

add_theme_support( 'customer-area.library.jquery.select2', array( 'files', 'markup' ) );

Other libraries that may be also disabled/taken care of. If we don’t specify an array as a parameter, the plugin assumes that the theme is taking care of everything for that library (files, markup, …).

add_theme_support('customer-area.library.bootstrap.dropdown');
add_theme_support('customer-area.library.bootstrap.transition');
add_theme_support('customer-area.library.bootstrap.collapse');

Hint: Check the file /plugins/customer-area/src/core-classes/plugin.class.php at the function enable_library to get a full list of librairies used by WP Customer Area.