ईमेल HTML कोड बनाने के लिए CSS स्टाइल को स्वचालित रूप से इनलाइन करने के लिए कौन से टूल हैं? [बन्द है]

122

जब आप http://www.campaignmonitor.com/css/ पर एक नज़र डालते हैं, तो आप सीखते हैं कि आपको अपने ईमेल में किसी भी मेल क्लाइंट को पढ़ने के लिए अपने HTML में इनलाइन शैलियों को एम्बेड करना होगा।

क्या आप किसी भी उपकरण या स्क्रिप्ट को स्वचालित रूप से केवल इनलाइन सीसीएस शैली विशेषताओं के साथ एक HTML फ़ाइल में घोषित HTML फ़ाइल में बदलने के लिए जानते हैं?

संपादित करें : कोई भी जावास्क्रिप्ट समाधान (यानी: http://www.robertnyman.com/2006/04/24/get-the-rendered-style-of-an-element/ )? JQuery के साथ?

html  css  email  inline  html-email 
— पियरे-जीन कूदरत
स्रोत
3
मैं सिर्फ एक अनुवर्ती इस एक के रूप में सॉफ्टवेयर सिफारिशों पर एक समान प्रश्न पूछा है: softwarerecs.stackexchange.com/questions/9983/...
— Grzegorz Oledzki
मुझे काम पर एक विभाग के लिए बस इस सटीक बात को हल करना था। इस प्रश्न ने समस्या को हल करने के लिए आवश्यक कदम प्रदान किए।
— गोचरखान

जवाबों:

80

चेक premailer.dialect.ca ऑनलाइन कनवर्टर या इस अजगर स्क्रिप्ट यह करने के लिए।

— सालेह अल-ज़ैद
स्रोत
10
ऐसा लगता है कि प्रेमिलर एक नए URL पर चला गया: premailer.dialect.ca
— मैट
2
मेल चिंप एक शानदार स्टाइल इनलाइनर यहाँ प्रदान करता है: beaker.mailchimp.com/inline-css
— dhornbein
1
premailer.dialect.ca बहुत अच्छा है, लेकिन यह बहुत सारे पृष्ठों पर चुटकी लेता है। यह मेरे परीक्षण में आधे से अधिक है। उदाहरण के लिए, इस पृष्ठ को आज़माएँ।
— निक वुडहम्स
अपना स्वयं का प्रीमियर सर्वर चलाएं ... github.com/TrackIF/premailer-server, Ec2 पर चलाना आसान है: docs.aws.amazon.com/elasticbeanstalk/latest/dg/…
— एडम
उनमें से कोई भी वास्तव में स्टाइल टैग को नहीं हटाता है, जो मुख्य मुद्दा है जिससे आप निपटेंगे
— कोल्डस्टार
33

इनलाइनिंग टूल का उपयोग करने के लिए तैयार वेब आधारित एक सूची है, एक जोड़े का पहले उल्लेख किया गया है। अगर कोई छूट गया है, तो उन्हें संपादित करने और जोड़ने के लिए स्वतंत्र महसूस करें। मैं विज्ञापित के रूप में प्रत्येक कार्य का वादा नहीं कर सकता, इसलिए टिप्पणी छोड़ देता हूं, लेकिन दूत को गोली मत चलाना ...

और यहाँ एक है जो रिवर्स में काम करता है (अपने सीएसएस को इनलाइन करना)

— जॉन
स्रोत
3
MailerMailer केवल एक ही था जिसने प्रारूपण को बनाए रखते हुए मेरे लिए काम किया।
— जेशुरुन
20

यदि आप PHP समाधान करना चाहते हैं, तो आप CssToInlineStyles को आज़मा सकते हैं ।

— chiborg
स्रोत
2
कि php स्क्रिप्ट अच्छी तरह से लिखी गई है। यह महत्वपूर्ण ध्वज को नहीं संभालता है, लेकिन यह एक अच्छी स्क्रिप्ट है जो किसी से कम नहीं है।
— पेरी टीव
8

मैंने Styliner नामक एक Node.js लाइब्रेरी लिखी है जो सर्वर-साइड जावास्क्रिप्ट में CSS को इनलाइन करती है।

यह LESS स्टाइलशीट का समर्थन करता है (और अन्य प्रारूपों के लिए प्लगइन्स का समर्थन करता है)

— SLaks
स्रोत
7

आप PostageApp पर एक नज़र रखना चाहते हो सकता है ।

इसकी वास्तव में मजबूत विशेषताओं में से एक यह है कि इसमें एक बहुत ही मजबूत अस्थायी प्रणाली है जो स्वचालित रूप से HTML और सीएसएस को बिना किसी समस्या के इनलाइन कर सकती है।

( पूर्ण प्रकटीकरण: मैं PostageApp के लिए उत्पाद प्रबंधक हूं।)

— JonLim
स्रोत
इसलिए आप प्रसंस्करण श्रृंखला के अंत में सीएसएस इनलाइनिंग कर रहे हैं (किसी को ई-मेल भेजने से ठीक पहले)?
— ज़ाज़ी
6

यह थोड़ा बहुत देर हो सकती है, लेकिन अगर आप अपने HTML को ई-मेल मार्केटिंग के लिए सबसे अच्छा संभव बनाना चाहते हैं (अपने सीएसएस को टोल करना , और अन्य शांत साधनों का एक गुच्छा का उपयोग करके), प्रेमलीर का उपयोग करें । इसकी नि: शुल्क, और निश्चित रूप से, स्वयं अभियानमेनेटर के साथ साझेदारी में बनाई गई है।

आशा करता हूँ की ये काम करेगा।

— आंद्रे अर्मेनी
स्रोत
प्रेमलीर के लिए +1। इसे एक वेब फ़ॉर्म और एक एपीआई दोनों मिला है जिसे आप किसी भी प्लेटफ़ॉर्म में एकीकृत करने के लिए उपयोग कर सकते हैं। यदि आप नोड.जेएस का उपयोग कर रहे हैं, तो यहां एक आवरण है ।
— जेड वॉटसन
6

मुझे खेल में थोड़ी देर हो गई है लेकिन उम्मीद है कि इससे किसी को मदद मिलेगी।

मुझे यह अच्छी छोटी jQuery / जावास्क्रिप्ट विधि मिली जिसे एक पृष्ठ में एम्बेड किया जा सकता है - http://devintorr.es/blog/2010/05/26/turn-css-rules-into-inline-style-attributes-use-jquery /

मैंने IE का समर्थन करने के लिए इसे थोड़ा संपादित किया है और सही क्रम में शैलियों को लागू करने वाली कई सीएसएस फाइलों के साथ एक पृष्ठ का समर्थन करने के लिए भी।

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

पृष्ठ को ईमेल बॉडी में कॉपी / पेस्ट किया जा सकता है।

— जॉन सी
स्रोत
आप स्क्रिप्ट क्यों निकालते हैं? और मुझे लगता है कि निष्पादन को हटाने के लिए पाश के बाहर जाना चाहिए।
— jcubic
@jcubic आप सही पुनः हैं: निष्कासन निष्पादन की नियुक्ति, मैं संपादित करूँगा। स्क्रिप्ट हटाने का काम मेरे मूल कोड में था, मैं केवल उस पृष्ठ को प्रदर्शित करने के लिए आवश्यक HTML के साथ क्लीनर को चाहता था।
— जॉन सी।
इस संक्षिप्त स्क्रिप्ट के लिए बहुत धन्यवाद, मैं घंटों से देख रहा हूं और यह मुझे मिला सबसे साफ समाधान है।
— kerzek
1
@Kerzek के रूप में एक ही नाव में था। इसने कुछ हद तक काम किया लेकिन कुछ शैलियों में गड़बड़ हो गई। कोड के इस संस्करण ने हालांकि उत्कृष्ट काम किया (परीक्षण किया और हमेशा के लिए
— radu.luchian
5

यह केवल आपके सीएसएस को इनलाइन करने के लिए पर्याप्त नहीं है। कोई ईमेल मानकों का उपयोग कैसे किया जाता है, इसमें कोई ईमेल मानकों को नहीं दिखाया जाएगा। वे सभी इसे अलग तरीके से करते हैं, और जितना अधिक आप अपने ईमेल को डिज़ाइन करते हैं, उतना ही अधिक संभावना है कि यह अधिक से अधिक ग्राहकों में टूट जाएगा। इस जगह में कई पेशेवर बस छवियों और तालिकाओं और शायद कुछ पृष्ठभूमि के रंगों का उपयोग करते हैं, लेकिन कुछ और नहीं। हमेशा एक वेबसाइट का लिंक शामिल करें जिसमें ईमेल की एक कार्यशील प्रतिलिपि हो और हमेशा एक सादा पाठ संस्करण प्रदान करें।

— ब्योर्न
स्रोत
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.