Comment utiliser un bloc de fractionnement dans un e-mail
Objectif de cet article
Découvrez comment utiliser un bloc de fractionnement pour disposer du contenu côte à côte dans Klaviyo.
Quand utiliser un bloc de fractionnement
Il existe 3 façons d’organiser du contenu côte à côte à l’aide de l’éditeur d’e-mail de Klaviyo : bloc fractionné, colonnes et bloc de tableau. Chaque option offre certains avantages et compromis. Un bloc de fractionnement est idéal lorsque :
- Vous avez besoin de 2 colonnes et souhaitez contrôler entièrement la largeur de chacune.
- Vous souhaitez placer du texte ou des images côte à côte.
- Vous souhaitez choisir si les colonnes se superposent sur mobile ou restent côte à côte.
En savoir plus sur les blocs de fractionnement, les colonnes et les tableaux dans le graphique ci-dessous.
Mise en page du contenu | Nombre de colonnes | Options de largeur | Types de contenu autorisés | Les colonnes peuvent-elles s’empiler en vue mobile ? |
Bloc de fractionnement | 2 | Contrôle précis (Utilisez Styles > Mise en page) | Image ou texte | Oui |
Colonnes | 1-4 | Sélection limitée | Tout type de bloc de contenu (par exemple, bloc de texte, bloc d’image, bloc de citation d’avis) | Oui |
Bloc de tableau | N’importe quel nombre | Contrôle précis (Utilisez Largeur de colonne > Manuel) | Image ou texte | Non |
Les tableaux peuvent être difficiles à rendre accessibles, car les lecteurs d’écran ont du mal à les analyser.
Ajoutez un bloc de fractionnement à un modèle d’e-mail
Pour utiliser l’empilement mobile et les aperçus mobiles, vérifiez que Optimiser pour mobile est activé dans les paramètres Styles > Optimisation mobile du e-mail.
- Dans un modèle d’e-mail, faites glisser un bloc Fractionnement dans le canevas.

- Sous Sélecteur de colonne, basculez entre les côtés gauche et droit du fractionnement.

- Sous Contenu de la colonne, choisissez si le côté actuellement sélectionné du fractionnement doit contenir une image ou du texte.

- Pour le texte, double-cliquez sur le texte dans le canevas de l’e-mail, puis saisissez votre contenu. Pour une image, utilisez les commandes d’image dans la barre latérale pour sélectionner ou importer une image.
- Répétez le processus pour l’autre côté du fractionnement.
- Ouvrez l’onglet Styles du bloc.

- Sous Mise en page, modifiez Largeur de la colonne 1 ou Largeur de la colonne 2 pour définir les largeurs des colonnes en pourcentages. L’autre colonne s’ajuste automatiquement afin que le total reste à 100 %.
- Définissez Espacement pour ajuster l’espace entre les colonnes en pixels.
- Sous Empilement sur mobile dans l’onglet Styles du bloc, choisissez De gauche à droite ou De droite à gauche pour empiler les colonnes, ou Aucun empilement pour les conserver côte à côte.
- Cliquez sur Aperçu, puis basculez entre Bureau et Mobile pour vérifier les largeurs des colonnes, l’espacement, et l’empilement.
Ressources supplémentaires
- How to build dynamic blocks in a flow email
Learn how to use dynamic table blocks to add product and other event information to your metric-triggered flows. In this article, you'll learn how to create a dynamic block using the example of an abandoned cart reminder showing the products that were left behind.
- How to add columns to an email
Learn how to add columns to your emails when needed to make your templates more aesthetically pleasing. There are a few ways to add columns to your templates. This article will run through all the ways you can add columns to your email and how to optimize your design based on device.