-
Arrière-plan (base)
-
Texte primaire (20%) (contrast-20)
-
Texte primaire (50%) (contrast-50)
-
Texte primaire (100%) (contrast)
-
Gris 60 (gray-60)
-
Texte secondaire (contrast-2)
-
Lien (contrast-3)
Démo composants
Palette de couleurs utilisateur
Liste des blocks actifs
-
Paragraphe
Commencer par le bloc formant la pierre angulaire de tout récit.
Rendu du block réel (html) :
Texte basique
Rendu du block réel (html) :
Rendu du block réel (html) :
Texte 1
Rendu du block réel (html) :
Texte 2
Rendu du block réel (html) :
Texte 3
Rendu du block réel (html) :
Texte 4
Rendu du block réel (html) :
-
Titre
Introduisez les nouvelles sections et organisez votre publication pour aider les visiteurs (et les moteurs de recherche) à en comprendre la structure.
Rendu du block réel (html) :
H1 Display
Rendu du block réel (html) :
H2 Display
Rendu du block réel (html) :
H1, Titre 1
Rendu du block réel (html) :
H1, Titre 1 surligné
Rendu du block réel (html) :
H2, Titre 2
Rendu du block réel (html) :
H2, Titre 2 surligné
Rendu du block réel (html) :
H3, Titre 3
Rendu du block réel (html) :
H4, Titre 4
Rendu du block réel (html) :
H4, Titre 4 encadré
Rendu du block réel (html) :
H5, Titre 5
Rendu du block réel (html) :
H6, Titre 6
-
Liste
Crée une liste ordonnée ou non ordonnée (liste à puces).
Rendu du block réel (html) :
- Premier point
- Deuxième point
- Troisième point
Rendu du block réel (html) :
- Premier point
- Deuxième point
- Troisième point
-
Image
Insère une image pour illustrer vos propos.
Rendu du block réel (html) :
Rendu du block réel (html) :
Je suis une légende d'image et j'ai une lightbox -
Audio
Embarque un lecteur audio simple.
Rendu du block réel (html) :
-
Vidéo
Embarquez une vidéo depuis votre médiathèque ou téléversez-en une nouvelle.
Rendu du block réel (html) :
-
Groupe
Rassemblez les blocs dans un conteneur de mise en page.
Rendu du block réel (html) :
Groupe
Rendu du block réel (html) :
Rangée
Rendu du block réel (html) :
Empilement
-
Boutons
Inviter les visiteurs à passer à l’action avec des liens ayant la forme de boutons.
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
-
Colonnes
Affiche le contenu dans plusieurs colonnes, via les blocs ajoutés à chaque colonne.
-
HTML personnalisé
Ajoute du code HTML personnalisé et permet de le prévisualiser en direct.
Rendu du block réel (html) :
-
Recherche
Aidez vos visiteurs à découvrir vos publications.
Rendu du block réel (html) :
-
Code court
Insérer un élément personnalisé additionnel avec un code court WordPress.
Rendu du block réel (html) :
[je_suis_un_shortcode]
-
Icônes de réseaux sociaux
Afficher les liens sur des icônes pointant vers vos profils de réseaux sociaux ou vos sites.
Rendu du block réel (html) :
-
Navigation
Une collection de blocs qui permettent aux visiteurs de faire le tour de votre site.
Rendu du block réel (html) :
-
Logo du site
Afficher une image pour représenter ce site. Mettez à jour ce bloc et les changements s’appliqueront partout.
Rendu du block réel (html) :
-
Titre du site
Affiche le nom de ce site. Mettez à jour le bloc, et les modifications seront appliquées partout où il est utilisé. Il apparaîtra également dans la barre de titre du navigateur et dans les résultats de recherche.
Rendu du block réel (html) :
Site MACIF
-
Titre de la requête
Affiche le titre de la requête.
Rendu du block réel (html) :
Rendu du block réel (html) :
-
Contenu
Affiche le contenu d’un article ou d’une page.
-
Date
Afficher la date de publication d’une publication ou d’une page.
-
Texte indicatif de la composition
Afficher une composition.
-
Accordion
Afficher et masquer du contenu dans une page.
Rendu du block réel (html) :
Lorem ipsum dolor sit amet consectetur adipiscing elit torquent ligula
-
Alerte
Les 'alert' (alertes) sont des messages qui communiquent des informations importantes à l'utilisateur.
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
Rendu du block réel (html) :
-
Breadcrumb
Permet d'indiquer à l'utilisateur la page sur laquelle il se trouve ainsi que la position de celle-ci dans l'arborescence du site.
Rendu du block réel (html) :
-
Callout
Permet d'accentuer un élément du contenu éditorial en le détachant visuellement du reste du contenu.
Rendu du block réel (html) :
Titre du callout Sous-titre du callout
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
-
Chips
Rendu du block réel (html) :
-
Hero
Le hero est au-dessus de la ligne de flottaison. Cette section est essentielle pour capter l'attention ou engager l'utilisateur, elle doit être concise.
Rendu du block réel (html) :
Hero compact
Description. Lorem ipsum dolor sit amet consectetur. Faucibus sagittis varius at mattis malesuada venenatis. Facilisis id consequat nulla eget fusce tristique aenean tellus.
Rendu du block réel (html) :
Hero action
Description. Lorem ipsum dolor sit amet consectetur. Faucibus sagittis varius at mattis malesuada venenatis. Facilisis id consequat nulla eget fusce tristique aenean tellus.
Rendu du block réel (html) :
Hero rich
Description. Lorem ipsum dolor sit amet consectetur. Faucibus sagittis varius at mattis malesuada venenatis. Facilisis id consequat nulla eget fusce tristique aenean tellus.
Rendu du block réel (html) :
Hero rich (variation image gauche)
Description. Lorem ipsum dolor sit amet consectetur. Faucibus sagittis varius at mattis malesuada venenatis. Facilisis id consequat nulla eget fusce tristique aenean tellus.
-
Icône
L'icône a un rôle fonctionnel. Elle permet à l'utilisateur d'effectuer une tâche, ex : télécharger un PDF... (Certains icônes récents ne sont pas encore présents dans le thème).
Rendu du block réel (html) :
-
Picto
Le picto a une utilité graphique et identitaire. Il permet d'illustrer un service, un produit ou une activité (Certains pictos récents ne sont pas encore présents dans le thème).
Rendu du block réel (html) :
-
Articles
Afficher les derniers articles
Rendu du block réel (html) :
Les articles les plus récents
Les bienfaits des jeux vidéos
Bien-êtreAccident de travail : la définition La réglementation encadre la définition de l’accident du travail. Il s’agit d’un accident survenu soudainement à l’occasion ou par le fait du travail, et ce, quelle qu’en soit la cause. L’accident de travail doit remplir deux conditions pour être considéré comme tel : L’accident de travail ne doit cependant […]
Vers qui se tournent les ados ?
Bien-êtreAccident de travail : la définition La réglementation encadre la définition de l’accident du travail. Il s’agit d’un accident survenu soudainement à l’occasion ou par le fait du travail, et ce, quelle qu’en soit la cause. L’accident de travail doit remplir deux conditions pour être considéré comme tel : L’accident de travail ne doit cependant […]
Nouvelles conversations
JeunesAccident de travail : la définition La réglementation encadre la définition de l’accident du travail. Il s’agit d’un accident survenu soudainement à l’occasion ou par le fait du travail, et ce, quelle qu’en soit la cause. L’accident de travail doit remplir deux conditions pour être considéré comme tel : L’accident de travail ne doit cependant […]
-
Push
Mettre en avant un produit, un service ou une information au sein d’une page.
Rendu du block réel (html) :
Les pannes auto,
ça arriveAvec le contrat Macif Pann’Auto, on prend en charge vos réparations.
-
Quote
Composant permettant de mettre en valeur un verbatim ainsi que son auteur au sein d'un paragraphe de texte.
Rendu du block réel (html) :
Je suis le texte de la citation
Je suis l'auteur de la citation
-
Summary
Accéder rapidement aux différentes sections d'une page à l'aide de liens.
Rendu du block réel (html) :
Blocks natifs :
Blocks Macif :
Liste des compositions / patterns
-
Accordion - Droite
Composition contenant un bloc accordéon et du contenu texte
Rendu de la composition (html) :
Questions fréquentes
à propos de votre assurance santéLorem ipsum dolor sit amet consectetur adipiscing elit torquent ligula
Lorem ipsum dolor sit amet consectetur adipiscing elit torquent ligula
Lorem ipsum dolor sit amet consectetur adipiscing elit torquent ligula
Lorem ipsum dolor sit amet consectetur adipiscing elit torquent ligula
Lorem ipsum dolor sit amet consectetur adipiscing elit torquent ligula
-
Contenu article
Contenu type d'un article
Rendu de la composition (html) :
Accident de travail : la définition
La réglementation encadre la définition de l’accident du travail. Il s'agit d'un accident survenu soudainement à l'occasion ou par le fait du travail, et ce, quelle qu'en soit la cause.
L’accident de travail doit remplir deux conditions pour être considéré comme tel :
- le salarié a été la victime d'un fait accidentel survenu dans le cadre de son activité professionnelle ;
- l'accident a entraîné l'apparition d'une lésion physique (brûlure, douleur musculaire, malaise cardiaque, etc.) ou psychologique (exemple : un choc émotionnel consécutif à une agression commise dans l'entreprise).
L’accident de travail ne doit cependant pas être confondu avec l’accident de trajet pour se rendre au travail qui, pour sa part, survient sur le trajet direct entre le domicile et le lieu de travail ou encore entre le lieu de travail et le lieu de restauration habituel et dont les conséquences sont différentes.
Feuille d’accident de travail et déclaration d’accident
La déclaration d’accident de travail doit être remplie par l’employeur et adressée à la CPAM dans les 48 heures, sans tenir compte des dimanches et des jours fériés. Il peut formuler des réserves sur l'accident et notamment sur son caractère professionnel.
Titre du Callout Sous-titre du Callout
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lorem nisl, consequat ut varius tempor, suscipit ac ex. Etiam a tortor dolor.
Source : Prénom Nom et / ou lien
Crédit : Lorem ipsum
-
Contenu éditorial
Contenu éditorial
Rendu de la composition (html) :
Hero rich
Description. Lorem ipsum dolor sit amet consectetur. Faucibus sagittis varius at mattis malesuada venenatis. Facilisis id consequat nulla eget fusce tristique aenean tellus.
Accident de travail : la définition
La réglementation encadre la définition de l’accident du travail. Il s'agit d'un accident survenu soudainement à l'occasion ou par le fait du travail, et ce, quelle qu'en soit la cause.
L’accident de travail doit remplir deux conditions pour être considéré comme tel :
- le salarié a été la victime d'un fait accidentel survenu dans le cadre de son activité professionnelle ;
- l'accident a entraîné l'apparition d'une lésion physique (brûlure, douleur musculaire, malaise cardiaque, etc.) ou psychologique (exemple : un choc émotionnel consécutif à une agression commise dans l'entreprise).
L’accident de travail ne doit cependant pas être confondu avec l’accident de trajet pour se rendre au travail qui, pour sa part, survient sur le trajet direct entre le domicile et le lieu de travail ou encore entre le lieu de travail et le lieu de restauration habituel et dont les conséquences sont différentes.
Feuille d’accident de travail et déclaration d’accident
La déclaration d’accident de travail doit être remplie par l’employeur et adressée à la CPAM dans les 48 heures, sans tenir compte des dimanches et des jours fériés. Il peut formuler des réserves sur l'accident et notamment sur son caractère professionnel.
Titre du Callout Sous-titre du Callout
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean lorem nisl, consequat ut varius tempor, suscipit ac ex. Etiam a tortor dolor.
Source : Prénom Nom et / ou lien
Crédit : Lorem ipsum Les articles les plus récents
Les bienfaits des jeux vidéos
Bien-êtreAccident de travail : la définition La réglementation encadre la définition de l’accident du travail. Il s’agit d’un accident survenu soudainement à l’occasion ou par le fait du travail, et ce, quelle qu’en soit la cause. L’accident de travail doit remplir deux conditions pour être considéré comme tel : L’accident de travail ne doit cependant […]
Vers qui se tournent les ados ?
Bien-êtreAccident de travail : la définition La réglementation encadre la définition de l’accident du travail. Il s’agit d’un accident survenu soudainement à l’occasion ou par le fait du travail, et ce, quelle qu’en soit la cause. L’accident de travail doit remplir deux conditions pour être considéré comme tel : L’accident de travail ne doit cependant […]
Nouvelles conversations
JeunesAccident de travail : la définition La réglementation encadre la définition de l’accident du travail. Il s’agit d’un accident survenu soudainement à l’occasion ou par le fait du travail, et ce, quelle qu’en soit la cause. L’accident de travail doit remplir deux conditions pour être considéré comme tel : L’accident de travail ne doit cependant […]
La Macif est citoyenne
et engagéeLorem ipsum dolor sit amet, consectetur adipiscing elit.
Pellentesque at neque lorem.
Envie de partager votre expérience ou vos conseils ? Devenez contributeur !
Envie de partager votre expérience ou vos conseils ? Devenez contributeur !
Envie de partager votre expérience ou vos conseils ? Devenez contributeur !
-
Infos clés - Horizontal un bouton
Mettre en avant des informations clés au sein d'une page.
Rendu de la composition (html) :
La Macif est citoyenne
et engagéeLorem ipsum dolor sit amet, consectetur adipiscing elit.
Pellentesque at neque lorem.Un contrat association et CSE complet (1) et à tarif avantageux
Lorem ipsum dolor sit amet consectur
Un accompagnement pour une meilleure assurance association
Lorem ipsum dolor sit amet consectur
Des valeurs résolument mutualistes
Lorem ipsum dolor sit amet consectur
-
Login Texte
Affiché lorsqu'un contenu requiert d'être authentifié et que l'utilisateur ne l'est pas
Rendu de la composition (html) :
Bonjour !
Vous êtes sociétaire à la Macif ?Utilisez votre identifiant et votre mot de passe Macif
pour vous connecter
-
Login
Affiché lorsqu'un contenu requiert d'être authentifié et que l'utilisateur ne l'est pas (login wall)
Rendu de la composition (html) :
Bonjour !
Vous êtes sociétaire à la Macif ?Utilisez votre identifiant et votre mot de passe Macif
pour vous connecter
Picture - Droite centrée
Composition contenant un bloc image et du contenu texte
Rendu de la composition (html) :
Des investissements
adaptés à vos besoinsPlus besoin de vous questionner pendant des heures : la répartition de votre épargne sur votre contrat multisupport est adaptée à vos besoins, que vous soyez en recherche de sécurité ou plus dynamique dans vos investissements.
Préfooter - Push
Préfooter contenant un bloc push préconfiguré
Rendu de la composition (html) :
Les pannes auto,
ça arriveAvec le contrat Macif Pann’Auto, on prend en charge vos réparations.
Préfooter - Réseaux sociaux
Préfooter contenant un bloc réseaux sociaux
Rendu de la composition (html) :
Préfooter - WYSIWYG
Préfooter contenant un bloc titre & paragraphe
Rendu de la composition (html) :
Texte emphase
Texte emphase
Rendu de la composition (html) :
Je suis un texte
Texte riche
Texte riche
Rendu de la composition (html) :
Accident de travail : la définition
La réglementation encadre la définition de l’accident du travail. Il s'agit d'un accident survenu soudainement à l'occasion ou par le fait du travail, et ce, quelle qu'en soit la cause.
L’accident de travail doit remplir deux conditions pour être considéré comme tel :
- le salarié a été la victime d'un fait accidentel survenu dans le cadre de son activité professionnelle ;
- l'accident a entraîné l'apparition d'une lésion physique (brûlure, douleur musculaire, malaise cardiaque, etc.) ou psychologique (exemple : un choc émotionnel consécutif à une agression commise dans l'entreprise).
L’accident de travail ne doit cependant pas être confondu avec l’accident de trajet pour se rendre au travail qui, pour sa part, survient sur le trajet direct entre le domicile et le lieu de travail ou encore entre le lieu de travail et le lieu de restauration habituel et dont les conséquences sont différentes.
Vidéo - Gauche centrée
Composition contenant un bloc vidéo et du contenu texte
Rendu de la composition (html) :
Les dernières vidéos
Comment rouler sereinement en camping-car ?
Contenu WYSIWYG
Contenu wysiwyg
Rendu de la composition (html) :
Hero compact
Description. Lorem ipsum dolor sit amet consectetur. Faucibus sagittis varius at mattis malesuada venenatis. Facilisis id consequat nulla eget fusce tristique aenean tellus.
Accident de travail : la définition
La réglementation encadre la définition de l’accident du travail. Il s'agit d'un accident survenu soudainement à l'occasion ou par le fait du travail, et ce, quelle qu'en soit la cause.
L’accident de travail doit remplir deux conditions pour être considéré comme tel :
- le salarié a été la victime d'un fait accidentel survenu dans le cadre de son activité professionnelle ;
- l'accident a entraîné l'apparition d'une lésion physique (brûlure, douleur musculaire, malaise cardiaque, etc.) ou psychologique (exemple : un choc émotionnel consécutif à une agression commise dans l'entreprise).
L’accident de travail ne doit cependant pas être confondu avec l’accident de trajet pour se rendre au travail qui, pour sa part, survient sur le trajet direct entre le domicile et le lieu de travail ou encore entre le lieu de travail et le lieu de restauration habituel et dont les conséquences sont différentes.
Feuille d’accident de travail et déclaration d’accident
La déclaration d’accident de travail doit être remplie par l’employeur et adressée à la CPAM dans les 48 heures, sans tenir compte des dimanches et des jours fériés. Il peut formuler des réserves sur l'accident et notamment sur son caractère professionnel.