TYPO3 RTE parseFunc to customize links.

Here I had a requirement to add a button style to RTE link. By adding the link class, I was able to add some class to link and able to generate the links like below.

<a herf=”#” class=”btn”>My link</a>

But according the my designer, the link should have a <span> tag inside the <a> tag. It should look like below.

<a herf=”#” class=”btn”><span>My link</span></a>

So, I have used a RTE parseFunc to do this.

Below are the steps.

1. Add the below typoscript in TS template setup.

includeLibs.userFunc= EXT:mycustom_config/Classes/UserFunction/Addspan.php
tt_content.text.20.parseFunc.tags.link {
postUserFunc= user_addSpan->addSpan
postUserFunc{
class = btn
ATagTitle.field = title
}
}

If we use namespaces, we no need to include the php file by using “includeLibs”. In that case, we can call the userfunction directly like below

postUserFunc= Namespace\Myext\UserFunctions\Addspan->addSpan

2.  On file Addspan.php we need to add below code.

<?php
class user_addSpan{
/*
* Adds span inside <a> tag, if the link class ‘btn’ is selected
*/
function addSpan($content,$conf) {
$class = $conf[‘class’];
if (preg_match(‘/class\=”(.*’. $class .’.*)”/i’, $content, $res)) {
$content = preg_replace(‘@>(.*)</a>@i’, ‘><span>$1</span></a>’, $content);
}
return $content;
}
}
?>

In this php function, I am checking for link class “btn” and adding a <span> tag.

That’s it. We can use this technique for generating Record links too, In that case we can generate the typolink to record detail view and replace “href”.

Cheers!