One of the great feautures of Webigniter, is to be able to extend the CMS with your own custom build pages. This is a great way of including your own business specific pages into the CMS. This is an advanced function of Webigniter, so it's wise to read this documentation carefully to avoid security problems.

The general setup of an extension is actually quite simple. You create your own page on your Webigniter webspace, and attach it to the CMS. This page gets a link in the sidebar with the optional user permissions applied. When a CMS user clicks that link a CMS page will appear, with your custom page included. That page will be included providing a hash which you can validate (with a Webigniter client function).

The first thing you need to do is create your own page. This can be anything you want. In our example we will start with a simple 'Hello World' page, just to understand the process.

<?php

echo "Hello World";
?>

We will make this page available on the URL: https://webigniter.net/hello-world-example.

Now that we have our page, it's time to add the CMS extension to the CMS. Login to the CMS with a user which has permissions to create extensions, and click 'Extending'.

If you need to, you can create a permission first to have your extension only enabled for users with your specific permission.

Then click 'Add CMS extension'.
This is where you can specify a name for the extension (we will need this name later on).
The group is the group in the navigation sidebar where the extension should be placed, or you can create a new group. To find the groupname of an existing group, check the source of the navigation sidebar and check the id parameter of the title of the group.
Next you can choose an icon of your choice.
Then you need tot specify the location of the extension, in our example it's https://webigniter.net/hello-world-example.
The last thing we need to do is specify a permission, this can be one of your custom permissions, an existing one, or empty when everyone should be able to access the extension. To find the permission name, go to roles and click a role, then check the source of that page and look for the name attribute of the specific permission toggler. Be carefull not to enter a non-existant permission, otherwise nobody will be able to access the extension.
Then click 'Create'.

Now you will see your extensions in the side navigation (if you have the right permissions), you can click it to see if it works.

In some cases you will get a CORS error, if that's the case, you might need to add this HTTP header to allow cms.webigniter.net to include your page:
X-Frame-Options: "ALLOW-FROM https://cms.webigniter.net/".
If you use the webspace offered by Webigniter, this header is already added.

At this point your page is publicely available to the internet, but we obviously don't want that. We only want to be able to access that page if it's being accessed through the CMS with a user with enough permissions. So we need to add something to our custom page.

<?php
$webigniter = new WebigniterClient(apiKey: 'YOUR_LICENSE_KEY', isWiPage: false);
?>
<div class='content'>
   <?php
   $webigniter->verifyUserSession('YOUR_EXTENSION_NAME');

   echo "Hello World";
   ?>
</div>

As you can see we have initialized a new instance of the Webigniter client, make sure you set the parameter isWiPage to false. Then we run the verifyUserSession method in order to check whether the request is valid. If the check failes, the user won't be able see or use the page. Replace 'YOUR_LICENSE_KEY' and 'YOUR_EXTENSION_NAME' by your license key and the name of the extension you created in the previous step.

We have also added a DIV with the class content, all your visible content should be in this DIV, so Webigniter can calculate the height of your extension and reserve that space in the Webigniter CMS. It's important that your add the verifyUserSession() within this DIV.