badsender logo

Workflow of an HTML email integration

05/11/2019

A serious title, isn't it? And yet, dear friends, it is sometimes necessary for me to take on a solemn character in order to tackle serious subjects. For I will try here to answer an existential question: What working method is applied in our HTML email integration production team?

Warning: we want to share here the state of mind, the daily life, the habits, the working methods, and the integration process that we follow at Badsender. This point of view only commits us, as each developer has his own way of working.

1. It's always the same gestures. Always. First, the reception of the elements. Always. (Zinedine Zidane)

This is the essential step for any development to begin. No elements, no integration. No integration... No integration.

We need a model. This is the basis.

And by model, I mean a finalized desktop model, finalThe design should be made in Photoshop, with the layers correctly arranged and separated. Avoid mock-ups made on inDesign or Illustrator, which are not always adapted to the web. And in addition, a responsive mockup (because when you think about it, not doing responsive in emailing, it's not possible anymore, tut tut tut). As a bonus, we will claim confirmation JPEGsto make sure it's the same thing (You can see quite a difference sometimes, believe me!).

desktop and responsive email templates
A jpeg for the "Desktop" version of the model, and another for the "Responsive" version

Do not hesitate to ask for mock-ups adapted to the Retina if it is part of your customer's requirements: the design will then be made on doubled dimensions (for a 600 pixels wide email, the layout will be 1200 pixels wide. I wasn't in S in high school though...).

Now?

You will also need to receive a link briefing to set up. To make it simple: an Excel file, in which each visual or text that must be clickable in the email will have a valid url indicated.

Tips : Suggest to your client to design a "url builder", an Excel file with some concatenation methods so that each url adopts the relevant tracking code. For that, nothing could be simpler, a good little function like =CONCATENER(cell; cell;), and basta!

url builder email
Screenshot of how an "Url Builder" works

And what else?

Finally, in the elements to be received, it will also be required the animated gifs (if there are animated gifs)the videos (if there are videos)the typography, the specific integration constraints to be respected (depending on the routing platform sometimes)... In short, everything that can be useful to the integrator but which he does not have by default on his machine.

