Programing

전자 메일 HTML 코드를 만들기 위해 CSS 스타일을 자동으로 인라인하는 도구는 무엇입니까?

lottogame 2020. 7. 10. 08:17
반응형

전자 메일 HTML 코드를 만들기 위해 CSS 스타일을 자동으로 인라인하는 도구는 무엇입니까? [닫은]


http://www.campaignmonitor.com/css/살펴보면 메일 클라이언트에서 이메일을 읽을 수 있도록 HTML에 인라인 스타일을 포함시켜야한다는 것을 알게됩니다.

인라인 CCS 스타일 속성 만있는 HTML 파일로 선언 된 HTML 파일을 자동으로 변환하는 도구 나 스크립트를 알고 있습니까?

편집 : 모든 Javascript 솔루션 (예 : http://www.robertnyman.com/2006/04/24/get-the-rendered-style-of-an-element/ )? jQuery로?


premailer.dialect.ca 온라인 변환기 또는이 Python 스크립트확인하십시오 .


다음은 앞서 언급 한 인라인 도구를 사용할 수있는 웹 기반의 목록입니다. 내가 놓친 것이 있으면 자유롭게 편집하고 추가하십시오. 나는 각 작품이 광고 된대로 약속 할 수 없으므로 의견을 남기지 만 메신저를 쏘지 마십시오 ...

그리고 여기에 반대로 작동하는 것이 있습니다 (CSS 인라인 해제)


PHP 솔루션을 원한다면 CssToInlineStyles 를 사용해보십시오 .


두 가지 C # 변형 :

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

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

아직 테스트하지는 않았지만 언제 또는 언제 다시 게시 할 것입니다.


서버 측 Javascript에서 CSS를 인라인하는 Styliner 라는 Node.js 라이브러리를 작성했습니다 .

LESS 스타일 시트도 지원합니다 (다른 형식의 플러그인도 지원).


PostageApp을 살펴볼 수 있습니다 .

매우 강력한 기능 중 하나는 HTML 및 CSS를 아무런 문제없이 자동으로 인라인 할 수있는 매우 강력한 템플릿 시스템이 있다는 것입니다.

( 전체 공개 : 저는 PostageApp의 제품 관리자입니다.)


이것은 너무 늦을 수도 있지만 HTML을 전자 메일 마케팅에 가장 적합하게 만들려면 (CSS를 인라인하고 다른 멋진 도구를 사용하여) Premailer를 사용하십시오 . 무료이며 물론 CampaignMonitor 자체와 제휴하여 제작되었습니다.

도움이 되길 바랍니다.


CSS를 단순히 인라인하는 것만으로는 충분하지 않습니다. 사용되는 전자 메일 클라이언트에 HTML 전자 메일이 표시되는 방법에 대한 관찰 된 표준은 없습니다. 그들은 모두 다르게 행동하며, 이메일을 많이 디자인할수록 더 많은 클라이언트에서 침입 할 가능성이 높습니다. 이 공간의 많은 전문가들은 단순히 이미지와 테이블 및 배경색을 사용하지만 다른 것은 사용하지 않습니다. 항상 이메일 사본이있는 웹 사이트 링크를 포함하고 항상 일반 텍스트 변형을 제공하십시오.


나는 게임에 조금 늦었지만 희망적으로 이것이 누군가를 도울 것입니다.

페이지에 포함될 수있는이 멋진 jQuery / javascript 메소드를 찾았습니다-http: //devintorr.es/blog/2010/05/26/turn-css-rules-into-inline-style-attributes-using-jquery /

IE를 지원하고 스타일을 올바른 순서로 적용하여 여러 CSS 파일이 첨부 된 페이지를 지원하도록 약간 편집했습니다.

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

그런 다음 전자 메일 본문에 페이지를 복사 / 붙여 넣을 수 있습니다.


tikku의 자바 스크립트 솔루션 : https://tikku.com/open-source/utilities/css-inline-transformer/


메일 침프의 또 다른 하나 - http://beaker.mailchimp.com/inline-css


PHP 프로그래머 : 온라인 변환기 또는이 PHP 스크립트 를 확인하십시오.

참고 URL : https://stackoverflow.com/questions/791070/what-tools-to-automatically-inline-css-style-to-create-email-html-code

반응형