README

This extension adds a placeholder wizard to CKEditor.

Installation

1. Install the extension with composer from

composer req brosua/ckeditor-placeholder

1. Add a preset for rte_ckeditor or override the default one (as below). Add the placeholder plugin to the toolbar and configure the options.

<?php
// EXT:my_ext/ext_localconf.php`
$GLOBALS['TYPO3_CONF_VARS']['RTE']['Presets']['default'] = 'EXT:my_ext/Configuration/RTE/Default.yaml';

# EXT:my_ext/Configuration/RTE/Default.yaml
imports:
  # Import default RTE config (for example)
  - { resource: "EXT:rte_ckeditor/Configuration/RTE/Default.yaml" }
  # Import the placeholder plugin configuration
  - { resource: 'EXT:ckeditor_placeholder/Configuration/RTE/PlaceholderPlugin.yaml' }

editor:
  config:
    toolbar:
      items:
        - '|'
        - placeholder
    placeholder:
      options:
        - label: 'Placeholder foo'
          value: 'bar'

1. Enable RTE config preset (e.g. default)

# Page TSConfig
RTE.default.preset = default

1. Include extension typscript

2. Create a event listener to add custom placeholders

<?php

declare(strict_types=1);

namespace Vendor\MyExt\EventListener;

use Brosua\CkeditorPlaceholder\Event\RteReplacePlaceholderEvent;
use TYPO3\CMS\Core\Attribute\AsEventListener;


#[AsEventListener(
    identifier: 'my-ext/rte-replace-placeholder',
)]
class RteReplacePlaceholderListener
{
    public function __invoke(RteReplacePlaceholderEvent $event): void
    {
        $key = $event->getPlaceholderKey();
        if ($key === 'bar') {
            $event->setContent('My custom content');
        }
    }
}

Warning

You have to deal with caching issues yourself, e.g. when using the logged in user name as placeholder value.