Vous pouvez ajouter une image d’arrière-plan à n’importe quel calque Row, Column, Wrapper ou Hero de votre design d’email : cliquez sur le calque dans Figma, puis sur l’icône + à côté du panneau Fill dans les propriétés Figma du calque, et choisissez le type de remplissage Image. L’exemple ci-dessus le montre sur un calque Column, mais la même méthode s’applique aux calques Row, Wrapper et Hero. Ce remplissage d’image est appliqué comme image d’arrière-plan lorsque le plugin exporte votre email en HTML.

Pour augmenter le contraste entre votre image d’arrière-plan et les calques de contenu, ajoutez une couleur semi-transparente par-dessus le remplissage d’image d’arrière-plan du calque (avec l’icône + à côté du panneau Fill dans les propriétés Figma du calque), réglez ce nouveau remplissage Gradient ou Solid sur la couleur de votre choix, puis ajustez son pourcentage d’opacité (par exemple 35).

Les images d’arrière-plan et les dégradés sont pris en charge sur les calques Row, Column, Wrapper et Hero dans l’aperçu Emailify et les exports rendus en HTML. Si vous exportez la sortie brute mjml ou loops, les attributs d’image d’arrière-plan des Column y sont toujours omis.

Définir une couleur unie de repli derrière votre image d’arrière-plan

Vous pouvez ajouter une couleur de repli personnalisée derrière votre image d’arrière-plan. Elle sera visible pendant le chargement de l’image dans le client de messagerie du destinataire, ou si ce client bloque d’abord l’affichage des images. Pour cela, ajoutez une couleur unie supplémentaire aux Fills de votre calque Row, Column, Wrapper ou Hero qui contient l’image d’arrière-plan en cliquant sur le bouton d’icône +, réglez l’opacité de la couleur choisie sur 100%, puis faites-la glisser en bas de la liste des Fills (sous le remplissage de votre image d’arrière-plan).