versenden - Mit welchen Tools wird CSS-Stil automatisch eingebunden, um E-Mail-HTML-Code zu erstellen?




simple html email template (8)

Überprüfen Sie den Online-Konverter premailer.dialect.ca oder dieses Python-Skript .

Wenn Sie sich http://www.campaignmonitor.com/css/ ansehen, erfahren Sie, dass Sie Inline-Stile in Ihren HTML-Code einbetten müssen, damit Ihre E-Mails in jedem E-Mail-Client gelesen werden können.

Kennen Sie irgendwelche Werkzeuge oder ein Skript, um eine HTML-Datei mit einer deklarierten in eine HTML-Datei mit nur Inline-CCS-Stil-Attributen automatisch zu konvertieren?

Bearbeiten : Jede Javascript-Lösung (zB: http://www.robertnyman.com/2006/04/24/get-the-rendered-style-of-an-element/ )? Mit jQuery?


Dies kann ein wenig zu spät sein, aber wenn Sie Ihren HTML- premailer.dialect.ca für das E-Mail-Marketing bestmöglich nutzen möchten (indem Sie Ihr premailer.dialect.ca und eine Reihe anderer cooler Tools verwenden), verwenden Sie den premailer.dialect.ca . Es ist kostenlos und natürlich in Partnerschaft mit CampaignMonitor selbst gemacht.

Ich hoffe es hilft.



Es reicht nicht aus, einfach CSS zu inline zu schreiben. Es gibt keine beobachteten Standards, wie eine HTML-E-Mail in welchem ​​E-Mail-Client verwendet wird. Sie alle machen das anders, und je mehr Sie Ihre E-Mails entwerfen, desto wahrscheinlicher ist es, dass sie mehr Kunden erreichen. Viele Profis in diesem Raum verwenden einfach Bilder und Tabellen und vielleicht einige Hintergrundfarben, aber sonst nichts. Fügen Sie immer einen Link zu einer Website ein, die eine funktionierende Kopie der E-Mail enthält, und stellen Sie immer eine reine Textvariante bereit.


Hier ist eine Liste von Web-basierten gebrauchsfertigen Inlining-Tools, ein paar wurden bereits erwähnt. Wenn es welche gibt, die ich vermisst habe, kannst du sie bearbeiten und hinzufügen. Ich kann nicht versprechen, dass jede Arbeit wie angekündigt funktioniert, also lasst die Kommentare fallen, aber erschießt nicht den Boten ...

Und hier ist eine, die umgekehrt funktioniert (dein css wird nicht-inliniert)


Ich bin ein wenig zu spät zum Spiel, aber hoffentlich wird das jemandem helfen.

Ich fand diese nette kleine jQuery / Javascript-Methode, die in eine Seite eingebettet werden kann - http://devintorr.es/blog/2010/05/26/turn-css-rules-into-inline-style-attributes-using-jquery/

Ich habe es ein wenig bearbeitet, um IE zu unterstützen und auch eine Seite mit mehreren CSS-Dateien zu unterstützen, die Stile in der richtigen Reihenfolge anwenden.

$(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();
        });

Die Seite kann dann in den E-Mail-Text kopiert / eingefügt werden.


Vielleicht möchten Sie einen Blick auf PostageApp .

Eine seiner wirklich starken Eigenschaften ist, dass es ein sehr robustes Template-System hat, das automatisch HTML und CSS ohne Probleme inline einbinden kann.

( Vollständige Offenlegung: Ich bin der Produktmanager für PortoApp.)






html-email