Quali strumenti per incorporare automaticamente lo stile CSS per creare codice HTML e-mail? [chiuso]

Quando dai un'occhiata a http://www.campaignmonitor.com/css/ apprendi che devi incorporare stili inline nel tuo HTML, in modo che la tua email possa essere letta in qualsiasi client di posta.

Conosci strumenti o script per convertire automaticamente un file HTML con una dichiarazione in un file HTML con solo attributi di stile CCS in linea?

Modifica : qualsiasi soluzione Javascript (ad esempio: http://www.robertnyman.com/2006/04/24/get-the-rendered-style-of-an-element/ )? Con jQuery?

Controlla il convertitore online premailer.dialect.ca o questo script Python per farlo.

Ecco un elenco di strumenti inlining pronti per l'uso basati sul web, un paio sono stati menzionati in precedenza. Se ce ne sono alcuni che mi sono perso, sentiti libero di modificarli e aggiungerli. Non posso promettere che ognuno funzioni come pubblicizzato, quindi rilascia i commenti, ma non sparare al messaggero ...

• Campaign Monitor
• Mailchimp
• Premailer
• Styler in linea
• Emogrifier
• MailerMailer
• Tikku
• Mally

Ed eccone uno che funziona al contrario (un-inlining il tuo CSS)

• Uscita CSS

Se desideri avere una soluzione PHP, puoi provare CssToInlineStyles .

Due varianti C #:

http://chrispebble.com/Blog/7/inlining-a-css-stylesheet-with-c

PreMailer.Net - https://github.com/milkshakesoftware/PreMailer.Net

Non ho ancora provato nessuno dei due, ma posterò di nuovo se / quando lo farò.

Ho scritto una libreria Node.js chiamata Styliner che integra CSS in Javascript lato server.

Supporta anche LESS stylesheets (e supporta plugin per altri formati)

Potresti dare un'occhiata a PostageApp .

Una delle sue caratteristiche davvero forti è che ha un sistema di modelli molto robusto che può incorporare automaticamente HTML e CSS senza problemi.

( Divulgazione completa: sono il Product Manager di PostageApp.)

Potrebbe essere un po 'troppo tardi, ma se vuoi rendere il tuo HTML il migliore possibile per l'e-mail marketing (incorporando il tuo css e usando una serie di altri fantastici strumenti), usa il Premailer . È gratuito e, naturalmente, realizzato in collaborazione con CampaignMonitor stesso.

Spero che sia d'aiuto.

Sono un po 'in ritardo per la partita, ma spero che questo possa aiutare qualcuno.

Ho trovato questo simpatico metodo jQuery / javascript che può essere incorporato in una pagina: http://devintorr.es/blog/2010/05/26/turn-css-rules-into-inline-style-attributes-using-jquery /

L'ho modificato un po 'per supportare IE e anche per supportare una pagina con più file CSS allegati che applicano gli stili nell'ordine corretto.

$(document).ready(function ($) {
            var rules;
            for(var i = document.styleSheets.length - 1; i >= 0; i--){
                if(document.styleSheets[i].cssRules)
                    rules = document.styleSheets[i].cssRules;
                else if(document.styleSheets[i].rules)
                    rules = document.styleSheets[i].rules;
                for (var idx = 0, len = rules.length; idx < len; idx++) {
                    if(rules[idx].selectorText.indexOf("hover") == -1) {
                        $(rules[idx].selectorText).each(function (i, elem) {
                            elem.style.cssText = rules[idx].style.cssText + elem.style.cssText;
                        });
                    }
                }
            }
            $('style').remove();
            $('script').remove();
            $('link').remove();
        });

La pagina può quindi essere copiata / incollata nel corpo dell'email.

Non è sufficiente incorporare semplicemente il tuo CSS. Non ci sono standard osservati su come verrà mostrata un'e-mail HTML in qualsiasi client di posta elettronica venga utilizzato. Lo fanno tutti in modo diverso, e più progetti la tua email, più è probabile che si rompa in un maggior numero di client. Molti professionisti in questo spazio usano semplicemente immagini e tabelle e forse alcuni colori di sfondo, ma nient'altro. Includere sempre un collegamento a un sito Web che abbia una copia funzionante dell'e-mail e fornire sempre una variante di testo normale.

Una soluzione javascript di tikku qui: https://tikku.com/open-source/utilities/css-inline-transformer/

Un altro di mailchimp - http://beaker.mailchimp.com/inline-css

Per i programmatori PHP: controlla questo convertitore online o questo script PHP per farlo.