CakeEmail -> impossible d'ajouter une image en background

The-Devil
CakePHP

Bonjour,

Je suis actuellement en train de développer un template email pour cakephp. Sur ce template, j'ai besoin d'afficher une image de header.
Après de longue recherche, la solution que j'ai trouvé est de faire passer mon image en pièce jointe via :

$email->attachments(array('header.png' => array(
        'data' => file_get_contents('chemin/du/fichier'),
'contentId' => 'header_1'
        'mimetype' => 'image/png'
));

Et ensuite de faire référence à l'image via son Content ID comme ceci :

<img src="cid:header_1" style="width:100%;max-height:300px !important;"/>

Pour le moment, c'est la solution que j'utilise. Sauf que ce que je souhaite faire c'est d'afficher l'image en background d'une div.
Voici mon code actuel dans le template html : 

<div style="width:100%;background-image:url(<?php echo $this->Html->url(WWW_ROOT.'img/email/header.jpg', true); ?>);height:300px;background-position: center -100px;"></div>

Le résultat de ce code -> RIEN ?? la div perd tous ses style et s'affiche comme ceci : 

<div></div>

Quelqu'un a déjà rencontré ce problème ? Est-ce qu'il est VRAIMENT impossible de mettre des images dans un email cakephp sans utiliser la solution des pièces jointe ?

Merci d'avance

11 réponses

The-Devil
Auteur
Réponse acceptée

Bonjour,

Pour finir, je garde la solution de base qui est de mettre les images en pièce jointe. Même si elle n'est pas très conseillé, elle fonctionne.
Cordialement,

The Devil

ker0x

Tu peux utiliser le helper Html dans ton template d'email, ça t'évite d'avoir à joindre l'image (ce qui est une très mauvaise pratique).

<?php echo $this->Html->image('email/header.jpg', array('fullBase' => true)); ?>
The-Devil
Auteur

@GyZmO j'ai déjà essayé.. ça ne marche pas =/

Lartak

Bonjour.
Par défaut, la plupart des clients d'email n'affichent pas (ne chargent pas) les images en général, ensuite, pourquoi ne pas directement intégrer du code css dans ton template d'email ?
Que je sache, la plupart des emails reçus avec une mise en page intégrant des images et un style particulier, ont du code css intégré à l'intérieur de ceux-ci (mais je peux me tromper bien sûr).

The-Devil
Auteur

@Lartak11 Tu parles bien du CSS inline ? si oui, c'est exactement ce que je fais. Enfin, que j'essai de faire haha ^^.
Comme dis plus haut, j'essai d'afficher une image ne background d'une div, pour ce faire j'âi éssayé le code suivant :

<div style="width:100%;background-image:url(<?php echo $this->Html->url(WWW_ROOT.'img/email/header.jpg', true); ?>);height:300px;background-position: center -100px;"></div>

Sauf que cela ne donne rien... le client web(gmail) me dit qu'il ne trouve pas la ressource =/

Lartak

Je ne te parlais pas de code css dans une balise, telles que les div et autre, mais dans la balise style :

<style>
h1 {
    ...
}
</style>
The-Devil
Auteur

@Lartak11 ça ne change rien..enfin pire, la div sur laquelle je pose ma classe "background" ne prend pas en compte la class. C'est à dire que dans l'analyse du navigateur ma div apparaît sans le paramètre class.. ??

Lartak

Ce ne serait pas le "client" de messagerie qui échapperait les attributs des balises par hasard ?
Essais d'utiliser la balise header et de lui appliquer le background de ton image dessus pour tester.
Comme ça tu n'utilises pas d'attribut sur une balise.

The-Devil
Auteur

@Lartak11 tu dis comme ceci :

<header style="width:100%;background-image:url('img/email/header.jpg');height:300px;background-position: center -100px;">

Sauf que cela n'a pas marché pour une div, alors pourquoi est-ce que cela marcherait pour l'élément header ?

Lartak

Non, puisque je te disais de tester sans utiliser d'attribut sur les balises.
Exemple :

<style>
header {
    background-image: url("<?php echo $this->Html->url('/img/email/header.jpg', true); ?>");
    height: 300px;
    background-position: center -100px;
    ...
}
</style>
<!-- etc... -->
<header><!-- etc... --></header>
<!-- etc... -->
The-Devil
Auteur

J'ai essayé, ça ne fonctionne pas. L'élément header n'apparaît même pas..