Logo Spiria

Concrete 5 • Un CMS convivial

14 mars 2016.

Un des défis auxquels l’intégrateur doit faire face lorsqu’il prépare un site web est de bien choisir le système de gestion de contenu (SGC) qu’il remettra entre les mains de son client. Ce choix de SGC (le vocable anglais est mieux connu : CMS, Content Managing System) doit tenir compte du niveau de connaissance technique des usagers qui auront à s’en servir quotidiennement.

[Mise à jour, juillet 2021. Concrete5 s’appelle désormais Concrete CMS.]

Un des défis auxquels l’intégrateur doit faire face lorsqu’il prépare un site web est de bien choisir le système de gestion de contenu (SGC) qu’il remettra entre les mains de son client. Ce choix de SGC (le vocable anglais est mieux connu : CMS, Content Managing System) doit tenir compte du niveau de connaissance technique des usagers qui auront à s’en servir quotidiennement.

En termes de facilité d’utilisation, tous les CMS ne sont pas égaux et un d’entre eux brille particulièrement sur le plan de l’expérience usager : Concrete5.

D’abord un projet interne ayant débuté en 2003 et dédié aux besoins de leur agence, les deux premiers concepteurs et actuels dirigeants de l’entreprise, Franz Maruna et Andrew Embler, ont rendu disponible la mouture 2009. La popularité du CMS n’a alors pas cessé de croitre et on se targue sur leur page web d’avoir plus de 600 000 sites roulant sous la bannière.

J’ai déjà utilisé à trois reprises le CMS. On pourrait le placer entre le mammouth Drupal et ce drôle d’oiseau qu'est WordPress. Construit en PHP, Concrete 5 suit le modèle de programmation MVC. Comme pour Processwire, le CMS se veut plaisant à utiliser, agréable à programmer et polyvalent sans devoir se casser la tête.

Entre Concrete5 5.6 et 5.7, une cassure

Je me dois cependant d’exprimer tout de suite ma déception lorsque la version 5.7 a été publiée. Celle-ci n’est pas compatible, et ce, pour la première fois, avec les anciennes installations. Autrement dit, un site en 5.6 n’est plus aussi facilement mis à niveau et l’équipe de Concrete5 n’a pas trouvé d’autres excuses que de dire que, si Drupal le fait, on peut bien le faire (les changements apportés à 5.7 étant trop complexes à résoudre pour une vieille installation).

Qu’à cela ne tienne, de nouveaux projets bénéficieront de Concrete5 et voici pourquoi.

Un charme à utiliser

decorative

Une fois connecté à l'arrière-boutique, on est vite charmé par le souci apporté à l'interface. Toute est simple, à la portée d'un clic. L'édition d'une page est aisée. Il suffit d'appuyer sur le bouton Éditer et de survoler les différentes zones d’une page. Concrete5 affichera alors les frontières de la zone et, bien souvent, il nous indiquera que l’on peut déplacer celle-ci. Évidemment, on ne peut déplacer n’importe où. Ces zones sont délimitées par le programmeur du site. Dans l'exemple ci-dessous, je déplace la zone Colonne 1 en-dessous des trois colonnes. La colonne 1 apparaîtra vide par la suite et pourra être comblée par la suite. On peut associer plusieurs blocs à la même région. C'est une grande force de Concrete 5. L'usager peut ainsi manier à sa guise le contenu. Il est possible de contraindre certaines autres, selon les permissions octroyées à l'utilisateur.

decorative

decorative

decorative

Pour éditer le contenu de la zone, on clique sur celle-ci et un menu apparaît. Ce menu sera différent selon le contexte. L'item de base de Concrete 5 est un bloc.

decorative

decorative

Le reste de l’interface d’administration est tout aussi soigné. Le gestionnaire de fichiers est convivial. On nous permet de créer des Collections de fichiers qui pourront, par la suite, être associées à un diaporama, une liste, de repérer facilement telle ou telle photo, etc. De plus, en tout temps, il est possible de cliquer sur un fichier et de le remplacer par un autre sans que les références de celui-ci soient invalidées ailleurs dans le site.

decorative

Le designer et le programmeur auront préparé pour l'usager de multiples modèles. Les noms, les icônes pour représenter ces modèles, le nombre de ces modèles sont à la discrétion des concepteurs. De base, Concrete 5 vient avec quatre modèles. Des icônes peuvent être associées à ces modèles. Encore une fois, tout est conçu pour que l'utilisateur s'y trouve facilement.

decorative

La mise en place des régions dans le code PHP ne rebuffera pas l'intégrateur ou le designer qui aura à modifier les modèles.

Ajouter des pages n’est pas plus compliqué. On se place à l’endroit où on aimerait une page enfant et on appuie sur le symbole +. Si on presse sur ce symbole à partir de la page frontale, ladite page apparaîtra dans le menu général. 

decorative

Programmer Concrete 5

Bien que Concrete 5 peut être prêt à l’emploi en utilisant des thèmes déjà construits, un site Web sera habituellement adapté à l’usage qu’on veut en faire. Pour ce faire, il faudra l’aide d’un programmeur ainsi que que l’apport d’un designer. Concrete 5 n’est pas en reste de ce côté. Un designer peut créer des maquettes HTML que l’intégrateur ou le programmeur découpera par la suite pour les intégrer aux modèles de page. De plus, le programmeur pourra concevoir des blocs, délimiter des zones (areas). Suivant la méthodologie MVC, ces fichiers seront répartis sous le répertoire Application. On peut créer toutes sortes de listes, des menus, rien n'est figé dans le béton! Sky is the limit!

