Tout le monde sait comment faire une newsletter. Beaucoup de gens savent comment créer des chaînes de déclenchement. Quelqu'un sait comment créer une newsletter à partir du flux RSS d'un blog. Nous avons dû creuser plus profondément, car nous voulions que notre newsletter ne soit pas simple, mais belle et détaillée. Après tout, il est issu d'un blog intéressant, sur lequel nous avons également consacré beaucoup d'efforts.
Pour chaque détail d'une lettre simple, j'ai dû me battre avec ce mignon singe. Tout a fonctionné. Nous vous expliquons comment.
Mailhimp est un service d'interface en langue anglaise et parfois illogique. Mais il sait combien et est si populaire que des instructions méticuleuses ont été écrites pour lui sur la manière de fournir du contenu aux lecteurs de toutes les manières possibles.
Nous avons également choisi Mailhimp pour nos articles de blog PromoPult. L'une des fonctionnalités de Mailhimp est les campagnes automatiques. Vous pouvez planifier des envois réguliers, des lettres individuelles, mettre en place des lettres de bienvenue et bien plus encore.
Cette histoire concerne la configuration de la publication automatique des articles de blog. Un condensé de matériel frais au courrier de l'abonné une fois par semaine.
L'option standard pour la liaison automatique et pourquoi elle ne nous convenait pas
Mailhimp lui-même a une excellente documentation sur toutes les fonctions, et spécifiquement à ce sujet aussi: Partagez vos articles de blog avec Mailchimp . Des traductions en russe peuvent également être trouvées, à des degrés divers d'adéquation.
En bref, ce dont vous avez besoin pour créer un lien automatique:
- Créez un flux RSS distinct pour MailChimp (ou même ne créez pas, mais utilisez un flux standard).
- Créez une campagne, spécifiez la source, configurez les conditions d'envoi.
- Créez et sélectionnez un modèle.
- C'est fait. Tu es incroyable!
Ce qui ne nous convenait pas, c'est qu'il est tout simplement impossible d'ajouter nos propres choses.
Il existe des données de base du flux RSS que Mailhimp comprend:
- Informations de base sur le flux (titre, lien, description, date de constitution ou de mise à jour du flux) -
*|RSSFEED|*
. - Lien vers un post-tag séparé
*|RSSFEED:URL|*
, examine le <link>
à l'intérieur du <item>
(ci-après). - Le titre d'un seul article est le tag
*|RSSITEM:TITLE|*
, regarde <title>
. - Date de publication d 'un seul post - tag
*|RSSITEM:DATE|*
, regardez <pubDate>
. - Annonce textuelle d'un post-tag séparé
*|RSSITEM:CONTENT|*
, regardez <description>
, si ce tag n'est pas dans <item>
- MailChimp regarde <content:encoded>
. Vous pouvez utiliser des balises HTML à l'intérieur.
- Le contenu complet d'une seule publication est la balise
*|RSSITEM:CONTENT_FULL|*
, examine <content:encoded>
. - Image d'un article, souvent un aperçu ( vignette en termes WordPress) - tag
*|RSSITEM:IMAGE|*
, regarde <media:content>
et n'oubliez pas les tags et attributs supplémentaires pour les pièces jointes média : marquages d'âge, informations sur le fichier lui-même et ainsi de suite.
Et nous avons des choses supplémentaires dans un article séparé:
- Compteur de commentaires
- Voir le compteur;
- Comme compteur
- Je veux montrer la date de publication de l' article au format humain : premièrement, en russe, avec déclinaison et si l'article a été publié cette année - ne pas afficher l'année de publication (maintenant tout fonctionne dans le blog, en lettres je veux la même attention aux détails) ;
- Couverture de poste personnalisée séparée, que vous devez en quelque sorte atteindre;
- Catégorie avec un lien vers tous les articles de la catégorie.
Et vous ne pouvez pas mettre cela dans un flux RSS régulier - il n'y a pas de balises correspondantes. Les balises MailChimp personnalisées ne comprennent pas et ne doivent pas être blâmées pour cela. Nous devons chercher une solution qui conviendra à tout le monde et qui ne cassera pas.
Les données qui doivent être affichées sur une carte postale distincte dans le modèle de résumé sont liées à l'apparence. Le dessinateur a dessiné, le typographe a beaucoup souffert et a composé la lettre.
Carte postale du blog PromoPult dans le résumé hebdomadaire
Comment nous avons résolu le problème
Créer des flux RSS
La première chose à faire est de créer un flux RSS distinct pour MailChimp. Il existe déjà plusieurs flux similaires sur le blog PromoPult: pour les pages Yandex.Zen et Turbo .
Vous pouvez créer un nouveau flux via add_feed () . Voici le code dans le fichier de fonction du thème:
functions.php:
add_action( 'init', 'customRSSforMC' ); function customRSSforMC() { add_feed( 'mchimp', 'customRSSforMCFunc' ); } function customRSSforMCFunc() { get_template_part( 'rss', 'mchimp' ); }
Dans la ligne n ° 7 get_template_part ( 'rss', 'mchimp' );
- indique que le modèle du flux se trouve à la racine du dossier de thème et s'appelle rss-zen.php
.
Après avoir créé le fichier et ajouté la fonction, vous devez aller dans le panneau d'administration de WordPress, les paramètres de la CNC: "Console → Paramètres → Permaliens" et cliquez sur le bouton "Enregistrer les modifications" afin que WordPress mette à jour les paramètres d' /feed/URL
et s'ouvre à l' /feed/URL
donnée /feed/URL
dans le premier paramètre de la ligne n ° 4. nouveau flux RSS.
Vous devez le faire une fois lors de la création de la bande.
Voir notre exemple: https://blog.promopult.ru/feed/mchimp
À l'intérieur de la bande
À l'intérieur du flux lui-même se trouve une boucle de publication WordPress régulière: query_posts () . Cela vous permet de sélectionner et de filtrer les publications de manière très flexible: comme si vous configuriez des catégories individuelles, des pages avec des sélections, des archives et tout ce dont vous avez besoin pour les publications WordPress.
Mais avant d'arriver à la solution parfaite au problème, il y a eu plusieurs tentatives pour entasser les données importantes pour l'écriture dans les conceptions standard des flux RSS et les utiliser dans MailChimp.
Par exemple, il y avait une telle option pour le compteur de commentaires :
<item> [...] <title><?php the_title_rss(); ?></title> <link><?php the_permalink_rss(); ?>?utm_source=newsletter</link> // 1, <?php if (get_comments_number() >= 1) { ?> <commentsCounter><?php comments_number('0', '1', '%'); ?></commentsCounter> <?php } ?> [...] </item>
Cette option fonctionne bien sûr en termes de données: tout ce qui est nécessaire est obtenu et correctement affiché. Mais MailChimp ne comprend pas la <commentsCounter>
, comme toutes les autres balises non standard.
Aussi, par exemple, avec des dates. MailChimp a sa propre balise: *|RSSITEM:DATE:d/m/y|*
, et vous pouvez lui passer des options de formatage de date . Mais, malheureusement, dans la lettre, cela n'a pas l'air humain du tout. À propos de la traduction de la date en général, vous ne pouvez pas parler.
Un autre problème est les images. Vous avez souffert et composé votre belle écriture. Vous devez afficher une photo. Dans le modèle d'e-mail, vous procédez comme suit:
<img src="*|RSSITEM:IMAGE|*" alt="*|RSSITEM:TITLE|*" />
Mais l'analyseur MailChimp peut venir casser la mise en page, en ajoutant ses propriétés, classes et autres codes à la <img ... />
image <img ... />
.
Astuce. Si vous utilisez un flux et des balises standard, n'oubliez pas d'activer la case à cocher « Redimensionner les images du flux RSS conformément au modèle » dans les paramètres de la campagne:
Conclusions intermédiaires: quelque chose ne va pas, les options standard ne suffisent pas, la lettre est terrible et pas humaine. Les données non standard ne peuvent pas être affichées.
Faire une feinte avec nos oreilles: tout marquer nous-mêmes
Si rien de standard ne peut être fait dans le flux RSS pour que l'analyseur de service MailChimp le comprenne correctement, vous pouvez transférer le morceau de code balisé et plié terminé pour la carte postale simplement dans la
<description>
<item>
distinct dans le flux.
Il n'y a qu'un inconvénient distinct: tous les styles d'écriture doivent être alignés, c'est-à-dire que tout ce qui est décrit via .class
se transforme en styles avec l'attribut style=”...”
.
<!-- : --> <style> .post-meta { Margin: 8px 0; } .post-category { border-radius: 3px; border: #adb2b2 1px solid; color: #adb2b2 !important; border-bottom: #adb2b2 1px solid !important; padding: 2px 6px; font-size: 13px; line-height: 13px; Margin: 0 8px 0 0; } </style> <div class="post-meta"> <a href="https://blog.promopult.ru/category/seo" target="_blank" class="post-category">SEO: </a> </div> <!-- : --> <div style="Margin: 8px 0;"> <a href="https://blog.promopult.ru/category/seo?utm_source=newsletter" target="_blank" style="Margin: 0 8px 0 0; border: #adb2b2 1px solid; border-bottom: #adb2b2 1px solid !important; border-radius: 3px; color: #adb2b2 !important; font-size: 13px; line-height: 13px; padding: 2px 6px; text-decoration: none;">SEO: </a> </div>
Pour la mise en page des lettres de blog, «Pechkin» a été utilisé - un collecteur de modèles de lettres qui recueille une lettre à partir de blocs et intègre les styles lui-même. Vous pouvez également utiliser le style de ligne en ligne, par exemple, Premailer.io .
Une boucle de flux est disponible dans le modèle de flux RSS. Par conséquent, vous pouvez tout tirer et façonner à votre guise et selon vos besoins.
La première approche de la solution était partielle: laisser le titre, l'URL, les balises de description brève en standard, mais les méta-informations de publication: les vues, les mentions J'aime, les commentaires, la catégorie et la date de publication devraient être formés en tant que code HTML distinct et insérés dans l'emplacement de balisage souhaité.
Cette option a également dû être abandonnée en raison d'une mise en page cassée et d'un manque de contrôle sur la mise en page et les styles d'image. Et transférez plus tard tout le balisage du bloc de carte postale à la <description>
.
<?php while (have_posts()): the_post(); ?> <item> <description><![CDATA[ <div class="post-card"> <?php if ( get_post_meta($post->ID, 'imga', true) ) { ?> <div class="post-card__img"> <a href="<?php the_permalink(); ?>?utm_source=newsletter" target="_blank"> <img src="<?php echo $postImg[0]; ?>" alt="<?php the_title(); ?>"> </a> </div> <?php } ?> <div class="post-card__info"> <h2> <a href="<?php the_permalink(); ?>?utm_source=newsletter"><?php the_title(); ?></a> </h2> <p> <a href="<?php the_permalink(); ?>?utm_source=newsletter"> <?php if ( !empty( get_post_meta($post->ID, 'intro', true) ) ) { echo get_post_meta($post->ID, 'intro', true); } else { $content = get_the_content(); $trimmed_content = wp_trim_words( $content, 12, '...' ); echo $trimmed_content; } ?> </a> </p> <div> <p> <?php if (get_the_date('Y') == date('Y')) { the_time('j F'); } else { the_time('j F Y'); } ?>, <?php $categories = get_the_category(); if( $categories[0] ) { echo '<a href="' . get_category_link($categories[0]->term_id ) . '?utm_source=newsletter">'. $categories[0]->name . '</a>'; } ?> <?php if(function_exists('the_views')) { ?> <span> <span> <img src="icon-views.png" alt=" "> </span> <span class="item__text"><?php the_views(); ?></span> </span> <?php } ?> <?php if (function_exists('get_simple_likes_counter')) { if (get_simple_likes_counter( get_the_ID() ) >= 1) { ?> <span> <span class="item__icon"> <img src="icon-like.png" alt=" "> </span> <span><?php echo get_simple_likes_counter( get_the_ID() ); ?></span> </span> <?php } } ?> <?php if (get_comments_number() >= 1) { ?> <span> <span> <img src="icon-comments.png" alt=" "> </span> <span><?php comments_number('0', '1', '%'); ?></span> </span> <?php } ?> </p> </div> </div> </div> ]]></description> </item> <?php endwhile; wp_reset_query(); ?>
Il n'y a pas de styles en ligne dans l'exemple de code pour que tout soit net. La version combat de la bande est fournie avec un balisage et des styles complets.
Toutes les adresses des graphiques dans l'exemple sont également simplifiées. Dans la version combat, toutes les images, icônes, photographies et tout ce qui est important pour l'écriture sont téléchargés vers le panneau d'administration MailChimp via Content Studio , et les modèles utilisent déjà l'adresse complète pour les attributs src-
des src-
<img />
.
Dans les lignes n ° 20-24, nous sélectionnons la version du texte-annonce (intro) de l'article. Si la coutume est remplie dans les propriétés de publication dans des champs arbitraires de l'enregistrement - get_post_meta () , puis affichez-la, si elle n'est pas là, montrez ce qui se trouve dans get_the_content () .
Sélectionnez également une image de couverture. Nous avons deux photos associées à l'article: un petit aperçu (affiché dans la carte postale sur la page principale) et une couverture de l'en-tête du message. Prenez une grande couverture.
Un exemple d'en-tête avec un arrière-plan dans un article de blog PromoPult
Étant donné que tout cela se produit dans le cycle WordPress standard, toutes les méthodes de tri sont disponibles. Par exemple, affichez les vidéos les plus vues et les plus appréciées au cours des 12 derniers jours, en triant de plus en moins de likes.
Afficher le contenu du flux dans le modèle d'e-mail
Étant donné que toutes les données d'une seule carte postale se trouvent à l'intérieur de la <description>
incorporée dans un <item>
séparé, il vous suffit de l'afficher dans le modèle de message:
<h1> PromoPult</h1> <p>*|RSSFEED:DESCRIPTION|*</p> *|RSSITEMS:|* *|RSSITEM:CONTENT|* *|END:RSSITEMS|*
Les données s'affichent correctement, le code HTML est inséré dans une boucle et la campagne automatique fonctionne.
Ligne séparée sur RSSFEED et FEEDBLOCK
Quelle est la différence entre *|RSSFEED|*
et *|FEEDBLOCK|*?
Il est facile de comprendre les différences:
*|FEEDBLOCK|*
peut être utilisé dans n'importe quel modèle d'e-mail et de campagne. Par exemple, si vous souhaitez parler des derniers articles d'une newsletter périodique, utilisez-le. Vous pouvez spécifier un lien vers n'importe quelle source RSS.*|RSSFEED|*
ne fonctionne que dans les campagnes automatiques et en tant que source voit ce qui est spécifié dans les paramètres de la campagne.
TOTAL: Si tout est standard et facile pour vous, utilisez les outils MailChimp standard et ne vous inquiétez pas
Mais si la conception de votre blog et vos listes de diffusion sont spécialement conçues et coordonnées à trois reprises avec un combat, si vous souhaitez ajouter les données disponibles aux e-mails automatiques ou au moins déclarer la date en russe, vous devrez gâcher un peu et envoyer des données prêtes à l'emploi à MailChimp.
Comment - nous l'avons dit.
Liens sur le sujet des flux RSS dans MailChimp: