DSFR for Drupal - Picker

Provides 2 new types of fields allowing the selection of icons and pictograms from the "Design Système de l'État" (DSFR (in French)).

For each field instance, you can choose which category of icon (or pictogram) to activate.
Each field instance can be configured to limit the selection to one or more specific categories of icon (or pictogram).

It is also possible to insert icons and pictograms directly from CkEditor.
Fully compatible with CKEditor, providing two additional buttons in the editor toolbar for inserting icons and pictograms.

Icon and pictogram detections are automatic, there is no additional action when you update the DSFR library!

A sub-module also allows the contribution of personalized pictograms via a new media type "Pictogram", created automatically when the sub-module is installed.

Third-party library

This module integrates the https://fonticonpicker.github.io/ (using jQuery) library.

How to install

Manual installation

1. Download the library from https://fonticonpicker.github.io/
2. Place the library in the root libraries folder (/libraries/fonticonpicker).

Composer-based installation

Method 1 - using composer-merge-plugin (recommended)

This method has the advantage of placing the maintenance of the plugin version on the hands of the module maintainers. To add the composer-merge-plugin, run
composer require wikimedia/composer-merge-plugin.

Then, update the extra section of the root composer.json file as follows:

    "extra": {
        "merge-plugin": {
            "include": [
                "[web-root]/modules/contrib/dsfr4drupal_picker/composer.libraries.json"
            ]
        }
    }

Replace [web-root] with the value of your web root folder (usually web).
Run composer require drupal/dsfr4drupal_picker fonticonpicker/fonticonpicker,
the FontIconPicker library will be installed to the libraries folder automatically.

Method 2 - using a custom repository

Copy the following into the root composer.json file's repository key.

    "repositories": [
         {
            "type": "package",
            "package": {
                "name": "fonticonpicker/fonticonpicker",
                "version": "v3.1.1",
                "type": "drupal-library",
                "dist": {
                    "url": "https://github.com/fontIconPicker/fontIconPicker/releases/download/v3.1.1/fontIconPicker.zip",
                    "type": "zip"
                },
                "require": {
                    "composer/installers": "~1.0 || ~2.0"
                }
            }
        }
    ]

Run composer require drupal/dsfr4drupal_picker fonticonpicker/fonticonpicker, the FontIconPicker library will be installed to the libraries folder automatically as well.

A requirement message popup in status report if library is not correctly installed.

Suite of modules

This module is part of a set of projects to implement DSFR (in French) in Drupal.

It is strongly recommended to use this module in addition to the base DSFR for Drupal theme.

Useful links

• Icon documentation (in French)
• Pictogram documentation (in French)