L'exemple ci-dessous est sommaire, mais il décrit bien la philosophie du code. Outre l'inclusion de l'entête et du pied de page, le code active deux régions appelées 'Main' et 'Page Footer'. Ceci est issu du code de base, libre de contruire ici des structures plus complexes et de nommer les zones en conséquence.

<?php
defined('C5_EXECUTE') or die("Access Denied.");
$this->inc('elements/header.php'); ?>
    <main><?php
        $a = new Area('Main');
        $a->enableGridContainer();
        $a->display($c);
        $a = new Area('Page Footer');
        $a->enableGridContainer();
        $a->display($c); ?> </main>
<?php $this->inc('elements/footer.php'); ?>

Une page complète pourrait ressembler aussi à ci-dessous. Dans ce cas, la page est plus statique, le contenu résidant dans la variable $innercontent. 

<?php
defined('C5_EXECUTE') or die("Access Denied.");
$this->inc('elements/header.php'); ?>
    <main>
    <div class="container">
    <div class="row">
        <div class="col-sm-12"><?php Loader::element('system_errors', array('format' => 'block', 'error' => $error, 'success' => $success, 'message' => $message));
            print $innerContent; ?></div>
    </div>
<?php $this->inc('elements/footer.php'); ?>

Une page d'erreur sera très simple à concevoir. À noter la fonction t() (également présente dans Drupal), qui permettra de traduire l'interface.

<?php
defined('C5_EXECUTE') or die("Access Denied.");
$this->inc('elements/header.php'); ?>
<main>
    <div class="container">
        <div class="row">
            <div class="col-sm-9 col-sm-offset-3">
                <div class="jumbo">
                    <h1><?php echo t('403 Error') ?></h1>
                    <p><?php echo t('You are not allowed to access this page.') ?></p>
                </div>
            </div>
        </div>
    </div>
</main>
<?php $this->inc('elements/footer.php'); ?>

La documentation sur le site de Concrete 5 est complète et surtout claire ! L’API de Concrete 5 y est fort bien décrite, ce qui est une bouffée d’air frais quand on vient de Drupal !

Puisqu’on est dans le MVC, il va sans dire que le CMS peut très bien rouler des applications faites sur mesure.

Concrete 5 n’est pas tout à fait gratuit

Si le CMS est en code libre, on s’apercevra vite que la plupart des modules conçus pour lui ne le sont pas. Le modèle d’affaires adopté privilégie la responsabilité des programmeurs plutôt que le soutien d’une communauté de bénévoles programmeurs. Les modules sont affichés dans un magasin Concrete 5. D’ailleurs, il faut s’inscrire à la communauté Concrete 5. Autrement dit, pour se procurer des modules, il faut montrer patte blanche. Une fois inscrit (c’est gratuit), on a accès aux modules. Certains sont tout de même gratuits, mais la plupart sont sous licence. L'ajout de modules demeure peu onéreux, surtout pour un site moindrement complexe. Toutes les solutions PHP gratuites existantes peuvent très bien s'intégrer à Concrete 5. Cela ne revient pas, au final, très cher, et ce système permet d’obtenir un support généralement très rapide de la part du développeur de l’extension.

decorative

Le designer aimera également la possibilité de peaufiner directement un bloc à même le CMS. Chaque bloc possède des boutons de propriétés CSS au nombre de six (police, image de fond, bordure, positionnement (marges extérieure et intérieures), effets CSS3, ajout de classes supplémentaires). De petits ajustements individuels sont ainsi possibles sans devoir faire appel au programmeur.

decorative

Conclusion

Concrete 5 est, comme Processwire, un CMS polyvalent, très bien conçu. J’ai eu, par le passé, quelques soucis avec la rapidité. Les concepteurs ont travaillé fort pour résoudre des problèmes de performance en améliorant le système de mise en cache. Je n’ai pas testé plus qu’il ne le faut la version 5.7 à ce niveau. Sur mon poste, en développement, les multiples composantes UX jQuery étaient parfois un peu poussives. J’ai cependant testé la même interface sur un site démonstrateur et je n’ai pas observé la même latence.

J’étais déjà bien content avec l’interface de 5.6. Les multiples ajouts faits dans 5.7 sont les bienvenus, mais il n'était pas nécessaire, à mon avis, de devoir couper la chaîne avec la précédente version. Je me dois encore de répéter que la cassure dans le développement faite entre les deux versions est décevante. D’ailleurs, deux mondes existent en ce moment dans le magasin de Concrete 5. Le monde avant 5.7 et le monde après. Ceux qui ont développé en 5.6 doivent retourner auprès de leurs clients et leur expliquer qu'ils devront débourser pour passer à l'autre version s'ils en éprouvent le besoin. Il est clair que cette "cassure" ne se reproduira plus. Les concepteurs ont voulu marquer un grand coup en instaurant l'expérience usager, et ils ont gagné leur pari.

Concrete 5 est une coche au-dessus de Processwire en ce qui a trait à l’adaptation à la volée de pages web. Il offre une expérience utilisateur des plus « confortable » (très user friendly). Un beau petit bijou de CMS qui mérite qu'on s'y attarde.

Vidéo officielle