Fonto Content Quality

This package provides all generic logic and UI building blocks for implementing Content Quality into the Fonto editor.

It runs a check on all documents and all changes, splits the (changed) content into, by default, block level chunks and sends them to the Content Quality backend. The results can be visualized in the content using squiggles and/or in a list view in a sidebar.

Installation instruction

  • Add the add-on to the editor.

  • (Recommended) Add the following toolbar configuration to your masthead review tab:

    JavaScript

    <FxOperationMastheadButton
	operationName="toggle-content-quality"
/>

  • Create the editor specific package <editorName>-content-quality and add the dependency to your editor config/fonto-manifest.json.

  • Configure the packages (See configuration chapter).

  • Configure the Content Quality Server URL to use, using one of the following options:

    • Configure a Fonto CMS Connector proxy in config.json (for fontoxml-dev-server), or in your CMS's proxy routing, for example a proxy to https://content-quality-app.company.com.

  • Build & deploy.

Configuration

All labels, names, and configuration in these examples can be changed to suit your use-cases. Some code snippets are partial, and should be wrapped in proper modules with the correct dependencies, or supplement existing configuration.

(Optional) Editor and schema specific configuration

Add the following configuration to config/configuration.js:

JavaScript

configurationManager.set('content-quality-configuration', {});

See the add-on's documentation for the supported properties.

Annotation types

  • In <editorName>-content-quality/src/install.js add: `javascript import registerAnnotationTypes from './api/registerAnnotationTypes.jsx';

    Other

    	export default function install() {
		registerAnnotationTypes();
	}
	```

  • In <editorName>-content-quality/src/api/registerAnnotationTypes.jsx add export default function registerAnnotationTypes() {} and add the calls to contentQualityManager.registerAnnotationType(). See the add-on's documentation for the supported options.

Operations

You can use generic Content Quality operations for most annotation actions. See the add-on's documentation for the built-in operations.

For cases where you need to write an operation with a custom-mutation, you can use the content-quality-get-context-node-id-and-range transform operations as the first step. This operation expects an annotationId to be set, and sets the contextNodeId and range in the operationData to be used in the next operation step(s).

You can also configure fixed sidebar items which are shown above the annotation list in the Content Quality sidebar.

In <editorName>-content-quality/src/api/registerAnnotationTypes.jsx add the calls to contentQualityManager.registerAnnotationType(). See the add-on's documentation for the supported options.