October Richeditor Snippets

• Introduction
• Usage
• Example usage for Rainlab Syntax Fields
• Example usage for Rainlab Pages Content Blocks
• Example usage in fields.yaml
• Passing extra parameters

Introduction

For more information about snippets, please refer to the official documentation.

Back in the days, snippets were a feature introduced by the RainLab Pages plugin. Unfortunately, they were only usable in RainLab Pages itself, not in other plugins.

This plugin was created in order to add the ability to use snippets (supports partial and component based snippets) in any richeditor.

As of October 3.4 release, snippets are now part of the core and, just like this plugin, available on all RichEditors.

In most cases, users can migrate to the native snippets feature instead of using this plugin, but there is still one reason that may make you need this plugin: AJAX handlers. In the native snippets feature, you need to include the components of every snippet in the layout, hope there is no name conflict between them, and this will not work if your AJAX handler uses a property (it will run with the values from the component, not the ones set in the snippet). You will also run into issues if the same snippet is included multiple times.

Usage

Install this plugin. If your October core version is lower than 3.4.0, also install RainLab.Pages. Then, wherever you want to display a richeditor, apply the parseSnippets filter. Note that you don't need to chain it with |raw, |links or |content, as this plugin will take care of running them.

{{ myRichEditorContent | parseSnippets }}

In the backend editor settings, you will need to add snippets to the list of "Toolbar buttons".

Example usage for Rainlab Pages Syntax Fields

Option 1 (offset to variable)

{variable type="richeditor" tab="Content" name="text" label="Text"}{/variable}

{{ text | parseSnippets }}

Option 2 (wrap in {% apply %} or {% filter %})

{% apply parseSnippets %}
    {richeditor tab="Content" name="text" label="Text"}{/richeditor}
{% endapply %}

Example usage for Rainlab Pages Content Blocks

{% apply parseSnippets %}
    {% content 'company-details.htm' %}
{% endapply %}

Note this method is useful if you are including a third party component that will output the content of a richeditors, but you don't want to override its partial.

For example if you are using a richeditor with Rainlab.Blog, you may want to include the component as follows in your CMS page:

{% apply parseSnippets %}
    {% component 'blogPost' %}
{% endapply %}

Example usage in fields.yaml

If you do not set toolbarButtons you will not need to add snippets to the list. Please see example below when customization is required.

html_content:
    type: richeditor
    toolbarButtons: bold|italic|snippets
    size: huge

Pass extra parameters

If needed, you can pass extra parameters to your snippets from your theme like this:

{{ text | parseSnippets({context: 'foo'}) }}

{% apply parseSnippets({context: 'foo'}) %}
    {richeditor name="text" label="Text"}{/richeditor}
{% endapply %}

You will then be able to access context as if it was a component property using $this->property('context').

Contributors

• Tough Developer: creator of the original version
• inetis (current maintainer)
• All Contributors