Opened 9 years ago

Last modified 9 years ago

#12937 confirmed Task

Document hidpi, and more details about icons in general

Reported by: Chris Graham Owned by:
Priority: Normal Milestone:
Component: Documentation & Samples Version:
Keywords: Cc:


(This replaces #12932, which got messy)

Currently implementing hidpi is not documented. This ticket will try and describe what specifically needs documenting. My notes will be broader than hidpi, as I think more can be written about icon referencing in general.

To implement hidpi, hidpi:true needs setting on the plugin definition. This works in tandem with the 'icons' plugin definition property, telling ckeditor to automatically reference for the plugin's images/hidpi/example.png instead of the plugin's images/example.png. Explain that CKEditor is declarative in this way, and uses convention-over-configuration, it doesn't/can't/won't do filesystem searches or have any separate icon registry for plugins, apart from automatic insertion of reference to sprites for those plugins built in via CKBuilder.

It should mention that icons are always implemented using a background-image inline style, not using stylesheets or srcset. This confused me a lot, because you actually detect hidpi in JavaScript and set CKEDITOR.env.hidpi globally, which is an unusual (but effective) approach.

Following on from this, a plugin that sets a button icon via addButton (rather than the 'icons' plugin property), can look at CKEDITOR.env.hidpi to set the hidpi image path as needed.

Change History (1)

comment:1 Changed 9 years ago by Jakub Ś

Component: UI : ToolbarDocumentation & Samples
Status: newconfirmed

NOTE from #12932.

  1. Please add hidpi : true to plugin definition (​!/api/CKEDITOR.pluginDefinition-property-hidpi).
  2. Create hidpi folder inside icons folder.

To get better idea what I'm talking about, please see ​ and ​

Note: See TracTickets for help on using tickets.
© 2003 – 2022, CKSource sp. z o.o. sp.k. All rights reserved. | Terms of use | Privacy policy