Issue/request: icon in link

[madeinnature]

Hello,
THX for the great extension!
I would like to have the ability to use icons in links.
If I now link a text that contains an icon, the following happens:
<a href="t3://page?uid=1">Sed cursus turpis </a><span class="fa-solid fa-arrow-down-to-square" data-iconfig="fa6p:solid,arrow-down-to-square"></span><a href="t3://page?uid=1">vitae tortor</a>
Of course, it would be desirable for the icon to be included within the a-tag.
Even if it is not particularly user-friendly, I would also appreciate the ability to link an icon by itself.

[DirkPersky]

He,

This issue is becouse to the span tag.

I tested your extension today and it looks interesting.
If you woud develop your extension further the next LTS Version.
I maybe would deprecated my https://extensions.typo3.org/extension/rte_ckeditor_fontawesome/ for it.

[stephankellermayr]

@DirkPersky

Yes, you could actually be right: The behaviour is somehow related to the span tag. However, I haven't yet found out exactly how to fix it.

And yes, I will definitely continue to develop this extension. However, I would be happy if other capable developers could participate in this project, because it is a relatively high effort alone, and as you know, there is little to no budget for open source projects.

In any case, I welcome your interest in the extension and would be happy if we could work together here, especially since your extension was also a certain inspiration for me (or rather its lack of functionality).

[DirkPersky]

@stephankellermayr

your welcome.

If u change back the span to the i Tag it works.
But im sure you had a reason to use the span Tag.

I created my extension on the reasone there was no alternative in the store and be happy there will be an alternative 👍

[stephankellermayr]

@DirkPersky Strictly speaking, the use of the i tag is semantically incorrect and the span tag should always be used for icons.
Nevertheless, it does not really solve the underlying problem in depth, because there are also iconpacks (e.g. iconpack_typo3) that come completely without a webfont and only use SVG graphics. In this case, an img tag is used in the CKEditor5, which does not allow embedding in a link, just like the i tag.

It is therefore actually a problem of the TYPO3 link plugin, which treats all of these elements as independent elements and excludes them from the link.

I'm afraid I won't be able to solve the problem on the part of Iconpack, because the bug should actually be fixed in the link plugin.

[ftrojahn]

Is there any news on this?

As workaround we found to be working: putting an icon within some text, set a link around and then delete the text before and after the icon.

<p><a class="external-link-new-window" href="https://www.domain.tld" target="_blank" title="Link öffnen">Link-Text</a></p>

<p><span class="fa-x-twitter fab" data-iconfig="fa6:brands,x-twitter"></span><a class="external-link-new-window" href="https://www.domain.tld" target="_blank" title="Link öffnen">Link-Text mit Icon vorn</a></p>

<p><a class="internal-link" href="t3://page?uid=238378">Link-Text&nbsp;<span class="fa-anchor-circle-check fas" data-iconfig="fa6:solid,anchor-circle-check"></span> Icon in der Mitte</a></p>

<p><a class="external-link-new-window" href="https://www.domain.tld" target="_blank" title="Link öffnen"><span class="fa-x-twitter fab" data-iconfig="fa6:brands,x-twitter"></span></a></p>

But this isn't so nice to explain to editors.

Does a forge issue already exist for that, or, is there an idea, how to patch/fix the typo3-link.ts?

[stephankellermayr]

@ftrojahn Hi and thanks for your feedback on this topic! As far as I know, there is no forge issue yet. At the moment, it is not clear to me how the problem could be solved. I have already been in contact with the people concerned, but there has been little feedback even from them.

[ftrojahn]

Ok, thanx. Our workaround seems to work only, if netresearch/t3x-rte_ckeditor_image is installed and configured.

Couldn't this eventually make sense: have a link field in the RTE dialog box for inserting the iconpack icon? So inserting the link markup would be completely handled here and not by the core ...

Or is this completely "unthinkable" ;)

[stephankellermayr]

Well, I don't think that would really solve the underlying problem, and would only be a workaround for the case where you just want to link the icon. But as soon as you mark text with an icon (or whatever) and want to link it, this unfortunately doesn't help.

Furthermore, even this solution would only partially solve the problem, because ultimately the CKEditor5 (or its upcast/downcast) decides how the generated HTML is structured (even before saving).

We should therefore rather focus on the question of why the CKEditor interrupts the link or does not display it correctly.