Retour d'expérience sur le CMS Bolt

Fabien

Fabien, Architecte web 21 avril 2017

Bolt est un CMS créé en 2013, qui en est maintenant à sa troisième version majeure. Il est basé sur le micro-framework Silex ainsi que sur différents composants Symfony.
A partir de la version 3, Bolt nécessite au minimum la version PHP 5.5.9 et supporte pleinement PHP 7.

Ce CMS utilise aussi des composants open source et propose un catalogue d’extensions pour ajouter des fonctionnalités plus spécifiques, même si ce dernier est déjà bien complet.

Les librairies tierces utilisées par BOLT :

  • Doctrine DBAL for database access and abstraction
  • Twig the flexible, fast, and secure template engine
  • Guzzle HTTP client
  • Bootstrap HTML, CSS, and JavaScript framework
  • Font Awesome iconic font and CSS toolkit
  • jQuery a fast, small, and feature-rich JavaScript library
  • Magnific Popup a responsive lightbox & dialog script
  • CodeMirror a versatile text editor implemented in JavaScript
  • CK Editor a clean HTML5 WYSIWYG editor
  • Pseudo-latin Lorem Ipsum dummy-texts are generated by Loripsum.net

Bolt CMS, comme tout CMS, permet d’accélérer le développement d’un backend complet avec la gestion du CRUD pour de nombreux types de contenus.

Gestion du contenu

bolt backend

Sur la partie Backend ont peut gérer le contenu via les contenttype. Ils se définissent en yml sur un fichier de config contenttype.yml. Un exemple de contenttype :


pages:
    name: Pages
    singular_name: Page
    fields:
        title:
            type: text
            class: large
            group: content
        slug:
            type: slug
            uses: title
        image:
            type: image
        teaser:
            type: html
            height: 150px
        body:
            type: html
            height: 300px
        template:
            type: templateselect
            filter: '*.twig'
    taxonomy: [ groups ]
    recordsperpage: 100

Dans notre contenttype on défini le nom du type de données, les champs du type de données auxquels on assigne un type (text, slug, image, html, …) et ses paramètres.

Beaucoup de champs sont disponibles par défaut et il est possible d’en ajouter via les extensions ou d’en développer de nouveaux.

Les champs disponibles de base : text, slug, textfield, html, markdown, image, imagelist, select, integer, float, checkbox, date, datetime, file, filelist, geolocation (avec preview google map), video (avec preview), templateselect, repeater, hidden.

Le champ de type repeater permet de répéter un groupe de champs graphiquement ainsi que de gérer l’ordre d’affichage.

bolt repeater

En plus de cette définition de base on peut créer des relations entre contenttype, définir un template par défaut de détail ou de listing, donner un statut de publication par défaut ainsi qu’un ou des groupes de taxonomy et bien plus encore préciser dans la documentation qui est assez complète.

Les taxonomy, éléments présents sur la plupart des CMS, sont aussi gérés par Bolt. Exemple de définition de taxonomy :


tags:
    slug: tags
    singular_slug: tag
    behaves_like: tags
    postfix: "Add some freeform tags. Start a new tag by typing a comma or space."
    allow_spaces: false
    #listing_template: tag-listing.twig #custom template

groups:
    slug: groups
    singular_slug: group
    behaves_like: grouping
    options: { main: "The main group", meta: "Meta group", other: "The other stuff" }
    has_sortorder: true

categories:
    name: Categories
    slug: categories
    singular_name: Category
    singular_slug: category
    behaves_like: categories
    multiple: true
    options: [ news, events, movies, music, books, life, love, fun ]

Chaque groupe de taxonomy peut être configuré pour que chacun ait un fonctionnement bien distinct :

  • système de tags (relation et attribution multiple)
  • insérer un contenu dans un groupe (attribution unique)
  • attribuer une ou des catégories prédéfinies

Les templates

bolt front

Sous BOLT les templates sont créés via TWIG, langage de templating utilisé par défaut sur le framework Symfony, et peuvent soit être liés à des contenttype ou rester indépendants.

Les templates sont rangés dans un dossier thème qui est renseigné dans la configuration générale. Pour des sites génériques on peut donc facilement passer d’un thème à un autre.

