Collection de blocs

Il s’agit d’un ensemble de blocs considérés comme faisant partie du produit AEM et qui sont recommandés en tant que plans directeurs pour les blocs de votre projet.

Ces blocs proviennent de projets AEM de production réels. Pour faire partie de cette collection, un bloc doit être utilisé de manière intensive dans un certain nombre de projets, fournir suffisamment de fonctionnalités abstraites et être suffisamment général pour pouvoir être réutilisé sans avoir à modifier le modèle de contenu sous-jacent.

À mesure que les besoins et les conceptions des sites web changent, la collection de blocs change également. Des ajouts seront effectués pour refléter les nouveaux besoins des projets, mais les blocs qui ne sont pas utilisés assez fréquemment seront également supprimés (obsolète).

Il existe peu de principes techniques pour les blocs de la collection :

  • Intuitif : structure de contenu intuitive et facile à créer
  • Utilisable : aucune dépendance, compatible avec standard
  • Réactif : fonctionne sur tous les points d’arrêt
  • Tenant compte du contexte : hérite du contexte CSS, tel que le texte et les couleurs d’arrière-plan
  • Localisable : aucun contenu codé en dur
  • Rapide : aucun impact négatif sur les performances
  • SEO et A11y: SEO convivial et accessible

Tous les blocs peuvent être considérés comme une base pour votre propre développement de blocs. Il est très probable que vous modifiiez l’ensemble du code .css et .js pour répondre aux besoins de votre projet. La valeur principale de ces blocs est la structure de contenu qu’ils fournissent.

Étant donné que le code de votre bloc sera entièrement adapté à votre projet, il n’est pas prévu que les blocs de la collection soient rétrocompatibles avec leurs versions antérieures respectives ou qu’ils puissent être mis à niveau.

Boilerplate

Les blocs les plus couramment utilisés (ainsi que les types de contenu par défaut) sont traités dans le modèle standard d’AEM et font partie de chaque projet AEM. Pour qu’un bloc devienne un élément standard, il doit être utilisé par la grande majorité de tous les projets AEM.

La base de code de tous les blocs dans AEM Boilerplate est en open source et se trouve sur GitHub adobe/aem-boilerplate

Les blocs dans AEM Boilerplate peuvent être découverts à l’aide de la bibliothèque sidekick ci-dessous. Utilisez le bouton copy pour copier la structure de contenu correspondante dans votre presse-papiers et la coller dans un document pour afficher la structure de contenu.

Titres

Contenu par défaut

Les différents niveaux de titres constituent la colonne vertébrale sémantique de votre document

Texte

Contenu par défaut

Corps de texte ou copie avec options de formatage sémantique riches

Images

Contenu par défaut

Les images animent votre contenu

Listes

Contenu par défaut

Listes ordonnées et non ordonnées où elles sont nécessaires

Liens

Contenu par défaut

Référencer d’autres sites web ou votre propre contenu

Boutons

Contenu par défaut

Boutons d’appel à l’action et plus

Code

Contenu par défaut

Mettre en surbrillance les fragments de code préformatés dans votre contenu

Sections

Contenu par défaut

Regrouper le contenu de votre page en sections

Icônes

Contenu par défaut

Rendre votre contenu plus intéressant avec des icônes

Héros

Bloc

Traitement héroïque en haut d’une page

Colonnes

Bloc

Méthode flexible pour gérer des dispositions à plusieurs colonnes de manière réactive

Cartes

Bloc

Liste des cartes avec ou sans images et liens

En-tête

Bloc

Exemple d’en-tête et de navigation flexible

Pied de page

Bloc

Bloc de pied de page extensible simple

Métadonnées

Ajoutez des métadonnées à votre page si nécessaire.

Métadonnées de section

Mettre en surbrillance ou structurer tout le contenu d’une section

Collection de blocs

La collection de blocs contient des blocs qui sont couramment utilisés, mais qui ne sont pas si courants que cela puisse être considéré comme standard. En règle générale, pour être inclus dans la collection de blocs, un bloc doit être utilisé sur plus de la moitié de tous les projets AEM.

La collection de blocs peut être le chemin d’entrée du code standard. De même, si un bloc de la plaque chauffante n'est plus aussi utilisé, il peut être déplacé vers cette collection.

La base de code de tous les blocs de la collection de blocs AEM est en open source et se trouve sur GitHub adobe/aem-block-collection

Les blocs de la collection de blocs d’AEM peuvent être découverts à l’aide de la bibliothèque du sidekick ci-dessous, utilisez le bouton copy pour copier la structure de contenu correspondante dans votre presse-papiers et la coller dans un document pour afficher la structure de contenu.

Incorporer

Bloc

Un moyen simple d’incorporer du contenu de réseaux sociaux dans des pages AEM

Fragment

Bloc

Partage d’éléments de contenu sur plusieurs pages

Tableau

Bloc

Méthode d'organisation des données tabulaires en lignes et colonnes

Vidéo

Bloc

Affichage et lecture de vidéos directement à partir d’AEM

Accordéon

Bloc

Une pile de libellés descriptifs qui peuvent être basculés pour afficher le contenu complet associé

Chemins de navigation

Bloquer le module complémentaire

Une liste de titres de page et de liens pertinents indiquant l’emplacement de la page active dans le hiérarchie de navigation

Carrousel

Bloc

Outil d’affichage dynamique qui effectue une transition en douceur dans une série d’images avec des options contenu texte

Boîte de dialogue modale

Blocage automatique

Fenêtre contextuelle qui s’affiche sur un autre contenu du site

Citation

Bloc

Affichage d’une citation ou d’une mise en surbrillance d’un passage spécifique (ou « guillemets ») dans une document

Recherche

Bloc

Permet aux utilisateurs de trouver le contenu du site en saisissant un terme de recherche

Onglets

Bloc

Segmenter les informations en plusieurs panneaux étiquetés (ou à onglets)

Formulaire

Bloquer (obsolète)

Ensemble de commandes de saisie regroupées qui permet aux utilisateurs d’envoyer des informations

La collecte de blocs est en constante évolution en fonction des commentaires de la communauté AEM. Si vous pensez qu’un bloc doit être inclus dans la collection de blocs, contactez votre contact AEM. Les candidats actuels à l’inclusion dans la collection de blocs sont les suivants :

  • Bannière de consentement

Si vous avez besoin immédiatement d’un bloc qui ne fait pas encore partie de la collection, il est relativement facile de trouver des projets AEM sur GitHub qui ont des exemples d’implémentation pour tous les candidats ci-dessus.

Blocage de la fête

La partie bloc est un endroit où la communauté des développeurs d’AEM peut présenter ce qu’ils ont créé sur les sites AEM. Il permet également aux autres d’éviter de réinventer la roue et de réutiliser ces blocs/fragments de code/intégrations créés par la communauté et d’ajuster le code selon les besoins pour l’adapter à leurs propres projets. Voir Block Party pour tout ce qu'il a à offrir.

Remarque : bien que nous appréciions et soutenions notre communauté de développeurs AEM, Adobe n’est pas responsable de la maintenance ou de la mise à jour du code présenté dans la partie barrage. Veuillez utiliser le code à votre discrétion.

recommendation-more-help
10a6ce9d-c5c5-48d9-8ce1-9797d2f0f3ec