ed3 / ckeditorfa Goto Github PK
View Code? Open in Web Editor NEWckeditor fontAwesome plugin
License: GNU General Public License v3.0
ckeditor fontAwesome plugin
License: GNU General Public License v3.0
I use the ckeditorfa plugin for fontawsome 6 pro in a Symfony 5.4 project, with webpack and only some icons are showing in the plugin... Brands icones are there, no regular icon, just small squares and some few Solid icons are visible, the rest is smal squares too.
If I insert a icon, then it works, my system knows them, in the ckeditor text zone, I seen them, just NOT in the "fontawsome chooser" plugin...
Any ideas why it is like this?
php.7.4
symfony 5.4.4
fontawesome-pro: 6.1.0
In plugin.js you use
CKEDITOR.plugins.add('ckeditorfa',{icons:'ckeditorfa',.....
This mixes up with FA5 and FA4 - can You rename ckeditorfa to ckeditorfa6 so that the name of the plugin is not the same!
When using ckeditor and ckeditorfa5 in 2 inputs, if the plugin was used in one of them, then in the second it is no longer possible to select an icon from the list.
Windows 10
ckeditor 4.14
ckeditorfa version from March 25, 2020
Google Chrome 80
The class .fa is defined in a global context, not in a specific Id or class.
This affects all .fa classes used in the same html page!
So, to constrain your .fa definition without to affect all the page, I modified your css file in adding '.cke_dialog_ui_vbox_child a span' before .fa.
.cke_dialog_ui_vbox_child a span.fa {display:inline-block;font:normal normal normal 14px/1 FontAwesome;font-size:inherit;text-rendering:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:inherit;cursor:pointer}
.cke_dialog_ui_vbox_child a span.fa:before {color:inherit}
Hope you will modify this in a next upgrade of your plugin ;)
Can You please add a license (MIT GPL Apache) to Your reopsitories. In some countries no license means that the use is prohibited
I have the problem that both FA4 and FA5-version parallel under ckeditor 4.14 make ckeditor white...
FA5 alone functions, after i imported free all.min.css to ckeditorfa.css (otherwise no icons).
Evtl the conflict-detection.min.js of fa5.13 may help ?
( Fa 5 parallel with FA4 from Michael Jena functions, but then 30% of the icons of FA4 are missing in the editor)
Hi Ed3,
Thanks for a cool plugin! Unfortunately, I experience some issues with it and hoping you know how to help it. :)
The plugin is displayed correctly, but it won't allow me to select icons. I get a following error:
ckeditorfa.js?t=L7C8:3 Uncaught TypeError: Cannot read properties of undefined (reading 'getElementsByTagName')
at klick (ckeditorfa.js?t=L7C8:3)
at HTMLAnchorElement.onclick (VM211 test.php:1)
klick @ ckeditorfa.js?t=L7C8:3
onclick @ test.php:1
I've tried to rename plugin to ckeditorfa from ckeditorfa5, which didn't help.
It is not possible to delete the icon added to the text. It is possible to delete the icon only with the Reset button if the icon has been added recently when editing text
Hi there,
i got some issues, when using your plugin.
I added the ckeditorfa5
to the extraPlugins
and additionally had to add it to the toolbar
, then it showed up. The contentsCss
is configured as well.
Now I can see all icons, but when I search for chevron
, the icons won't come up in the result. And I don't know how to add the icon to my content. Clicking on the icon or ok won't pass it to the editor.
Any help on that?
Anyways, thank you for developing this addon!
Uncaught TypeError: Cannot read property 'icons' of null
at CKEDITOR.resourceManager. (ckeditor.js:271)
at CKEDITOR.resourceManager. (ckeditor.js:270)
at e (ckeditor.js:265)
at Array.x (ckeditor.js:265)
at w (ckeditor.js:265)
at ckeditor.js:266
Added in config.js:
config.extraPlugins = 'ckeditorfa5';
Best regards,
Peter
For accessibility, I added one line for onOk:function () in ckeditorfa.js:
icon.setAttribute('aria-hidden', 'true');
As mentionned here: https://fontawesome.com/how-to-use/on-the-web/other-topics/accessibility
It would be cool if the aria-hidden attribute is included in the next update ;)
Thanks
When trying to select a colour in the popup I get this error: getColorFromDialog is not a function
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.