Le contenu d’un dossier thème reste assez classique avec des dossiers pour chaque type d’assets (CSS, images, JS), un dossier partials contenant les template twig réutilisables, un dossier source dans lequel on peut placer tous nos assets SCSS avant compilation, et enfin, à la racine, les templates twig correspondant à nos pages.

Les développeurs bénéficient ainsi d’une grande souplesse tout en gardant une bonne organisation de leurs fichiers.

Gestion des fichiers / images

Bolt contient un gestionnaire de fichiers pour les éditeurs de contenu très complet avec une nouveauté intéressante: stack, qui affiche une pile des derniers fichiers uploadés.

On peut configurer les dimensions par défauts des images souhaitées :


thumbnails:
    default_thumbnail: [ 160, 120 ]
    default_image: [ 1000, 750 ]
    quality: 80
    cropping: crop
    notfound_image: view/img/default_notfound.png
    error_image: view/img/default_error.png
    save_files: false
    allow_upscale: false
    exif_orientation: true
#    browser_cache_time: 2592000

La gestion des images inclut une gestion des miniatures très efficaces pour les développeurs qui permet en utilisant par exemple le code ‘{{ thumbnail(record.image, 400, 320) }}’ de générer des images avec une taille fixe à la volée (générées lors du premier appel puis réutilisées pour les suivants).

Le multilingue

Le CMS n’intègre pas aujourd’hui en natif le fait de créer du contenu multilingue. Une extension a été développée pour permettre de passer d’une langue à une autre sur l’édition de contenu. Malheureusement les autres extensions ne sont pas forcément compatible avec l’extension BOLT Translate.

De même, l’extension d’i18n n’est pas compatible avec toutes les fonctionnalités de Bolt provoquant quelques erreurs.

Les extensions

Comme vu précédemment, BOLT permet de développer et d’installer des extensions pour étendre les fonctionnalités du CMS. Mais attention, les extensions ne sont pas forcément compatibles entre elles et peuvent ne pas fonctionner avec les dernières versions de BOLT.

Une liste d’extensions utiles :

  • Bolt translate : pour avoir du contenu multilingue
  • Bolt forms : permet de gérer ses formulaires via une configuration et de personnaliser facilement leurs templates
  • Bolt SEO extension : ajout d’un champ de type SEO qui permet de personnaliser ses metas selon le contenu avec une preview.

bolt seo

  • MenuEditor : Permet de gérer graphiquement les menus
  • DragSort : Ajoute la possibilité de trier son contenu avec un drag and drop
  • Bolt Labels : Pour le multilingue, nécessite de placer un label dans le template et permet de renseigner ses traductions depuis le backoffice via un tableau.

bolt labels

  • Google Tag Manager + Google Analytics

L’ensemble des extensions sont disponibles à cette adresse : https://market.bolt.cm/

Création d’extension locale

L’ajout de fonctionnalités à son projet Bolt passe par la création d’extension locale.

Les extensions locales permettent facilement de :

  • Ajouter des tags Twig
  • Ajouter des Hooks dans les templates
  • Créer des champs personnalisés utilisables dans les contenttypes
  • Créer des thèmes
  • Ajouter des gestionnaires de fichiers qui supportent différents systèmes de fichiers
  • Ajouter un générateur de thumbnail personnalisé


Bolt propose aux développeurs des starters d’extensions qui permettent de démarrer rapidement leur développement. Par la suite, il ne vous restera plus qu’à proposer votre extension locale sur le market bolt !

Conclusion

D’après mon expérience acquise en développant un projet avec ce CMS, Bolt est adapté pour les projets mis en place par des développeurs expérimentés sur le langage PHP. Son évolutivité, sa base sur Silex et Twig, sa documentation et ses fonctionnalités de base permettent de créer rapidement un projet avec des fonctionnalités basiques.

Par contre, il peut paraître un peu austère niveau ergonomie et UI car les interfaces restent classiques et n’utilisent pas de chargement AJAX qui le rendrait plus moderne.

Le CMS Bolt est en développement constant et ne devrait que s’améliorer. Sa base assez épurée donne une impression de légèreté que l’on ne retrouve plus sur de nombreux CMS PHP.

Articles récents
Tous nos articles
Livre blanc e-commerce B2B
Découvrez notre livre blanc e‑commerce B2B