How to configure Quark Author to add panes, plugins, widgets, and navigation menu items?

To configure Quark Author to add panes, plugins, widgets, and navigation menu items:

1. Create a folder ext in the directory qaservice in the s3 bucket.

2. Create a folder feature in the folder ext.

3. Create a folder for the feature you want to add in the folder feature and name it with the name of the feature. For example, if you want to add left pane, the folder structure should be – qaservice/ext/feature/left_pane. The folder contains the manifest.json file which lists the metadata for all the modules (plugins, panes, nav menu items, and so on) for that feature. The manifest file has the properties “version” and “modules”. The property “modules” contains the meta for the type of extensibility and has the following attributes:

   1. type: “qa-canvas-plugin” for ck-editor plugin/ “qa-extensible-pane” for the extensible side panes / “qa-nav-menu” for adding navigation menu items, “qa-extensible-toolbar” for adding extensible toolbar.
   2. name: A unique name of the feature. For plugins, the name attribute must match the original name of the plugin.
   3. bundle: The JS bundle location when the feature is a plugin, widget, or a command.
   4. displayName: The name of the plugin icon, the pane heading, or the menu label on the User Interface.
   5. iconUrl: The location of the icon for the panes. This value can be both absolute (http://test.com/icon.png) or relative (/assets/icon.png).
   6. frameUrl: The index URL of the frame in the pane, menu dialog or extensible toolbar on the User Interface. This value can be both – absolute (http://example.com) or relative (frame_data/index.html).
   7. position: The position of a pane (left or right) in the author window.
   8. show: A Boolean value to show/hide the navigation menu options.
   9. action: Name of the action; for example, ckeditor command for actionType command, API endpoint for actionType endpoint. For navigation menu option, when the attribute hasChildren is set to true for an item, you should not specify the property action.
   10. actionType: This attribute specifies the type of action to be performed when you select a navigation menu item.
   11. dialogConfig: This is an optional attribute that specifies the height and width of the dialog box to be opened when you select a navigation menu item. By default, the dimension of the dialog box is 600px X 600px.
   12. showInReadOnly: A Boolean value to show/hide a navigation option when the currently open section is read only.
   13. showInAllSections: A Boolean value to show/hide a navigation option in the all the sections.
   14. menu: This attribute sets the id of the menu where the navigation option should be placed
   15. hasChildren: A Boolean value to specify whether a navigation option has further children item(s) or not.
   16. toolBarHeight: This attribute specifies the height of the extensible toolbar in number of pixels

4. Add the feature name to the “extensions” property array of the file qa-config for that respective content type. When you specify the “panes” property explicitly in the file qa-config, also add the additional pane names to panes array.

5. To configure navigation options that are already available, specify the array type property “navMenus” in the file qa-config, which takes in menu config object with the following properties:

   • id (string): refers to a unique id for a navigation menu option
   • show (Boolean): to hide/unhide the menu option
   • label (string): refers to the new display name for that option

6. When you specify a plugin as a feature that utilizes a User Interface toolbar button, add the toolbar property to specify the toolbar structure and the position of the new button in the qa-config file.

For more information on developing a custom CKEditor plugin, see documentation.