Customize a knowledge base theme

BasePress comes with few themes to choose from. To change the theme used by the plugin go to BasePress->Settings->Aspect and select the theme you want to use from the menu.

BasePress was also designed to give you full control on the look of your knowledge base by allowing you to customize any of the already present themes or by creating your own with simple templates.

BasePress themes are composed of template files that determine the look of the different pages in the knowledge base.
For instance there is a template used to:

  • display the list of your Knowledge Bases,
  • one to show the list of the sections in the chosen Knowledge Base,
  • one for displaying a list of articles for a single section,
  • the templates to display articles
  • etc.

Every theme also has the necessary css file to style the look of the knowledge base and a function.php file in case you need to further customize its behaviour.

All the files that make up a BasePress theme are grouped in a folder with the name of the theme. All default themes can be found inside the plugin files under the folder “themes”.
To customize any of the templates or extra files follow these steps:

  1. Open your WordPress theme folder
  2. Create a new folder called ‘basepress’
  3. Create inside the ‘basepress’ folder a new folder with the name of the knowledge base theme you want to customize
  4. Copy the file you want to customize from the original theme folder that you can find inside the plugin
  5. Paste the file in the new ‘basepress’ folder you created
  6. make any changes you need to the newly created file

We can go through an example to make this process clearer.

Let’s suppose you are using the ‘Default’ theme and you want to change the css file to give a different look to your knowledge base.
You would need to open your WordPress theme folder which is located at wordpress-folder/content/themes/your-theme-folder.
Then you will create a new folder called ‘basepress’ and inside of it create a new folder called ‘default’

You now need a copy of the original css file for the Default theme:
Open the plugin folder which is located at wordpress-folder/content/plugins/basepress/themes/default/css/style.css
You can copy the file and paste it inside the folder we created previously in your WordPress theme respecting the folder structure it is present in the original theme:
This means that you need to create a ‘css’ folder in your new theme and place inside of it the style.css file. The structure of the folder would look like this:

wordpress-folder/content/themes/your-theme-folder/basepress/default/css/style.css

You can now modify this file at will and it would immediately be applied to your knowledge base.
Changing files in this way will guaranty that any of your changes will remain in place when the plugin gets updated.
If your main WordPress theme would receive updates as well it is important that you create a child theme and place the ‘basepress’ folder in the child theme. This will avoid your customization to be removed when your main WordPress theme gets updated. Informations on how to create a WordPress child theme can be found here: https://codex.wordpress.org/Child_Themes.

When you want to customize a theme it is useful to use a plugin that helps you find out which template is used for any given page. A very recommended plugin for anything related to troubleshooting WordPress sites is Query Monitor. Once installed you will find a new menu item on your WordPress admin bar with many useful information. When you visit any Knowledge base page you can click on Query Monitor menu and under ‘Template’ see which template was used and where it is located.

Was this helpful?