❤
npm
Sign UpSign In

gulp-mc-inline-css

0.1.6 • Public • Published

gulp-inline-css NPM version Build status

Takes HTML style tags and converts it to inline CSS using MailChimp's CSS Inliner API for Gulp 3

Usage

First, install gulp-mc-inline-css as a development dependency:

npm install --save-dev gulp-mc-inline-css

Then, add it to your gulpfile.js:

var inline = require('gulp-mc-inline-css');
 
gulp.task('inliner', function() {
  gulp.src('client/html/*.html')
    .pipe(inline(APIKEY))
    .pipe(gulp.dest('dist/email');
});

API

inliner(APIKEY)

APIKEY

Type: String

A required string containing your MailChimp API Key. A best practice is to create a config.json file with an APIKEY and call inliner like so:

{
 "APIKEY": "zowizjzowjoij#example#madeup#key"
}
var config = require('./config.json');
gulp.src('client/css/*.css')
  .pipe(inline(config.APIKEY))
  .pipe(gulp.dest('dist/email'));

Results

Converts the below HTML to the following

<html>
  <head>
    <style>
      div { color: #fff; background: #000; }
    </style> 
  </head>
  <body>
    <div>Hello World</div> 
  </body>
</html>

to

<html>
  <head>
 
  </head>
  <body>
    <div style="color:#fff;background:#000;">Hello World</div> 
  </body>
</html>

Readme

Keywords

none

Package Sidebar

Install

npm i gulp-mc-inline-css

Weekly Downloads

21

Version

0.1.6

License

MIT

Last publish

Collaborators

  • jayzawrotny
Try on RunKit
Report malware