Gateway portal customization using custom plug-ins

Citrix Gateway RfWebUi framework provides the ability to add the custom plug-ins to customize their gateway portal. These custom plug-ins can be used to add large functionality to the gateway, such as if you want to add an entire new page in the gateway flow. For other use cases the code can be added to the custom script file provided for gateway themes at the location /var/netscaler/logon/themes/<custom_theme>/script.js.

  1. To add a custom plug-in, create the JavaScript file at the location /var/netscaler/logon/LogonPoint/plugins/ns-gateway/. For example, you can find the following plug-ins in /var/netscaler/logon/LogonPoint/plugins/ns-gateway/.

    • ns-nfactor.js

    • nsg-epa.js

    • nsg-setclient.js

    It is recommended to enter the plug-in name in the format <plugin_name>.js.

    All these plug-in files are fetched by the RfWebUI framework required by the functionality.

  2. After creating the plug-in file, use the following code as an example to register the plug-in with the RfWebUI framework.

            (function ($) {
                        CTXS.ExtensionAPI.addPlugin( {
                                    Name : “plugin name”,
                                    initialize: function() {}


    name is the name given to the plug-in. It is used as the identifier to the plug-in.

    initialize takes the function as the parameter which is used to initialize the plug-in.

  3. Enter the plug-in name and initialization function in the CTXS.ExtensionAPI.addPlugin() function to register the plug-in. The added plug-in name and location must be registered to the plugins.xml file at the location /var/netscaler/logon/themes/<custom_theme>/plugins.xml.

  4. After writing the plug-in code, the newly added plug-in name and location must be registered with the plugins.xml file at the location /var/netscaler/logon/themes/<custom_theme>/plugins.xml. The plug-in must be registered with the plug-in tag.

    <plugin name="nsg-epa" src="plugins/ns-gateway/nsg-epa.js"/>
    <plugin name="nsg-setclient" src="plugins/ns-gateway/nsg-setclient.js"/>
    <plugin name="ns-nfactorn" src="plugins/ns-gateway/ns-nfactor.js"/>
  5. Enter a name and src for the plug-in so that RFWebUI can identify and fetch the plug-in.

Example configuration

The following example configurations can be used to add a custom plug-in to add a footer to the Citrix Gateway logon page.

  1. Create the JavaScript plug-in file in the location, /var/netscaler/logon/LogonPoint/plugins/ns-gateway/.
  2. Name the plug-in as ns-footer.js /var/netscaler/logon/LogonPoint/plugins/ns-gateway/ns-footer.js
  3. Add the following code to the registered plug-in to the RfWebUI and in the initialization function add the footer to the gateway.

    (function ($) {
        name: "ns-footer", // Name of plugin - must match name sent in configuration
        initialize: function () {
            CTXS.Extensions.beforeLogon = function (callback) {
                $("#customExplicitAuthBottom").append("<div style='text-align:center;color:white;font-size:15px;'><br>Disclaimer<BR><BR>"+
                    " Access to this website is restricted to employees of Login Consultants<BR></div>");
  4. Save the file.
  5. Add the name and src in the plugins.xml at the location var/netscaler/logon/themes/<custom_theme>/plugins.xml.

    <plugin name="nsg-epa" src="plugins/ns-gateway/nsg-epa.js" />
    <plugin name="nsg-setclient" src="plugins/ns-gateway/nsg-setclient.js" />
    <plugin name="ns-nfactor" src="plugins/ns-gateway/ns-nfactor.js" />
    <plugin name="ns-footer" src="plugins/ns-gateway/ns-footer.js" />
  6. Configure the custom theme for which the plug-in is added.
  7. Flush the cache using the command flush cache contentgroup loginstaticobjects.
  8. Reload the portal screen. The footer is added to the Citrix Gateway login page. Custom portal code
Gateway portal customization using custom plug-ins