Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

markdown to html using a specified css

First, let me say - I love markdown. Truly love it. It's simple, it's elegant, it's sexy, it's everything I wish for in a markup language. If I could, I'd propose to it :)

So far I've been using it in a very nice and simple way, Vim + python-markdown = fast preview in my browser of choice.

But, it has one drawback ... the css sheet is hardcoded somewhere inside the plugin, and I can't change it. Note: I know zero python, or something very close to it.

Is there a markdown to -various formats- plugin that lets you specify a css page to use, so that I could have several and create several versions of the same document using the one I wish at that time?

It would go something like

markdown  my-document-in.markdown  css-sheet.css  cool-looking-document.html
like image 446
Rook Avatar asked Feb 16 '12 22:02

Rook


People also ask

Can you style Markdown with CSS?

Markdown - CSSMarkdown does not support CSS styles. Since Markdown converts to HTML, Any valid HTML works. CSS styles are added with inline or style tags in HTML. Disadvantages with this lot of HTML code with plain markdown that makes complex to read and understand.

How do I display a Markdown in HTML?

The first step to convert Markdown to HTML is to open your Markdown document in Atom. Then toggle the Markdown preview by pressing the CTRL+SHIFT+M keyboard shortcut. Another way to toggle the Markdown preview is from Packages —> Markdown Preview —> Toggle Preview.

How do I link a Markdown in CSS?

Markdown css Just add <link href="style. css" rel="stylesheet"></link> to the start of your markdown document.

Does Markdown support inline CSS?

Markdown does have support for inline HTML, therefore you can add your own formatting inline using CSS or other HTML attributes, however this moves away from the quick markdown flavor.


1 Answers

Using https://github.com/trentm/python-markdown2/ (specifically https://raw.github.com/trentm/python-markdown2/master/lib/markdown2.py), I wrote a small script which when called as generator.py input.markdown styles.css pretty.html (assuming you saved it as generator.py) uses the python-markdown2 library to convert the markdown to HTML, embeds the css file in the top and writes it to pretty.html.

import markdown2
import os, sys


output = """<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <style type="text/css">
"""

cssin = open(sys.argv[2])
output += cssin.read()

output += """
    </style>
</head>

<body>
"""
mkin = open(sys.argv[1])
output += markdown2.markdown(mkin.read())

output += """</body>

</html>
"""

outfile = open(sys.argv[3])
outfile.write(output)
outfile.close()`

Copy the linked file from github and the code above into a folder together and it should run fine. I've tested it locally and it works. Hope it can help you too.

like image 103
Drakekin Avatar answered Sep 19 '22 11:09

Drakekin