Drupal gère très bien le responsive. Trop bien, même. Un vrai champion dans le domaine... Au point que configurer correctement les styles d'images pour un site complet peut rapidement se transformer en cauchemar.
Le problème est simple : chaque emplacement spécifique d'image sur un site nécessite son propre style d'image, décliné pour chaque point d'arrêt (mobile, tablette, bureau, large, extra-large). Un site avec une dizaine d'emplacements différents, c'est facilement trente ou quarante styles à créer, nommer, configurer, puis relier aux bons modes d'affichage, qui eux-même devront être créés et configurés... Manuellement. Un par un. Un véritable enfer à gérer.
Responsive Builder a été pensé et implémenté pour résoudre cette problématique oh combien complexe. La première étape est de scanner les largeurs de colonnes disponibles pour chaque point d'arrêt du thème sélectionné. Ce scan stocke et sauvegarde les informations sous forme de données exportables.
Par la suite, le développeur peut générer automatiquement tous les styles nécessaires pour un emplacement donné : styles d'images, styles adaptatifs, et mode d'affichage média / contenu, le tout en quelques clics, voire de manière totalement transparente avec le module Single Page.
2 modes d'utilisation
Responsive builder propose 2 modes d'utilisation distincts.
En mode manuel, tu redimensionnes la fenêtre du navigateur et le module capture les largeurs de colonnes au fur et à mesure. Une fois les données récupérées, tu génères tout ce dont tu as besoin en quelques opérations. Tu peux choisir de générer les view-modes, indiquer le ratio image à utiliser, etc.
En mode automatisé, un service intégré s'occupe de gérer tout le processus en arrière-plan. Tu appelles le service dans ton code, il génère les styles sans intervention humaine. C'est ce mode qui est utilisé par le module Single Page pour que les sections/paragraphes utilisent toujours le meilleur format d'imge possible. Pratique pour le générateur de sites : chaque nouveau site a ses styles créés automatiquement au fur et à mesure de la création des contenus.
Bien entendu, le système va toujours tester si les éléments à générer n'existe pas encore, et réutiliser l'existant quand il le peut.
Responsive builder, en quelques points
Génération
Ce qui prenait des heures, en quelques clics
Scan des largeurs de colonnes par point d'arrêt
Génération des styles d'images automatisée
Génération des styles adaptatifs
Liaison directe au mode d'affichage média
Intégration
S'adapte à ton workflow
Mode manuel via interface visuelle
Mode automatisé via service PHP
Intégration native avec le générateur de sites
Compatible avec tous les thèmes Bootstrap
Extensions
Pour aller plus loin
Gestion des ratios d'affichage intégré
Gestion des découpes avec ratio_crop
Sauvegarde des configurations par thème
Activation / désactivation au besoin
Sélection des thèmes disponibles pour la génération
Le résultat
Zéro configuration manuelle
Styles d'images cohérents sur tout le site
Images parfaitement adaptées à chaque point d'arrêt
Performances optimisées : bonnes tailles, bons formats
SEO amélioré : les Core Web Vitals te remercient