2. Comes the cutting/slicing phase (and it's not about whistling)

Most of the time, we first establish a "mental" layout of the model. We transform ourselves into Professor Xavier, from the X-Men: we try to decide which element will be in raw text and formatted via CSS, which element will be in image... This is a crucial step and full of questions : Do we need to design one image for Desktop and another for Responsive for this element? How will the layout behave on Mobile? Is it better to design two cells side by side or just one? Will I pass these texts in HTML with a special typography, or export them as PNG instead? What will be the degradation then? Can I eat a BN between 2 and 3 pm?

Degradation of a non-websafe typography on Outlook 2013

All of these questions are often answered by analysis of consultation statistics from previous campaigns. Don't hesitate to ask your client for this data if it exists: it will be a great help to know, for example, that rounded corners on a Call-to-Action might be "risky" to design in HTML and CSS if the main viewing medium is the Outlook desktop software... Take care of it! (it means nothing...)

What goes one way must also go the other way! It's a give-and-take, folks: don't decide all this on your own. Discuss it with your clientwarn him and educate him in good practices but do not necessarily impose everything at once, at the risk of offending him... And a crumpled customer is a badly ironed customer! That's done...

3. And then zou, we code!

On this step, I unfortunately don't have much to add... Except this:

  • Be sure to use only verified and tested hacks & tips in the <style> (a border-collapse:collapse applied on all table for example, could lead to strange renderings on rounded corners or on dashed)
  • Don't forget to add patches at 120dpi.
  • Try to improve the accessibility of your email as much as possible by respecting best practices on accessibility in email marketing This is achieved, among other things, by using semantic tags (<h1>,<h2>,<h3>,<p>,
      ,
    • ,<strong>,…).
    • Add the attribute role="presentation" to each <table> of your code that would not be an array of data.
    • Fill in the attribute lang to the tag <html>.
    • Indicate a relevant title in the </code>.</li><li>Make the names of your <code>class</code> and <code>id</code> in the explicit media queries, to make the best use of them and make the code readable and understandable by any other integrator. Thus, the following code : <code>.textaligncenter {text-align:center !important;}</code> will probably be more explicit than <code>.txt_01 {text-align:center !important;}</code>. Well, I think so... Right?</li><li>Don't forget to design a <a rel="noreferrer noopener external" aria-label="preheader (opens in a new tab)" href="https://litmus.com/community/snippets/1-hidden-preheader-text" target="_blank" data-wpel-link="external">preheader</a> in the email.</li></ul> <p>Regarding the code editing software with which you will develop, no preference! At Badsender, we code as well on Dreamweaver as on SublimeText, that's to say! So, to each his own! If you are looking for help to choose one, <a href="https://kinsta.com/fr/blog/meilleurs-editeurs-de-texte/" target="_blank" rel="noreferrer noopener external" aria-label="go see up there if I'm there (opens in a new tab)" data-wpel-link="external">go see up there if I am there</a> !</p> <h3>4. Make sure the HTML code is clean</h3> <p>Once the model is coded in HTML and CSS, we have a few steps to follow. You'll see, it's going to go fast. Another 5 kilometers and we go back.</p> <h4>Comment, if you can!</h4> <p>Comments in the HTML code are a precious information for updating or debugging an HTML emailing integration. Think about the future integrator who may one day get the code you have developed: The poor guy! ???? Providing him with simple instructions on how the code works is a sign of respect. And he will be very grateful! <em>Give me a high five, colleague!</em></p> <h4>The encoding of special characters: é becomes é, et cetera, et cetera...</h4> <p>I recommend you to encode all the special characters present in the code: à, é, è, ô, ç, etc... <strong>There are platforms for this</strong> <em>(because to do this in public is borderline! A bit of modesty for God's sake!)</em>. We have developed at Badsender the tool <a rel="noreferrer noopener external" aria-label="KrktR (opens in a new tab)" href="http://test.badsender.com/krktr/" target="_blank" data-wpel-link="external">KrktR</a>. We don't guarantee the quality of the delivered code, but hey, it's for us, it's a gift! ????</p> <h4>The removal of useless media queries: a clean sweep!</h4> <div class="wp-block-image"><figure class="aligncenter"><img alt="" data-src="https://giphygifs.s3.amazonaws.com/media/sOzdvbqaFoWY/giphy.gif" class="lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" /><noscript><img src="https://giphygifs.s3.amazonaws.com/media/sOzdvbqaFoWY/giphy.gif" alt=""/></noscript><figcaption>Do like Snow White: host small people.</figcaption></figure></div> <p>When using HTML code Master Template, it is recurrent to find big blocks of media queries, present to cope with all the cases of modules behaviors on mobile. However, in order to provide a clean code and as light as possible, we suggest you to use tools like <a rel="noreferrer noopener external" aria-label="emailcomb (opens in a new tab)" href="https://emailcomb.com/" target="_blank" data-wpel-link="external">emailcomb</a> or <a href="https://alter.email/" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">alter.email</a> to "clean up" the final HTML code. You'll see, you won't be able to do without it soon... A real drug.</p> <h4>What about minification?</h4> <p>???? Personally, I'm not a fan. Or only if your code is close to the <a rel="noreferrer noopener external" aria-label="102 kilobytes, and thus the fateful threshold set by Gmail (opens in a new tab)" href="https://mailchimp.com/fr/help/gmail-is-clipping-my-email/" target="_blank" data-wpel-link="external">102 kilobytes, and thus the fateful threshold set by Gmail</a>. But if not, we don't need it. First of all, because the minification of your HTML code could break some of your media queries <em>(yes, it's true)</em> but also and above all because it can delete your comments, or simply make the whole integration unreadable and incomprehensible. </p> <h3>5. Email preview tests, BATs, email rendering tests... Call them what you will!</h3> <p>Naaaaaaaaaan but don't even try to neglect this step. You can't, what am I saying... <strong>YOU SHOULD NOT</strong> provide an integration without having tested it first! For this, not 1, not 3, but 2 methods <em>(which, like wine, should be obligatory! Be careful Gérard !)</em> :</p> <ul><li><strong>The test on physical media: </strong>Take all the media you have at your disposal immediately. The desktop PC, the laptop at work, the kid's tablet, your wife's cell phone, all the media I tell you! Install all the email software and email applications you can. Also open a set of tabs on several browsers, to webmails where you would have test accounts <em>(create as many as you can, it costs nothing! You will use it for your Carrouf' account !)</em>. <br><br>And shoot! Bim! you just have to wait for the reception of the proof, and to make sure that everything is ok: the email preview platforms are an essential ally, but they will probably never be able to present all the existing resolutions on the market, nor all the software versions, the browsers, or even the connection speeds... <strong>Nothing beats a good old family test on physical media</strong> to estimate the best time to display an email according to the connection method <em>(wifi, 3G, 4G)</em>or to have the rendering according to the support of consultation, according to the navigator...</li></ul> <figure class="wp-block-image"><img width="1024" height="683" alt="" data-srcset="https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a.jpg?size=160x107&lossy=0&strip=1&webp=1 160w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-300x200.jpg?lossy=0&strip=1&webp=1 300w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a.jpg?size=480x320&lossy=0&strip=1&webp=1 480w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-624x416.jpg?lossy=0&strip=1&webp=1 624w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-768x512.jpg?lossy=0&strip=1&webp=1 768w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-1024x683.jpg?lossy=0&strip=1&webp=1 1024w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a.jpg?lossy=0&strip=1&webp=1 1350w" data-src="https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-1024x683.jpg?lossy=0&strip=1&webp=1" data-sizes="(max-width: 800px) 100vw, 800px" class="wp-image-14074 lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" /><noscript><img width="1024" height="683" src="https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-1024x683.jpg?lossy=0&strip=1&webp=1" alt="" class="wp-image-14074" srcset="https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a.jpg?size=160x107&lossy=0&strip=1&webp=1 160w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-300x200.jpg?lossy=0&strip=1&webp=1 300w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a.jpg?size=480x320&lossy=0&strip=1&webp=1 480w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-624x416.jpg?lossy=0&strip=1&webp=1 624w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-768x512.jpg?lossy=0&strip=1&webp=1 768w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a-1024x683.jpg?lossy=0&strip=1&webp=1 1024w, https://897642.smushcdn.com/119080/wp-content/uploads/2019/11/photo-1543510644-82353c4be12a.jpg?lossy=0&strip=1&webp=1 1350w" sizes="(max-width: 800px) 100vw, 800px" /></noscript><figcaption>For those who have the means...</figcaption></figure> <ul><li><strong>Email preview platforms</strong>. The grave of my dead, you know them! <a rel="noreferrer noopener external" aria-label="Litmus (opens in a new tab)" href="https://litmus.com/" target="_blank" data-wpel-link="external">Litmus</a> and <a rel="noreferrer noopener external" aria-label="EmailonAcid (opens in a new tab)" href="https://www.emailonacid.com/" target="_blank" data-wpel-link="external">EmailonAcid</a> to name only the most famous of course. Take the time to detail the rendering of each screenshot. First of all, because you are paying for it and a penny is a penny, and because in addition, there are sometimes small subtleties. The work of the emailing integrator is also the sense of detail...</li></ul> <p>To facilitate and streamline the work flow of the emailing integrator, EmailonAcid offers a new feature: The " <a href="https://www.emailonacid.com/help-article/what-is-campaign-precheck/" target="_blank" rel="noreferrer noopener external" aria-label="Campaign Precheck (opens in a new tab)" data-wpel-link="external">Campaign Precheck</a>" . Practical, even if it won't do the job for you either, don't push it!</p> <p><strong>Do you have anything to add?</strong> What do you do at home? Do you mop the floor before closing the store? ???????? Tell us, we're a little curious! Plaaaaaace to the comments! Unleash the fury Mitch!</p> <p>Visuals of <a href="https://unsplash.com/@miabaker" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">Mia Baker</a> and <a href="https://unsplash.com/@olegixanovpht" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">Oleg Ivanov</a> on <a rel="noreferrer noopener external" aria-label="Unsplash (opens in a new tab)" href="https://unsplash.com/" target="_blank" data-wpel-link="external">Unsplash</a></p> </div> </div> <div class="elementor-element elementor-element-2e18980 contenu_article elementor-widget elementor-widget-text-editor" data-id="2e18980" data-element_type="widget" data-settings="{"enabled_visibility":"yes"}" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Need a <a href="https://www.badsender.com/en/agency/design/design-system-email/" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">design system email</a> ? Or <a href="https://www.badsender.com/en/agency/design/design-email/" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">an email design</a> at all? Or <a href="https://www.badsender.com/en/agency/design/integration-html-email/" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">an HTML integration for email</a> ? Or <a href="https://www.badsender.com/en/agency/design/email-builder/" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">an email builder</a> ? We can also offer you :</p><ul><li>A white paper on <a href="https://www.badsender.com/en/livre-blanc/design-system-email-2/" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">design system email</a></li><li>A white paper on <a href="https://www.badsender.com/en/livre-blanc/dark-mode-2/" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">the dark mode</a></li><li>A white paper on <a href="https://www.badsender.com/en/livre-blanc/code-an-email-in-html/" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">HTML integration for email</a></li></ul><p>Badsender also animates <a href="https://www.badsender.com/en/trainings/html-email/" data-wpel-link="external" target="_blank" rel="external noopener noreferrer">a training on the subject of HTML development of an email</a> !</p> </div> </div> <div class="elementor-element elementor-element-a3f9302 elementor-share-buttons--view-icon elementor-share-buttons--skin-minimal elementor-share-buttons-mobile--align-left elementor-share-buttons--align-left elementor-share-buttons--color-custom elementor-share-buttons--shape-square elementor-grid-0 elementor-widget elementor-widget-share-buttons" data-id="a3f9302" data-element_type="widget" data-widget_type="share-buttons.default"> <div class="elementor-widget-container"> <link rel="stylesheet" href="https://www.badsender.com/wp-content/plugins/elementor-pro/assets/css/widget-share-buttons.min.css"> <div class="elementor-grid"> <div class="elementor-grid-item"> <div class="elementor-share-btn elementor-share-btn_facebook" tabindex="0" aria-label="Share on facebook" data-no-translation-aria-label=""> <span class="elementor-share-btn__icon"> <svg class="e-font-icon-svg e-fab-facebook"><use xlink:href="#fab-facebook" /></svg> </span> </div> </div> <div class="elementor-grid-item"> <div class="elementor-share-btn elementor-share-btn_twitter" tabindex="0" aria-label="Share on twitter" data-no-translation-aria-label=""> <span class="elementor-share-btn__icon"> <svg class="e-font-icon-svg e-fab-twitter"><use xlink:href="#fab-twitter" /></svg> </span> </div> </div> <div class="elementor-grid-item"> <div class="elementor-share-btn elementor-share-btn_linkedin" tabindex="0" aria-label="Share on linkedin" data-no-translation-aria-label=""> <span class="elementor-share-btn__icon"> <svg class="e-font-icon-svg e-fab-linkedin"><use xlink:href="#fab-linkedin" /></svg> </span> </div> </div> <div class="elementor-grid-item"> <div class="elementor-share-btn elementor-share-btn_email" tabindex="0" aria-label="Share on email" data-no-translation-aria-label=""> <span class="elementor-share-btn__icon"> <svg class="e-font-icon-svg e-fas-envelope"><use xlink:href="#fas-envelope" /></svg> </span> </div> </div> </div> </div> </div> </div> </article> </div> </main> <section class="elementor-section elementor-top-section elementor-element elementor-element-63f6bcd elementor-section-full_width elementor-section-height-default elementor-section-height-default" data-id="63f6bcd" data-element_type="section"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-e6b2a7d" data-id="e6b2a7d" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-1b278d9 elementor-widget elementor-widget-shortcode" data-id="1b278d9" data-element_type="widget" data-widget_type="shortcode.default"> <div class="elementor-widget-container"> <div class="elementor-shortcode"> <div data-elementor-type="section" data-elementor-id="524188" class="elementor elementor-524188 elementor-location-single"> </div> </div> </div> </div> </div> </div> </div> </section> <div class="elementor-section elementor-top-section elementor-element elementor-element-f8e1469 elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="f8e1469" data-element_type="section" data-settings="{"background_background":"classic"}"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-3516244" data-id="3516244" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-1431438 elementor-author-box--link-yes elementor-author-box--avatar-yes elementor-author-box--name-yes elementor-author-box--biography-yes elementor-widget elementor-widget-author-box" data-id="1431438" data-element_type="widget" data-widget_type="author-box.default"> <div class="elementor-widget-container"> <div class="elementor-author-box"> <a href="https://www.badsender.com/en/author/tde/" class="elementor-author-box__avatar" data-wpel-link="internal"> <img alt="Thomas Defossez" data-src="https://897642.smushcdn.com/119080/wp-content/wphb-cache/gravatar/eb2/eb280423f79142f83c14477fff1a8519x300.jpg?lossy=0&strip=1&webp=1" class="lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="><noscript><img src="https://897642.smushcdn.com/119080/wp-content/wphb-cache/gravatar/eb2/eb280423f79142f83c14477fff1a8519x300.jpg?lossy=0&strip=1&webp=1" alt="Thomas Defossez"></noscript> </a> <div class="elementor-author-box__text"> <a href="https://www.badsender.com/en/author/tde/" data-wpel-link="internal"> <div class="elementor-author-box__name"> Thomas Defossez </div> </a> <div class="elementor-author-box__bio"> Thomas started his career as an emailing integrator at Experian before creating his own web agency. Today, Thomas decided to focus on email in order to be a specialist in HTML integration of this medium. Since the end of 2014, Thomas has been collaborating on various projects for the Badsender.com Agency. </div> <a class="elementor-author-box__button elementor-button elementor-size-xs" href="https://www.badsender.com/en/author/tde/" data-wpel-link="internal"> All publications </a> </div> </div> </div> </div> <div class="elementor-element elementor-element-4c42489 elementor-widget elementor-widget-post-comments" data-id="4c42489" data-element_type="widget" data-widget_type="post-comments.theme_comments"> <div class="elementor-widget-container"> <section id="comments" class="comments-area"> <h3 class="title-comments"> 3 Responses </h3> <ol class="comment-list"> <li id="comment-321376" class="comment even thread-even depth-1"> <article id="div-comment-321376" class="comment-body"> <footer class="comment-meta"> <div class="comment-author vcard"> <img alt='' data-srcset='https://www.badsender.com/wp-content/wphb-cache/gravatar/9f8/9f8423a7146320aba56125442e003947x84.jpg 2x' height='42' width='42' data-src='https://897642.smushcdn.com/119080/wp-content/wphb-cache/gravatar/9f8/9f8423a7146320aba56125442e003947x42.jpg?lossy=0&strip=1&webp=1' class='avatar avatar-42 photo lazyload' src='data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' /><noscript><img alt='' src='https://897642.smushcdn.com/119080/wp-content/wphb-cache/gravatar/9f8/9f8423a7146320aba56125442e003947x42.jpg?lossy=0&strip=1&webp=1' srcset='https://www.badsender.com/wp-content/wphb-cache/gravatar/9f8/9f8423a7146320aba56125442e003947x84.jpg 2x' class='avatar avatar-42 photo' height='42' width='42' /></noscript> <b class="fn">Romain DIDIER</b> <span class="says">says:</span> </div><!-- .comment-author --> <div class="comment-metadata"> <a href="https://www.badsender.com/en/2019/11/05/workflow-integration-html-email/#comment-321376" data-wpel-link="internal"><time datetime="2019-11-06T21:32:11+01:00" data-no-translation="" data-trp-gettext="">06/11/2019 at 21h32</time></a> </div><!-- .comment-metadata --> </footer><!-- .comment-meta --> <div class="comment-content"> <p>Great article (be careful though, it's starting to become a habit).<br /> While reading it I felt like I was reliving my days of the last 10 years.<br /> Two little things I usually do: reduce the weight of my images with Compressor.io and test the correct placement of my links ( even if it seems logical ).<br /> At the pure code level, do not put a URL in the anchor of a link.<br /> Finally, I think that the most important thing is missing in your article, the integrator's motto: Test, test and test!</p> </div><!-- .comment-content --> </article><!-- .comment-body --> </li><!-- #comment-## --> <li id="comment-321390" class="comment byuser comment-author-tde bypostauthor odd alt thread-odd thread-alt depth-1"> <article id="div-comment-321390" class="comment-body"> <footer class="comment-meta"> <div class="comment-author vcard"> <img alt='' data-srcset='https://www.badsender.com/wp-content/wphb-cache/gravatar/eb2/eb280423f79142f83c14477fff1a8519x84.jpg 2x' height='42' width='42' data-src='https://897642.smushcdn.com/119080/wp-content/wphb-cache/gravatar/eb2/eb280423f79142f83c14477fff1a8519x42.jpg?lossy=0&strip=1&webp=1' class='avatar avatar-42 photo lazyload' src='data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' /><noscript><img alt='' src='https://897642.smushcdn.com/119080/wp-content/wphb-cache/gravatar/eb2/eb280423f79142f83c14477fff1a8519x42.jpg?lossy=0&strip=1&webp=1' srcset='https://www.badsender.com/wp-content/wphb-cache/gravatar/eb2/eb280423f79142f83c14477fff1a8519x84.jpg 2x' class='avatar avatar-42 photo' height='42' width='42' /></noscript> <b class="fn">Thomas Defossez</b> <span class="says">says:</span> </div><!-- .comment-author --> <div class="comment-metadata"> <a href="https://www.badsender.com/en/2019/11/05/workflow-integration-html-email/#comment-321390" data-wpel-link="internal"><time datetime="2019-11-06T23:34:25+01:00" data-no-translation="" data-trp-gettext="">06/11/2019 at 23h34</time></a> </div><!-- .comment-metadata --> </footer><!-- .comment-meta --> <div class="comment-content"> <p>@Romain DIDIER: thanks Romain, I'll be careful next article, I'll try to make something more confusing 😁 Otherwise, you're totally right: I'll fix the article as soon as possible to add your tips (especially since that's what I'm going through too, but it's hard to list everything). But really, if you have any comments, you can see that it's not such a good article... I still have a lot of progress to make...</p> </div><!-- .comment-content --> </article><!-- .comment-body --> </li><!-- #comment-## --> <li id="comment-321432" class="comment even thread-even depth-1"> <article id="div-comment-321432" class="comment-body"> <footer class="comment-meta"> <div class="comment-author vcard"> <img alt='' data-srcset='https://www.badsender.com/wp-content/wphb-cache/gravatar/9f8/9f8423a7146320aba56125442e003947x84.jpg 2x' height='42' width='42' data-src='https://897642.smushcdn.com/119080/wp-content/wphb-cache/gravatar/9f8/9f8423a7146320aba56125442e003947x42.jpg?lossy=0&strip=1&webp=1' class='avatar avatar-42 photo lazyload' src='data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==' /><noscript><img alt='' src='https://897642.smushcdn.com/119080/wp-content/wphb-cache/gravatar/9f8/9f8423a7146320aba56125442e003947x42.jpg?lossy=0&strip=1&webp=1' srcset='https://www.badsender.com/wp-content/wphb-cache/gravatar/9f8/9f8423a7146320aba56125442e003947x84.jpg 2x' class='avatar avatar-42 photo' height='42' width='42' /></noscript> <b class="fn">Romain DIDIER</b> <span class="says">says:</span> </div><!-- .comment-author --> <div class="comment-metadata"> <a href="https://www.badsender.com/en/2019/11/05/workflow-integration-html-email/#comment-321432" data-wpel-link="internal"><time datetime="2019-11-07T09:55:14+01:00" data-no-translation="" data-trp-gettext="">07/11/2019 at 9h55</time></a> </div><!-- .comment-metadata --> </footer><!-- .comment-meta --> <div class="comment-content"> <p>@Thomas Defossez Nothing is ever perfect the first time^^ but initiatives should be encouraged 🙂 Honestly the article is already quite complete and I searched to find things to add...</p> </div><!-- .comment-content --> </article><!-- .comment-body --> </li><!-- #comment-## --> </ol><!-- .comment-list --> <div id="respond" class="comment-respond"> <h2 id="reply-title" class="comment-reply-title" data-no-translation="" data-trp-gettext="">Leave a Reply</h2><form action="https://www.badsender.com/wp-comments-post.php" method="post" id="commentform" class="comment-form" novalidate data-trp-original-action="https://www.badsender.com/wp-comments-post.php"><p class="comment-notes"><span id="email-notes" data-no-translation="" data-trp-gettext="">Your email address will not be published.</span> <span class="required-field-message" aria-hidden="true" data-no-translation="" data-trp-gettext="">Required fields are marked <span class="required" aria-hidden="true">*</span></span></p><p class="comment-form-comment"><label for="comment">Comment <span class="required" aria-hidden="true">*</span></label> <textarea id="comment" name="comment" cols="45" rows="8" maxlength="65525" required></textarea></p><p class="comment-form-author"><label for="author">Name <span class="required" aria-hidden="true">*</span></label> <input id="author" name="author" type="text" value="" size="30" maxlength="245" required /></p> <p class="comment-form-email"><label for="email">Email <span class="required" aria-hidden="true">*</span></label> <input id="email" name="email" type="email" value="" size="30" maxlength="100" aria-describedby="email-notes" required /></p> <p class="comment-form-cookies-consent"><input id="wp-comment-cookies-consent" name="wp-comment-cookies-consent" type="checkbox" value="yes" /> <label for="wp-comment-cookies-consent" data-no-translation="" data-trp-gettext="">Save my name, email, and website in this browser for the next time I comment.</label></p> <p class="form-submit"><input name="submit" type="submit" id="submit" class="submit" value="Post Comment" data-no-translation-value="" /> <input type='hidden' name='comment_post_ID' value='14022' id='comment_post_ID' /> <input type='hidden' name='comment_parent' id='comment_parent' value='0' /> </p><p style="display: none;"><input type="hidden" id="akismet_comment_nonce" name="akismet_comment_nonce" value="3c4e60d5b1" /></p><p style="display: none !important;"><label>Δ<textarea name="ak_hp_textarea" cols="45" rows="8" maxlength="100"></textarea></label><input type="hidden" id="ak_js_1" name="ak_js" value="149"/><script>document.getElementById( "ak_js_1" ).setAttribute( "value", ( new Date() ).getTime() );</script></p><input type="hidden" name="trp-form-language" value="en"/></form> </div><!-- #respond --> </section><!-- .comments-area --> </div> </div> </div> </div> </div> </div> </div> <div data-elementor-type="footer" data-elementor-id="14487" class="elementor elementor-14487 elementor-location-footer"> <footer class="elementor-section elementor-top-section elementor-element elementor-element-4fd1187 elementor-section-content-top elementor-section-boxed elementor-section-height-default elementor-section-height-default" data-id="4fd1187" data-element_type="section" data-settings="{"background_background":"classic"}"> <div class="elementor-container elementor-column-gap-default"> <div class="elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-dba06e6" data-id="dba06e6" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-176a2f0 elementor-widget elementor-widget-image" data-id="176a2f0" data-element_type="widget" data-widget_type="image.default"> <div class="elementor-widget-container"> <a href="https://www.badsender.com/en/" data-wpel-link="internal"> <img width="200" height="50" alt="badsender logo" data-src="https://www.badsender.com/wp-content/uploads/2021/09/badsender-logo.svg" class="attachment-full size-full lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" /><noscript><img width="200" height="50" alt="badsender logo" data-src="https://www.badsender.com/wp-content/uploads/2021/09/badsender-logo.svg" class="attachment-full size-full lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" /><noscript><img width="200" height="50" src="https://www.badsender.com/wp-content/uploads/2021/09/badsender-logo.svg" class="attachment-full size-full" alt="badsender logo" /></noscript></noscript> </a> </div> </div> <div class="elementor-element elementor-element-ba9cbee elementor-widget elementor-widget-text-editor" data-id="ba9cbee" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> Agitator of emailing and eCRM expertise </div> </div> <div class="elementor-element elementor-element-085ce6d elementor-view-stacked elementor-widget__width-auto elementor-shape-circle elementor-widget elementor-widget-icon" data-id="085ce6d" data-element_type="widget" data-widget_type="icon.default"> <div class="elementor-widget-container"> <div class="elementor-icon-wrapper"> <a class="elementor-icon" href="https://open.spotify.com/show/3YZTeq2TpICcNByyXZdd3n" target="_blank" data-wpel-link="external" rel="external noopener noreferrer"> <svg aria-hidden="true" class="e-font-icon-svg e-fab-spotify"><use xlink:href="#fab-spotify" /></svg> </a> </div> </div> </div> <div class="elementor-element elementor-element-003283e elementor-view-stacked elementor-widget__width-auto elementor-shape-circle elementor-widget elementor-widget-icon" data-id="003283e" data-element_type="widget" data-widget_type="icon.default"> <div class="elementor-widget-container"> <div class="elementor-icon-wrapper"> <a class="elementor-icon" href="https://www.youtube.com/channel/UCgRBfIEah50OIsdXlYclZxw" target="_blank" data-wpel-link="external" rel="external noopener noreferrer"> <svg aria-hidden="true" class="e-font-icon-svg e-fab-youtube"><use xlink:href="#fab-youtube" /></svg> </a> </div> </div> </div> </div> </div> <div class="elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-603acc1" data-id="603acc1" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-4f8d38b elementor-widget elementor-widget-text-editor" data-id="4f8d38b" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Follow us on <strong><a href="https://twitter.com/badsender" target="_blank" rel="noopener external noreferrer" data-wpel-link="external">Twitter</a></strong>, <strong><a href="https://www.linkedin.com/company/badsender/" target="_blank" rel="noopener external noreferrer" data-wpel-link="external">Linkedin</a></strong>, <strong><a href="https://www.pinterest.fr/badsender/" target="_blank" rel="noopener external noreferrer" data-wpel-link="external">Pinterest</a></strong> | 2022 - Badsender</p> </div> </div> <div class="elementor-element elementor-element-809024d elementor-widget elementor-widget-text-editor" data-id="809024d" data-element_type="widget" data-widget_type="text-editor.default"> <div class="elementor-widget-container"> <p>Illustrations of the site from<a href="https://icones8.fr/illustrations/style--3d-flame" target="_blank" rel="noopener external noreferrer" data-wpel-link="external">Icons8 (3D flame library)</a> and thanks to <a href="https://dribbble.com/thierryfousse" target="_blank" rel="noopener external noreferrer" data-wpel-link="external">wonderful work of Thierry Fousse</a> !</p> </div> </div> </div> </div> <div class="elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-b48a7f0" data-id="b48a7f0" data-element_type="column"> <div class="elementor-widget-wrap elementor-element-populated"> <div class="elementor-element elementor-element-c9f6b96 elementor-nav-menu--dropdown-none elementor-widget elementor-widget-nav-menu" data-id="c9f6b96" data-element_type="widget" data-settings="{"layout":"vertical","submenu_icon":{"value":"<i class=\"\"><\/i>","library":""}}" data-widget_type="nav-menu.default"> <div class="elementor-widget-container"> <nav migration_allowed="1" migrated="0" role="navigation" class="elementor-nav-menu--main elementor-nav-menu__container elementor-nav-menu--layout-vertical e--pointer-none"> <ul id="menu-1-c9f6b96" class="elementor-nav-menu sm-vertical"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-523208"><a href="https://www.badsender.com/en/a-propos-2/" class="elementor-item" data-wpel-link="internal">About us</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-508442"><a href="https://www.badsender.com/en/our-partners/" class="elementor-item" data-wpel-link="internal">Partners</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-privacy-policy menu-item-508446"><a href="https://www.badsender.com/en/vie-privee/" class="elementor-item" data-wpel-link="internal">Privacy Policy</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-508444"><a href="https://www.badsender.com/en/endorsements/" class="elementor-item" data-wpel-link="internal">Legal information</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-508440"><a href="https://www.badsender.com/en/reseau-expert/" class="elementor-item" data-wpel-link="internal">The Badsender network</a></li> </ul> </nav> <div class="elementor-menu-toggle" role="button" tabindex="0" aria-label="Menu Toggle" aria-expanded="false" data-no-translation-aria-label=""> <svg aria-hidden="true" role="presentation" class="elementor-menu-toggle__icon--open e-font-icon-svg e-eicon-menu-bar"><use xlink:href="#eicon-menu-bar" /></svg><svg aria-hidden="true" role="presentation" class="elementor-menu-toggle__icon--close e-font-icon-svg e-eicon-close"><use xlink:href="#eicon-close" /></svg> <span class="elementor-screen-only" data-no-translation="" data-trp-gettext="">Menu</span> </div> <nav class="elementor-nav-menu--dropdown elementor-nav-menu__container" role="navigation" aria-hidden="true"> <ul id="menu-2-c9f6b96" class="elementor-nav-menu sm-vertical"><li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-523208"><a href="https://www.badsender.com/en/a-propos-2/" class="elementor-item" tabindex="-1" data-wpel-link="internal">About us</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-508442"><a href="https://www.badsender.com/en/our-partners/" class="elementor-item" tabindex="-1" data-wpel-link="internal">Partners</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-privacy-policy menu-item-508446"><a href="https://www.badsender.com/en/vie-privee/" class="elementor-item" tabindex="-1" data-wpel-link="internal">Privacy Policy</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-508444"><a href="https://www.badsender.com/en/endorsements/" class="elementor-item" tabindex="-1" data-wpel-link="internal">Legal information</a></li> <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-508440"><a href="https://www.badsender.com/en/reseau-expert/" class="elementor-item" tabindex="-1" data-wpel-link="internal">The Badsender network</a></li> </ul> </nav> </div> </div> </div> </div> </div> </footer> </div> <template id="tp-language" data-tp-language="en_US"></template> <!-- Consent Management powered by Complianz | GDPR/CCPA Cookie Consent https://wordpress.org/plugins/complianz-gdpr --> <div id="cmplz-cookiebanner-container"><div class="cmplz-cookiebanner cmplz-hidden banner-1 optin cmplz-bottom-right cmplz-categories-type-view-preferences" aria-modal="true" data-nosnippet="true" role="dialog" aria-live="polite" aria-labelledby="cmplz-header-1-optin" aria-describedby="cmplz-message-1-optin"> <div class="cmplz-header"> <div class="cmplz-logo"></div> <div class="cmplz-title" id="cmplz-header-1-optin">Hmm... Cookies... I want some!</div> <div class="cmplz-close" tabindex="0" role="button" aria-label="close-dialog"> <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="times" class="svg-inline--fa fa-times fa-w-11" role="img" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 352 512"><path fill="currentColor" d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"></path></svg> </div> </div> <div class="cmplz-divider cmplz-divider-header"></div> <div class="cmplz-body"> <div class="cmplz-message" id="cmplz-message-1-optin">Okay, we use cookies. But it's to serve you better my child! These cookies allow us to know your navigation on this site. And thus, to adapt our services even better. Do you agree with that?</div> <!-- categories start --> <div class="cmplz-categories"> <details class="cmplz-category cmplz-functional" > <summary> <span class="cmplz-category-header"> <span class="cmplz-category-title">Functional</span> <span class='cmplz-always-active'> <span class="cmplz-banner-checkbox"> <input type="checkbox" id="cmplz-functional-optin" data-category="cmplz_functional" class="cmplz-consent-checkbox cmplz-functional" size="40" value="1"/> <label class="cmplz-label" for="cmplz-functional-optin" tabindex="0"><span>Functional</span></label> </span> Always active </span> <span class="cmplz-icon cmplz-open"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg> </span> </span> </summary> <div class="cmplz-description"> <span class="cmplz-description-functional">The storage or technical access is strictly necessary for the purpose of legitimate interest to enable the use of a specific service explicitly requested by the subscriber or user, or for the sole purpose of carrying out the transmission of a communication over an electronic communications network.</span> </div> </details> <details class="cmplz-category cmplz-preferences" > <summary> <span class="cmplz-category-header"> <span class="cmplz-category-title">Preferences</span> <span class="cmplz-banner-checkbox"> <input type="checkbox" id="cmplz-preferences-optin" data-category="cmplz_preferences" class="cmplz-consent-checkbox cmplz-preferences" size="40" value="1"/> <label class="cmplz-label" for="cmplz-preferences-optin" tabindex="0"><span>Preferences</span></label> </span> <span class="cmplz-icon cmplz-open"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg> </span> </span> </summary> <div class="cmplz-description"> <span class="cmplz-description-preferences">The storage or technical access is necessary for the purpose of legitimate interest to store preferences that are not requested by the subscriber or user.</span> </div> </details> <details class="cmplz-category cmplz-statistics" > <summary> <span class="cmplz-category-header"> <span class="cmplz-category-title">Statistics</span> <span class="cmplz-banner-checkbox"> <input type="checkbox" id="cmplz-statistics-optin" data-category="cmplz_statistics" class="cmplz-consent-checkbox cmplz-statistics" size="40" value="1"/> <label class="cmplz-label" for="cmplz-statistics-optin" tabindex="0"><span>Statistics</span></label> </span> <span class="cmplz-icon cmplz-open"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg> </span> </span> </summary> <div class="cmplz-description"> <span class="cmplz-description-statistics">Storage or technical access that is used exclusively for statistical purposes.</span> <span class="cmplz-description-statistics-anonymous">Technical storage or access that is used exclusively for anonymous statistical purposes. In the absence of a subpoena, voluntary compliance by your Internet service provider, or additional records from a third party, the information stored or retrieved for this sole purpose generally cannot be used to identify you.</span> </div> </details> <details class="cmplz-category cmplz-marketing" > <summary> <span class="cmplz-category-header"> <span class="cmplz-category-title">Marketing</span> <span class="cmplz-banner-checkbox"> <input type="checkbox" id="cmplz-marketing-optin" data-category="cmplz_marketing" class="cmplz-consent-checkbox cmplz-marketing" size="40" value="1"/> <label class="cmplz-label" for="cmplz-marketing-optin" tabindex="0"><span>Marketing</span></label> </span> <span class="cmplz-icon cmplz-open"> <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512" height="18" ><path d="M224 416c-8.188 0-16.38-3.125-22.62-9.375l-192-192c-12.5-12.5-12.5-32.75 0-45.25s32.75-12.5 45.25 0L224 338.8l169.4-169.4c12.5-12.5 32.75-12.5 45.25 0s12.5 32.75 0 45.25l-192 192C240.4 412.9 232.2 416 224 416z"/></svg> </span> </span> </summary> <div class="cmplz-description"> <span class="cmplz-description-marketing">The storage or technical access is necessary to create user profiles to send advertisements, or to track the user across a website or multiple websites for similar marketing purposes.</span> </div> </details> </div><!-- categories end --> </div> <div class="cmplz-links cmplz-information"> <a class="cmplz-link cmplz-manage-options cookie-statement" href="#" data-relative_url="#cmplz-manage-consent-container" data-no-translation="" data-trp-gettext="">Manage options</a> <a class="cmplz-link cmplz-manage-third-parties cookie-statement" href="#" data-relative_url="#cmplz-cookies-overview" data-no-translation="" data-trp-gettext="">Manage services</a> <a class="cmplz-link cmplz-manage-vendors tcf cookie-statement" href="#" data-relative_url="#cmplz-tcf-wrapper" data-no-translation="" data-trp-gettext="">Manage vendors</a> <a class="cmplz-link cmplz-external cmplz-read-more-purposes tcf" target="_blank" rel="noopener noreferrer nofollow external" href="https://cookiedatabase.org/tcf/purposes/" data-wpel-link="external" data-no-translation="" data-trp-gettext="">Read more about these purposes</a> </div> <div class="cmplz-divider cmplz-footer"></div> <div class="cmplz-buttons"> <button class="cmplz-btn cmplz-accept">Accept</button> <button class="cmplz-btn cmplz-deny">Refuse</button> <button class="cmplz-btn cmplz-view-preferences">View preferences</button> <button class="cmplz-btn cmplz-save-preferences">Save preferences</button> <a class="cmplz-btn cmplz-manage-options tcf cookie-statement" href="#" data-relative_url="#cmplz-manage-consent-container">View preferences</a> </div> <div class="cmplz-links cmplz-documents"> <a class="cmplz-link cookie-statement" href="#" data-relative_url="">{title}</a> <a class="cmplz-link privacy-statement" href="#" data-relative_url="">{title}</a> <a class="cmplz-link impressum" href="#" data-relative_url="">{title}</a> </div> </div> </div> <div id="cmplz-manage-consent" data-nosnippet="true"><button class="cmplz-btn cmplz-hidden cmplz-manage-consent manage-consent-1">Hmmm, cookkiiieesss...</button> </div><svg xmlns="http://www.w3.org/2000/svg" id="e-font-icon-svg-symbols" style="display: none;"><symbol id="eicon-menu-bar" viewbox="0 0 1000 1000"><path d="M104 333H896C929 333 958 304 958 271S929 208 896 208H104C71 208 42 237 42 271S71 333 104 333ZM104 583H896C929 583 958 554 958 521S929 458 896 458H104C71 458 42 487 42 521S71 583 104 583ZM104 833H896C929 833 958 804 958 771S929 708 896 708H104C71 708 42 737 42 771S71 833 104 833Z"></path></symbol><symbol id="eicon-close" viewbox="0 0 1000 1000"><path d="M742 167L500 408 258 167C246 154 233 150 217 150 196 150 179 158 167 167 154 179 150 196 150 212 150 229 154 242 171 254L408 500 167 742C138 771 138 800 167 829 196 858 225 858 254 829L496 587 738 829C750 842 767 846 783 846 800 846 817 842 829 829 842 817 846 804 846 783 846 767 842 750 829 737L588 500 833 258C863 229 863 200 833 171 804 137 775 137 742 167Z"></path></symbol><symbol id="fas-search" viewbox="0 0 512 512"><path d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"></path></symbol><symbol id="fab-facebook" viewbox="0 0 512 512"><path d="M504 256C504 119 393 8 256 8S8 119 8 256c0 123.78 90.69 226.38 209.25 245V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.28c-30.8 0-40.41 19.12-40.41 38.73V256h68.78l-11 71.69h-57.78V501C413.31 482.38 504 379.78 504 256z"></path></symbol><symbol id="fab-twitter" viewbox="0 0 512 512"><path d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"></path></symbol><symbol id="fab-linkedin" viewbox="0 0 448 512"><path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"></path></symbol><symbol id="fas-envelope" viewbox="0 0 512 512"><path d="M502.3 190.8c3.9-3.1 9.7-.2 9.7 4.7V400c0 26.5-21.5 48-48 48H48c-26.5 0-48-21.5-48-48V195.6c0-5 5.7-7.8 9.7-4.7 22.4 17.4 52.1 39.5 154.1 113.6 21.1 15.4 56.7 47.8 92.2 47.6 35.7.3 72-32.8 92.3-47.6 102-74.1 131.6-96.3 154-113.7zM256 320c23.2.4 56.6-29.2 73.4-41.4 132.7-96.3 142.8-104.7 173.4-128.7 5.8-4.5 9.2-11.5 9.2-18.9v-19c0-26.5-21.5-48-48-48H48C21.5 64 0 85.5 0 112v19c0 7.4 3.4 14.3 9.2 18.9 30.6 23.9 40.7 32.4 173.4 128.7 16.8 12.2 50.2 41.8 73.4 41.4z"></path></symbol><symbol id="fab-spotify" viewbox="0 0 496 512"><path d="M248 8C111.1 8 0 119.1 0 256s111.1 248 248 248 248-111.1 248-248S384.9 8 248 8zm100.7 364.9c-4.2 0-6.8-1.3-10.7-3.6-62.4-37.6-135-39.2-206.7-24.5-3.9 1-9 2.6-11.9 2.6-9.7 0-15.8-7.7-15.8-15.8 0-10.3 6.1-15.2 13.6-16.8 81.9-18.1 165.6-16.5 237 26.2 6.1 3.9 9.7 7.4 9.7 16.5s-7.1 15.4-15.2 15.4zm26.9-65.6c-5.2 0-8.7-2.3-12.3-4.2-62.5-37-155.7-51.9-238.6-29.4-4.8 1.3-7.4 2.6-11.9 2.6-10.7 0-19.4-8.7-19.4-19.4s5.2-17.8 15.5-20.7c27.8-7.8 56.2-13.6 97.8-13.6 64.9 0 127.6 16.1 177 45.5 8.1 4.8 11.3 11 11.3 19.7-.1 10.8-8.5 19.5-19.4 19.5zm31-76.2c-5.2 0-8.4-1.3-12.9-3.9-71.2-42.5-198.5-52.7-280.9-29.7-3.6 1-8.1 2.6-12.9 2.6-13.2 0-23.3-10.3-23.3-23.6 0-13.6 8.4-21.3 17.4-23.9 35.2-10.3 74.6-15.2 117.5-15.2 73 0 149.5 15.2 205.4 47.8 7.8 4.5 12.9 10.7 12.9 22.6 0 13.6-11 23.3-23.2 23.3z"></path></symbol><symbol id="fab-youtube" viewbox="0 0 576 512"><path d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"></path></symbol></svg><link rel='stylesheet' id='elementor-post-524188-css' href='https://hb.wpmucdn.com/www.badsender.com/a3c2ea13-e68f-4ee8-8602-096edd02d025.css' type='text/css' media='all' /> <script type='text/javascript' id='wphb-4-js-extra'> /* <![CDATA[ */ var wphbGlobal = {"ajaxurl":"https:\/\/www.badsender.com\/wp-admin\/admin-ajax.php","commentForm":"","preloadComment":""};;;var trp_data = {"trp_custom_ajax_url":"https:\/\/www.badsender.com\/wp-content\/plugins\/translatepress-multilingual\/includes\/trp-ajax.php","trp_wp_ajax_url":"https:\/\/www.badsender.com\/wp-admin\/admin-ajax.php","trp_language_to_query":"en_US","trp_original_language":"fr_FR","trp_current_language":"en_US","trp_skip_selectors":["[data-no-translation]","[data-no-dynamic-translation]","[data-trp-translate-id-innertext]","script","style","head","trp-span","translate-press","[data-trp-translate-id]","[data-trpgettextoriginal]","[data-trp-post-slug]"],"trp_base_selectors":["data-trp-translate-id","data-trpgettextoriginal","data-trp-post-slug"],"trp_attributes_selectors":{"text":{"accessor":"outertext","attribute":false},"block":{"accessor":"innertext","attribute":false},"image_src":{"selector":"img[src]","accessor":"src","attribute":true},"submit":{"selector":"input[type='submit'],input[type='button'], input[type='reset']","accessor":"value","attribute":true},"placeholder":{"selector":"input[placeholder],textarea[placeholder]","accessor":"placeholder","attribute":true},"title":{"selector":"[title]","accessor":"title","attribute":true},"a_href":{"selector":"a[href]","accessor":"href","attribute":true},"button":{"accessor":"outertext","attribute":false},"option":{"accessor":"innertext","attribute":false},"aria_label":{"selector":"[aria-label]","accessor":"aria-label","attribute":true},"image_alt":{"selector":"img[alt]","accessor":"alt","attribute":true},"meta_desc":{"selector":"meta[name=\"description\"],meta[property=\"og:title\"],meta[property=\"og:description\"],meta[property=\"og:site_name\"],meta[property=\"og:image:alt\"],meta[name=\"twitter:title\"],meta[name=\"twitter:description\"],meta[name=\"twitter:image:alt\"],meta[name=\"DC.Title\"],meta[name=\"DC.Description\"]","accessor":"content","attribute":true},"page_title":{"selector":"title","accessor":"innertext","attribute":false},"meta_desc_img":{"selector":"meta[property=\"og:image\"],meta[property=\"og:image:secure_url\"],meta[name=\"twitter:image\"]","accessor":"content","attribute":true}},"trp_attributes_accessors":["outertext","innertext","src","value","placeholder","title","href","aria-label","alt","content"],"gettranslationsnonceregular":"4b2942e472","showdynamiccontentbeforetranslation":"","skip_strings_from_dynamic_translation":[],"skip_strings_from_dynamic_translation_for_substrings":{"href":["amazon-adsystem","googleads","g.doubleclick"]},"duplicate_detections_allowed":"100","trp_translate_numerals_opt":"no","trp_no_auto_translation_selectors":["[data-no-auto-translation]"]}; /* ]]> */ </script> <script type='text/javascript' src='https://hb.wpmucdn.com/www.badsender.com/b2b83d2d-c457-493c-81e6-d9e92ddeea3d.js' id='wphb-4-js'></script> <script type='text/javascript' id='cmplz-cookiebanner-js-extra'> /* <![CDATA[ */ var complianz = {"prefix":"cmplz_","user_banner_id":"1","set_cookies":[],"block_ajax_content":"","banner_version":"27","version":"6.3.0","store_consent":"","do_not_track":"","consenttype":"optin","region":"eu","geoip":"","dismiss_timeout":"","disable_cookiebanner":"","soft_cookiewall":"","dismiss_on_scroll":"","cookie_expiry":"365","url":"https:\/\/www.badsender.com\/en\/wp-json\/complianz\/v1\/","locale":"lang=en&locale=en_US","set_cookies_on_root":"","cookie_domain":"","current_policy_id":"19","cookie_path":"\/","categories":{"statistics":"statistics","marketing":"marketing"},"tcf_active":"","placeholdertext":"Click to accept {category} cookies and enable this content","css_file":"https:\/\/www.badsender.com\/wp-content\/uploads\/complianz\/css\/banner-{banner_id}-{type}.css?v=27","page_links":{"eu":{"cookie-statement":{"title":"Politique de cookies ","url":"https:\/\/www.badsender.com\/en\/policy-of-cookies-eu\/"},"privacy-statement":{"title":"Vie priv\u00e9e","url":"https:\/\/www.badsender.com\/en\/vie-privee\/"}}},"tm_categories":"","forceEnableStats":"","preview":"","clean_cookies":""}; /* ]]> */ </script> <script defer type='text/javascript' src='https://www.badsender.com/wp-content/plugins/complianz-gdpr/cookiebanner/js/complianz.min.js' id='cmplz-cookiebanner-js'></script> <script type='text/javascript' src='https://hb.wpmucdn.com/www.badsender.com/7da8f757-3d69-4153-9626-334e7b229e90.js' id='smartmenus-js'></script> <script defer type='text/javascript' src='https://hb.wpmucdn.com/www.badsender.com/ca8f4415-300c-4780-a422-f8dc87c75ffd.js' id='akismet-frontend-js'></script> <script type='text/javascript' src='https://www.badsender.com/wp-content/plugins/elementor-pro/assets/js/webpack-pro.runtime.min.js' id='elementor-pro-webpack-runtime-js'></script> <script type='text/javascript' src='https://www.badsender.com/wp-content/plugins/elementor/assets/js/webpack.runtime.min.js' id='elementor-webpack-runtime-js'></script> <script type='text/javascript' src='https://hb.wpmucdn.com/www.badsender.com/a24ae9fc-4104-4502-a2e6-2b019397cd7d.js' id='elementor-frontend-modules-js'></script> <script type='text/javascript' src='https://hb.wpmucdn.com/www.badsender.com/c4652725-617b-4b09-8c9a-eaff8c05bad7.js' id='regenerator-runtime-js'></script> <script type='text/javascript' src='https://www.badsender.com/wp-includes/js/dist/vendor/wp-polyfill.min.js' id='wp-polyfill-js'></script> <script type='text/javascript' src='https://hb.wpmucdn.com/www.badsender.com/e37dfbb0-f634-46c2-bd44-c2a5f4d911f2.js' id='wphb-5-js'></script> <script type='text/javascript' id='wphb-5-js-after'> wp.i18n.setLocaleData( { 'text direction\u0004ltr': [ 'ltr' ] } ); </script> <script type='text/javascript' id='elementor-pro-frontend-js-before'> var ElementorProFrontendConfig = {"ajaxurl":"https:\/\/www.badsender.com\/wp-admin\/admin-ajax.php","nonce":"821c20ebf5","urls":{"assets":"https:\/\/www.badsender.com\/wp-content\/plugins\/elementor-pro\/assets\/","rest":"https:\/\/www.badsender.com\/en\/wp-json\/"},"shareButtonsNetworks":{"facebook":{"title":"Facebook","has_counter":true},"twitter":{"title":"Twitter"},"linkedin":{"title":"LinkedIn","has_counter":true},"pinterest":{"title":"Pinterest","has_counter":true},"reddit":{"title":"Reddit","has_counter":true},"vk":{"title":"VK","has_counter":true},"odnoklassniki":{"title":"OK","has_counter":true},"tumblr":{"title":"Tumblr"},"digg":{"title":"Digg"},"skype":{"title":"Skype"},"stumbleupon":{"title":"StumbleUpon","has_counter":true},"mix":{"title":"Mix"},"telegram":{"title":"Telegram"},"pocket":{"title":"Pocket","has_counter":true},"xing":{"title":"XING","has_counter":true},"whatsapp":{"title":"WhatsApp"},"email":{"title":"Email"},"print":{"title":"Print"}},"facebook_sdk":{"lang":"en_US","app_id":""},"lottie":{"defaultAnimationUrl":"https:\/\/www.badsender.com\/wp-content\/plugins\/elementor-pro\/modules\/lottie\/assets\/animations\/default.json"}}; </script> <script type='text/javascript' src='https://hb.wpmucdn.com/www.badsender.com/4a357ed8-a235-4d1d-800a-165bca9b3651.js' id='elementor-pro-frontend-js'></script> <script type='text/javascript' src='https://hb.wpmucdn.com/www.badsender.com/2a0304e9-d49c-4615-964f-efe5efdca101.js' id='elementor-waypoints-js'></script> <script type='text/javascript' src='https://www.badsender.com/wp-includes/js/jquery/ui/core.min.js' id='jquery-ui-core-js'></script> <script type='text/javascript' id='wphb-6-js-before'> var elementorFrontendConfig = {"environmentMode":{"edit":false,"wpPreview":false,"isScriptDebug":false},"i18n":{"shareOnFacebook":"Share on Facebook","shareOnTwitter":"Share on Twitter","pinIt":"Pin it","download":"Download","downloadImage":"Download image","fullscreen":"Fullscreen","zoom":"Zoom","share":"Share","playVideo":"Play Video","previous":"Previous","next":"Next","close":"Close"},"is_rtl":false,"breakpoints":{"xs":0,"sm":480,"md":768,"lg":1025,"xl":1440,"xxl":1600},"responsive":{"breakpoints":{"mobile":{"label":"Mobile","value":767,"default_value":767,"direction":"max","is_enabled":true},"mobile_extra":{"label":"Mobile Extra","value":880,"default_value":880,"direction":"max","is_enabled":false},"tablet":{"label":"Tablet","value":1024,"default_value":1024,"direction":"max","is_enabled":true},"tablet_extra":{"label":"Tablet Extra","value":1200,"default_value":1200,"direction":"max","is_enabled":false},"laptop":{"label":"Laptop","value":1366,"default_value":1366,"direction":"max","is_enabled":false},"widescreen":{"label":"Widescreen","value":2400,"default_value":2400,"direction":"min","is_enabled":false}}},"version":"3.7.0","is_static":false,"experimentalFeatures":{"e_dom_optimization":true,"e_optimized_assets_loading":true,"e_optimized_css_loading":true,"e_font_icon_svg":true,"e_import_export":true,"e_hidden_wordpress_widgets":true,"theme_builder_v2":true,"landing-pages":true,"elements-color-picker":true,"admin-top-bar":true,"notes":true,"form-submissions":true},"urls":{"assets":"https:\/\/www.badsender.com\/wp-content\/plugins\/elementor\/assets\/"},"settings":{"page":[],"editorPreferences":[]},"kit":{"active_breakpoints":["viewport_mobile","viewport_tablet"],"global_image_lightbox":"yes"},"post":{"id":14022,"title":"Workflow%20d%27une%20int%C3%A9gration%20HTML%20d%27email","excerpt":"","featuredImage":"https:\/\/www.badsender.com\/wp-content\/uploads\/2019\/11\/photo-1501159599894-155982264a55-1024x683.jpg"}}; </script> <script type='text/javascript' src='https://hb.wpmucdn.com/www.badsender.com/4bcba433-14f1-422d-833c-2cf510e5c2ff.js' id='wphb-6-js'></script> <!-- Statistics script Complianz GDPR/CCPA --> <script data-category="functional">var _paq = window._paq || []; _paq.push(['trackPageView']); _paq.push(['enableLinkTracking']); _paq.push(['requireCookieConsent']); (function() { var u="https://analytics.badsender.com/"; _paq.push(['setTrackerUrl', u+'matomo.php']); _paq.push(['setSiteId', '2']); _paq.push(['setSecureCookie', window.location.protocol === "https:" ]); var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0]; g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s); })(); document.addEventListener("cmplz_fire_categories", function (e) { var consentedCategories = e.detail.categories; if (!cmplz_in_array( 'statistics', consentedCategories )) { _paq.push(['forgetCookieConsentGiven']); } else { _paq.push(['rememberCookieConsentGiven']); } }); </script><script type="text/javascript"> var _ss = _ss || []; _ss.push(['_setDomain', 'https://koi-3Q56OXU3WO.marketingautomation.services/net']); _ss.push(['_setAccount', 'KOI-3Q6ANWY1JC']); _ss.push(['_trackPageView']); window._pa = window._pa || {}; // _pa.orderId = "myOrderId"; // OPTIONAL: attach unique conversion identifier to conversions // _pa.revenue = "19.99"; // OPTIONAL: attach dynamic purchase values to conversions // _pa.productId = "myProductId"; // OPTIONAL: Include product ID for use with dynamic ads (function() { var ss = document.createElement('script'); ss.type = 'text/javascript'; ss.async = true; ss.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'koi-3Q56OXU3WO.marketingautomation.services/client/ss.js?ver=2.4.0'; var scr = document.getElementsByTagName('script')[0]; scr.parentNode.insertBefore(ss, scr); })(); </script> </body> </html> <!-- Dynamic page generated in 4.819 seconds. --> <!-- Cached page generated by WP-Super-Cache on 2022-08-10 07:12:37 --> <!-- super cache -->