eZ Community » Forums » General » ezOnline Editor: Showing Font Awesome...
expandshrink

ezOnline Editor: Showing Font Awesome Custom Tag in Admin

ezOnline Editor: Showing Font Awesome Custom Tag in Admin

Thursday 18 June 2015 10:30:50 am - 3 replies

Hi,

I've created a simple Custom Tag in content.ini to allow the usage of Font Awesome Icons in the Online Editor:

[CustomTagSettings]
AvailableCustomTags[]=fontawesome
IsInline[fontawesome]=true
 
[fontawesome]
CustomAttributes[]
CustomAttributes[]=class

I've also created the template file in ...content/datatype/view/... which works fine outside of the online editor.

<i class="{$class}"></i>

But while editing inside the editor, the custom tag is displayed as a blue block labelled "fontawesome" instead of showing the icon. Is it possible to show the real icon also inside the editor / in TinyMCE ?

Thanks,
Reinhard

 

PS: I'm using the legacy stack

Thursday 18 June 2015 6:53:02 pm

Hello Reinhard,

Unfortunately, this is how custom tags are displayed within the eZ Online Editor.

This is just how this part of eZ Publish Legacy's Online Editor works (at this time).

I hope this helps!

Cheers,
Heath

Friday 19 June 2015 5:11:21 am

The Online Editor is very strict about the HTML format. However, if you are willing to do some extra work, you can use the setting [StylesheetSettings]EditorCSSFileList[] in design.ini.append.php and then use CSS3 selectors like this:

[customattributes*="class|fa-ban"] { style-element: style-value; }

We've done that to achieve some pretty specific styles in the Online Editor.

Bonus trick is that you can use images to represent custom tags in the Online Editor (example: https://github.com/mugoweb/ezoe_smilies) although that's not really a Font Awesome thing.

Tuesday 23 June 2015 2:21:57 pm

Hi Heath and Peter,

thanks for your answers, I've used Peter's CSS idea to display the symbol before the custom tag. Sadly I can't use IsInline=image because CSS :before is not working on <img>, so I'm stuck with IsInline=true and the blue block. But at least there is a visual hint for the editor.

Greetings,
Reinhard

Modified on Tuesday 23 June 2015 2:22:28 pm by Reinhard Hutter

expandshrink

You must be logged in to post messages in this topic!

36 542 Users on board!

Forums menu

Proudly Developed with from