SupportPal Docs

Plugin Development: Views

Previous Section: Languages

Create your own templates for viewing pages in the plugin.

Contents

Writing Views

Templates are stored in the Views folder. SupportPal uses the Twig template system and all templates should have a .twig file extension. Templates used to show pages in the operator panel should start by extending the operator index template, and it can also set the page title by using the title block. The content block is where you put what you wish to display. Below is an example template which makes uses of all these components.

Views/view.twig

    {% extends 'operator.' ~ template ~ '.index' %}

    {% block title %}
        {{ Lang.get('HelloWorld::lang.hello_world') }}
    {% endblock %}

    {% block content %}
        Your HTML here
    {% endblock %}

Most commonly you will just need the title and content blocks, but other blocks are available to set or fill other parts of the page. A full list of available blocks:

Block name Description
title Sets the page title.
scripts_header Used to add any additional CSS, JS or other assets that should be loaded in the <head> attribute.
header Can be used to replace or extend the page header (navigation bar).
sidebar Lets you add a sidebar, to the left of the content block.
precontent Inserts data before the main content <div> attribute.
description Adds a description below the page title.
content The page content.
scripts_footer Used to add any additional CSS, JS or other assets that should be loaded before the </body> attribute.

Purifying HTML

If you need to display any user submitted content, it is best to purify the HTML to remove the risk of XSS. This can be done with the Purifier.clean method.

{{ Purifier.clean(html_content) }}

Displaying raw HTML

Twig will automatically escape any HTML within a Twig tag. To stop this and display the code as it is, use the raw filter. Be careful to only do this on safe HTML that doesn't contain user submitted content.

{{ html_content|raw }}

Authenticated Operator

The authenticated operator can be accessed with the auth_user function.

{{ auth_user().formatted_name }}

For more information on Twig and our template syntax, please check our Templates guide.

View Names

Once you've written your views and stored them within the Views folder, you can access them with the plugin namespace. For example the file app/Plugins/HelloWorld/Views/settings.twig maps to 'HelloWorld::settings'.

Next Section: Registering Settings