Extending the Client Portal

Customize your Jetpack CRM Client Portal with your own tabs or content.

This guide shows you how to create a simple custom plugin that extends the Client Portal with new sections, giving you greater flexibility and control over what your customers see.

Important: the example provided below is for developers and is offered as-is.
Our support team cannot assist with custom code implementations as it goes beyond the scope of our support.

Also, please note that this feature requires the Client Portal Pro extension.

Client Portal customization overview

The content below provides an example of how to build a custom WordPress plugin that adds extra tabs (or endpoints) to your Client Portal and display unique content in those new sections.

You can also download the example files here to use as a starting point:

Download: my-client-portal-extension.zip

Once downloaded, you can install and activate this plugin as you would any other WordPress plugin.

How the plugin works

The example plugin uses three main files:

1. my-client-portal-extension.php
2. endpoints/class-my-client-portal-extension-endpoint.php
3. templates/my-client-portal-extension-template.php
   

You can add as many endpoint files as needed to the endpoints folder — each one represents a new tab in your Client Portal.

Important note: after adding new endpoints, you must refresh your WordPress rewrite rules. To do this, go to Settings → Permalinks and click Save Changes.

1. The main plugin file

The main plugin file’s role is simple: it tells Jetpack CRM where to find your new endpoint classes.

File: my-client-portal-extension.php

<?php
/*
Plugin Name: My Client Portal Extension
Plugin URI: https://jetpackcrm.com
Description: Extend Jetpack CRM's Client Portal with custom tabs.
Version: 1.0
Author: Jetpack CRM
Author URI: https://jetpackcrm.com
Text Domain: zero-bs-crm
*/

add_action( 'jpcrm_client_portal_register_endpoint', function( $client_portal ) {
	$client_portal->add_endpoint_class_folder( plugin_dir_path( __FILE__ ) . 'endpoints' );
} );

This code registers your custom endpoints folder with the Client Portal so your new tabs can load correctly.

2. The endpoint file

An endpoint defines the data and behavior of a new tab in the Client Portal — including its slug, title, icon, menu order, and associated template.

Each endpoint should be defined as a class implementing the Client_Portal_Endpoint interface, with at least one required method: register_endpoint().

Key Requirements

• The filename should start with class- and end with -endpoint.php.
• The class name must match the file name (e.g., class-other-client-portal-extension-endpoint.php → Other_Client_Portal_Extension_Endpoint).
• Each endpoint needs a unique slug.
• You can reuse templates for multiple endpoints if needed.
• The namespace must be Automattic\JetpackCRM.

File: endpoints/class-my-client-portal-extension-endpoint.php

<?php
/**
 * My Client Portal Extension Endpoint
 *
 * @package Endpoints/My-Client-Portal-Extension
 * @author  Jetpack CRM
 * @version 1.0
 */

namespace Automattic\JetpackCRM;

if ( ! defined( 'ZEROBSCRM_PATH' ) ) exit;

class My_Client_Portal_Extension_Endpoint extends Client_Portal_Endpoint {

	public static function register_endpoint( $endpoints, $client_portal ) {
		$new_endpoint = new My_Client_Portal_Extension_Endpoint( $client_portal );

		// Define endpoint properties
		$new_endpoint->portal                       = $client_portal;
		$new_endpoint->slug                         = 'my-client-portal-extension';
		$new_endpoint->name                         = 'My Client Portal Extension';
		$new_endpoint->hide_from_menu               = false;
		$new_endpoint->menu_order                   = 999;
		$new_endpoint->icon                         = 'fa-plus';
		$new_endpoint->template_name                = 'my-client-portal-extension-template.php';
		$new_endpoint->default_template_path        = plugin_dir_path( __FILE__ ) . '../templates/';
		$new_endpoint->add_rewrite_endpoint         = true;
		$new_endpoint->should_check_user_permission = true;
		$new_endpoint->hide_from_settings_page      = false;

		$endpoints[] = $new_endpoint;
		return $endpoints;
	}
}

This class defines a new tab in the Client Portal called “My Client Portal Extension” with its own icon and template.

3. The template file

The template file controls what content appears inside your new tab.
It uses the standard Jetpack CRM portal structure, including navigation and footer elements.

File: templates/my-client-portal-extension-template.php

<?php
/**
 * My Client Portal Extension Template
 *
 * @package Templates/My-Client-Portal-Extension
 * @version 1.0
 */

if ( ! defined( 'ABSPATH' ) ) exit; // Prevent direct access

global $zbs;
$portal = $zbs->modules->portal;

do_action( 'zbs_enqueue_scripts_and_styles' );
?>

<div class="alignwide zbs-site-main zbs-portal-grid">
	<nav class="zbs-portal-nav">
		<?php $portal->render->portal_nav('my-client-portal-pro-extension'); ?>
	</nav>

	<div class="zbs-portal-content">
		<h2>My Client Portal Extension</h2>
		<div class='zbs-entry-content' style="position:relative;">
			<p>This is my <strong>awesome</strong> Client Portal Extension!</p>
		</div>
	</div>

	<div class="zbs-portal-grid-footer">
		<?php $portal->render->portal_footer(); ?>
	</div>
</div>

You can find more example templates in the /modules/portal/templates/ folder of Jetpack CRM.

To customize your own, copy a template from that folder and modify it as needed.

4. Result

Once installed and activated, your new tab will appear in the Client Portal menu.
It should look something like this: