Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Inline CSS/Javascript into a HTML file

I am looking for a simple commandline script/program to automatically "inline" all external css and javascript references for a html file. I basically want to create a single self-contained html file suitable for sending via E-Mail. An additional bonus would be if it could also inline images as data: UIRs, but that part is not so important.

like image 776
Sec Avatar asked Nov 27 '09 13:11

Sec


People also ask

How do I put JavaScript and CSS in HTML?

Where should I include my JavaScript and CSS code in the HTML page – inline or external file? The typical answer is: Add JavaScript code by the end of the </body> tag and. Add CSS code in-between the <head> tags.

Can we use inline JavaScript in HTML?

Inline JavaScript can be achieved by using Script tag inside the body of the HTML, and instead of specifying the source(src=”…”) of the JavaScript file in the Script tag, we have to write all the JavaScript code inside the Script tag.

How do I put CSS code in HTML?

CSS can be added to HTML documents in 3 ways: Inline - by using the style attribute inside HTML elements. Internal - by using a <style> element in the <head> section. External - by using a <link> element to link to an external CSS file.

What is inline CSS in HTML?

Joel Olawanle. Cascading Style Sheets (CSS) is a markup language that determines how your web pages will appear. It manages the colors, fonts, and layouts of your website elements, as well as allowing you to add effects or animations to your pages.


2 Answers

EDIT : I wrote a little Python script for fun. It seems to work pretty well :

Inline2Mail

Or you can still try with :

Front compiler does something like that but it implies javascript. You have an online solution as well, with premailer. Finally you have a Python and a Ruby script to do it.

like image 105
e-satis Avatar answered Oct 22 '22 11:10

e-satis


There is a Node.js library which solves exactly your problem: https://github.com/remy/inliner/ It can be used both as a commandline script and a library.

It will make you a single .html file which can be sent anywhere by any means and be opened later in any browser without the need in Internet connection.

If you think about inlining CSS and Javascript to make a HTML body of an email, just forget about it. Most Email clients out there will either ignore or badly damage your styles and I think all email clients will just plainly drop the inline Javascript in the body of emails.

like image 38
hijarian Avatar answered Oct 22 '22 11:10

hijarian