Skip to main content

Turns CSS blocks into style attributes

Project description

Turns CSS blocks into style attributes

When you send HTML emails you can’t used style tags but instead you have to put inline style attributes on every element. So from this:

<html>
<style type="text/css">
h1 { border:1px solid black }
p { color:red;}
</style>
<h1 style="font-weight:bolder">Peter</h1>
<p>Hej</p>
</html>

You want this:

<html>
<h1 style="font-weight:bolder; border:1px solid black">Peter</h1>
<p style="color:red">Hej</p>
</html>

premailer does this. It parses an HTML page, looks up style blocks and parses the CSS. It then uses the lxml.html parser to modify the DOM tree of the page accordingly.

Getting started

If you havena’t already done so, install premailer first:

$ pip install premailer

Next, the most basic use is to use the shortcut function, like this:

>>> from premailer import transform
>>> print transform("""
...         <html>
...         <style type="text/css">
...         h1 { border:1px solid black }
...         p { color:red;}
...         p::first-letter { float:left; }
...         </style>
...         <h1 style="font-weight:bolder">Peter</h1>
...         <p>Hej</p>
...         </html>
... """)
<html>
<head></head>
<body>
<h1 style="font-weight:bolder; border:1px solid black">Peter</h1>
        <p style="color:red">Hej</p>
        </body>
</html>

For more advanced options, check out the code of the Premailer class and all its options in its constructor.

Turning relative URLs into absolute URLs

Another thing premailer can do for you is to turn relative URLs (e.g. “/some/page.html” into “http://www.peterbe.com/some/page.html”). It does this to all href and src attributes that don’t have a :// part in it. For example, turning this:

<html>
<body>
<a href="/">Home</a>
<a href="page.html">Page</a>
<a href="http://crosstips.org">External</a>
<img src="/folder/">Folder</a>
</body>
</html>

Into this:

<html>
<body>
<a href="http://www.peterbe.com/">Home</a>
<a href="http://www.peterbe.com/page.html">Page</a>
<a href="http://crosstips.org">External</a>
<img src="http://www.peterbe.com/folder/">Folder</a>
</body>
</html>

by using transform(’…’, base_url=’http://www.peterbe.com/’).

HTML attributes created additionally

Certain HTML attributes are also created on the HTML if the CSS contains any ones that are easily translated into HTML attributes. For example, if you have this CSS: td { background-color:#eee; } then this is transformed into style=”background-color:#eee” AND as an HTML attribute bgcolor=”#eee”.

Having these extra attributes basically as a “back up” for really shit email clients that can’t even take the style attributes. A lot of professional HTML newsletters such as Amazon’s use this.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

premailer-1.3.0.tar.gz (11.0 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

premailer-1.3.0-py26-none-any.whl (14.1 kB view details)

Uploaded Python 2.6

File details

Details for the file premailer-1.3.0.tar.gz.

File metadata

  • Download URL: premailer-1.3.0.tar.gz
  • Upload date:
  • Size: 11.0 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? No

File hashes

Hashes for premailer-1.3.0.tar.gz
Algorithm Hash digest
SHA256 735def56a7add7c6e4f4a1754c43d87185a5272a488fd44ee6b76bfc2dcbee8e
MD5 91110c5c5fb88c140dc11e5ec2b59a42
BLAKE2b-256 342a70f5237ec497fe6c50b5cfcc48d228c775b777c15c5347cbf78529964f50

See more details on using hashes here.

File details

Details for the file premailer-1.3.0-py26-none-any.whl.

File metadata

File hashes

Hashes for premailer-1.3.0-py26-none-any.whl
Algorithm Hash digest
SHA256 2199330b567a8f952ca69c008471dcc258dbe82c49946f6493741c7a0221b7b3
MD5 ed871af00d9fdc2f9ad28ef24473e34c
BLAKE2b-256 43754f08d5ba2781c6a3bc5e92caacf18130136bd54141d58d9c3f963face6ee

See more details on using hashes here.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page