Entry types title format preview CKEditor field.

[thomascoppein]

Hi,
I’m trying to hide the Title field for an Entry Type named RichText, which contains a CKEditor field. I’d like to use the content of this CKEditor field as the title for the Entry Type.

For example, given the following CKEditor content:
<h1>My title?</h1><p>My paragraph.</p>

I want the title to be:
My title? My paragraph.

Issues I’m facing:

• The title includes HTML tags (e.g., <h1>, <p>, etc.).
• When using striptags, there are no spaces between the removed tags, resulting in: My title?My paragraph.

Is there a way to achieve this?

[brandonkelly]

You can do that using Symfony’s DomCrawler + CssSelector components.

Run the following CLI command from your project root:

composer require symfony/dom-crawler:"^6.0|^7.0" symfony/css-selector:"^6.0|^7.0"

Then create an _includes/extract-h1.twig template in your templates/ folder, with this code:

{% set crawler = create(
  'Symfony\\Component\\DomCrawler\\Crawler',
  [object.myCkeditorField.getParsedContent() ?? '']
) %}

{% set h1 = crawler.filter('h1') %}

{{ h1|length ? h1.html() : "Entry #{object.id}" }}

(Replace myCkeditorField with the actual CKEditor field handle.)

And finally, set your entry type’s Title Format to:

{% include '_includes/extract-h1.twig' %}

Your existing entries should be resaved automatically via a queue job, and then their titles will be updated with the contents of the first <h1> within your CKEditor field, or Entry <ID> as a fallback.