it-swarm.com.de

Welche Tools zum automatischen Inline-CSS-Stil zum Erstellen von E-Mail-HTML-Code?

Wenn Sie sich http://www.campaignmonitor.com/css/ ansehen, werden Sie darauf aufmerksam, dass Sie Inline-Stile in Ihren HTML-Code einbetten müssen, damit Ihre E-Mail in einem beliebigen E-Mail-Client gelesen werden kann .

Kennen Sie Tools oder Skripts zum automatischen Konvertieren einer HTML-Datei mit einem deklarierten in eine HTML-Datei mit nur Inline-CCS-Stilattributen?

Bearbeiten : Beliebige Javascript-Lösung (dh: http://www.robertnyman.com/2006/04/24/get-the- gerenderter-Stil-eines-Elements / )? Mit jQuery?

123

Überprüfen Sie den premailer.dialect.ca Online-Konverter oder das Python-Skript , um dies zu tun.

79
Saleh Al-Zaid

Hier ist eine Liste von webbasierten, einsatzbereiten Inlining-Tools, von denen einige bereits erwähnt wurden. Wenn ich etwas übersehen habe, kannst du es jederzeit bearbeiten und hinzufügen. Ich kann nicht versprechen, dass jedes Werk so funktioniert, wie es angekündigt ist, also schreibe Kommentare, aber schieße nicht auf den Messenger ...

Und hier ist eine, die in umgekehrter Reihenfolge funktioniert (Inlining deines CSS aufheben)

33
John

Wenn Sie eine PHP Lösung haben möchten, können Sie versuchen CssToInlineStyles .

20
chiborg

Zwei C # -Varianten:

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

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

Habe bis jetzt auch noch nicht getestet, werde aber zurückschicken, wenn ich das tue.

10
GFoley83

Ich habe eine Node.js-Bibliothek namens Styliner geschrieben, die CSS in serverseitigem Javascript integriert.

Es unterstützt auch WENIGER Stylesheets (und Plugins für andere Formate)

8
SLaks

Vielleicht möchten Sie einen Blick auf PostageApp werfen.

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

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

7
JonLim

Dies mag etwas zu spät sein, aber wenn Sie Ihr HTML für das E-Mail-Marketing optimieren möchten (indem Sie Ihr CSS einbetten und eine Reihe anderer cooler Tools verwenden), verwenden Sie Premailer . Es ist kostenlos und wird natürlich in Zusammenarbeit mit CampaignMonitor selbst erstellt.

Ich hoffe es hilft.

6
André Armenni

Ich bin etwas spät dran, aber hoffentlich hilft das jemandem.

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 und auch um eine Seite mit mehreren angehängten CSS-Dateien zu unterstützen, wobei Stile in der richtigen Reihenfolge angewendet wurden.

$(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.

5
John C

Es reicht nicht aus, einfach Ihr CSS zu integrieren. Es gibt keine Standards, wie eine HTML-E-Mail in einem beliebigen E-Mail-Client angezeigt wird. Sie alle machen das anders und je mehr Sie Ihre E-Mails gestalten, desto wahrscheinlicher ist es, dass eine größere Anzahl von Kunden davon betroffen ist. Viele Profis in diesem Bereich verwenden einfach Bilder und Tabellen und möglicherweise Hintergrundfarben, aber sonst nichts. Fügen Sie immer einen Link zu einer Website hinzu, auf der sich eine Arbeitskopie der E-Mail befindet, und geben Sie immer eine Nur-Text-Variante an.

5
Bjorn Tipling
5
EpokK

Ein anderer von mailchimp - http://beaker.mailchimp.com/inline-css

2
palaniraja

Für PHP Programmierer: Aktivieren Sie dieses Online-Konverter oder dieses PHP-Skript , um dies zu tun.

1
Peter Krauss