Seenthis
•
 
Identifiants personnels
  • [mot de passe oublié ?]

  • https://gitlab.com
  • /jmoupah
  • /zcm

/blob

  • ►/master
    • ►/css
      • ►/newsletter_rwd.css.html
    • ►/modeles
      • ►/selection_newsletter.html
  • @jeanmarie
    jeanmarie @jeanmarie CC BY-NC-SA 9/09/2019
    4
    @rastapopoulos
    @spip
    @reka
    @tofulm
    4
    @rastapopoulos

    #SPIP : un modèle pour mettre en forme le contenu des newsletters

    Un besoin qui remonte régulièrement quand on envoie des newsletter avec SPIP et le trio magique Newsletter/Mailsubscriber/Mailshot, c’est la possibilité de mettre en forme le contenu pour le rendre plus dynamique. Bien sûr, et c’est là que se cache le pot de pus, ça doit fonctionner sur toutes les plateformes et avec tous les logiciels, webmails compris.

    Principe

    J’ai donc utilisé l’astuce lue je ne sais plus où (de @rastapopoulos je crois ?) de passer par des sélections éditoriales (►https://contrib.spip.net/Selections-editoriales) pour afficher le contenu dans les newsletters.

    Il suffit donc de faire un modèle simple qui affiche ces sélections et le tour est joué.

    Pour ça, j’ai regardé ce qui se faisait chez Mailjet et le principe est d’avoir un template qui affiche de base tout en une colonne et, via des Media Queries, gérer les mises en forme plus complexes (ligne, 2 colonnes, etc...). Ça semble malin car les cas où on doit afficher le contenu en 1 colonne, c’est sur smartphone et ces applis sont les moins aptes à gérer Media Queries.

    –---

    EDIT 16/04/20 : C’est désormais un plugin indépendant sur la forge SPIP
    ►https://git.spip.net/spip-contrib-extensions/newsletters_modeles

    –---

    Il y a donc 2 fichiers

    La feuille de styles insérée dans le modèle de la newsletter :
    ▻https://gitlab.com/jmoupah/zcm/blob/master/css/newsletter_rwd.css.html
    le modèle
    ▻https://gitlab.com/jmoupah/zcm/blob/master/modeles/selection_newsletter.html

    Le modèle

    Affichage pleine largeur <selection_newsletterX>
    Affichage par ligne <selection_newsletterX|affichage=ligne>
    Modèle par colonne <selection_newsletterX|affichage=colonne>

    Le résultat

    https://stk.cousumain.info/modele_newsletter_zcm.jpg

    D’après mes 1ers tests, ça semble fonctionner sur pas mal de configs (Thuberbird, Yahoo/GMail/Zimbra webmail, GMail sur Android). Étonnamment ^^, MS Outlook n’affiche pas bien les 2 colonnes. N’ayant pas cette usine à gaz, je n’ai pas encore pu creuser. Et je n’ai pas encore pu tester sur Mail de MacOS non plus.

    Donc voilà, si qq1 veut tester et faire des retours, je prends.

    #spip_recette #webdev #integrationweb

    jeanmarie @jeanmarie CC BY-NC-SA
    • @boumla
      _dd_ @boumla CC BY-NC-SA 7/01/2020

      Hello,
      Je n’arrive pas à faire fonctionner le modèle. Si je sélectionne squelettes/newsletters/selection_newsletter.html j’ai une page blanche en previsu et lors d’un test d’envoi j’ai « Une erreur est survenue lors de la génération de la newsletter. »
      J’ai testé avec <selection_newsletter13> dans le texte de la newsletter. Il y a 2 articles (publiés) dans la sélection.

      Est-ce que squelettes/newsletter_rwd.css.html est au bon endroit ? Je comprends pas comment cette css est appelée, mais bon, ça c’est moi.

      _dd_ @boumla CC BY-NC-SA
    • @jeanmarie
      jeanmarie @jeanmarie CC BY-NC-SA 8/01/2020

      Pas sûr de bien comprendre la question :)

      Il faut insérer <selection_newsletter13> dans le texte de la newsletter et prévisualiser la newsletter de façon classique.

      Et il faut ranger le squelette newsletter_rwd.css.html dans ton dossier css par ex et ajouter <INCLURE{fond=css/newsletter_rwd.css} /> dans les styles de ta newsletter.

      jeanmarie @jeanmarie CC BY-NC-SA
    • @jeanmarie
      jeanmarie @jeanmarie CC BY-NC-SA 16/04/2020

      Pour info, c’est désormais un plugin indépendant sur la forge SPIP : ►https://git.spip.net/spip-contrib-extensions/newsletters_modeles

      jeanmarie @jeanmarie CC BY-NC-SA
    • @jeanmarie
      jeanmarie @jeanmarie CC BY-NC-SA 28/04/2020

      Et c’est prêt à tester désormais : ►https://git.spip.net/spip-contrib-extensions/newsletters_modeles

      Vous trouverez les infos et mode d’emploi dans le readme.

      N’hésitez pas à tester et faire des retours sur la liste spip-dev ou dans les tickets git.

      jeanmarie @jeanmarie CC BY-NC-SA
    • @jeanmarie
      jeanmarie @jeanmarie CC BY-NC-SA 22/05/2020

      Et désormais dispo via SVP et ▻https://plugins.spip.net/newsletters_modeles.html

      Encore plus prêt à être testé !

      jeanmarie @jeanmarie CC BY-NC-SA
    Écrire un commentaire