Go to file

Fabrice Niessen 9b9c42c6ff Click on image to access video on YouTube		2014-09-15 20:44:27 +02:00
setup	Add CSS/JS files	2014-09-13 15:31:32 +02:00
styles/bigblow	Add CSS/JS files	2014-09-13 15:31:32 +02:00
README.org	Click on image to access video on YouTube	2014-09-15 20:44:27 +02:00
bigblow.png	Add CSS/JS files	2014-09-13 15:31:32 +02:00

README.org

Awesome HTML themes for files exported from Org mode

Overview
Gallery
- BigBlow
Installing a theme
- BigBlow
Contributing
License

Overview

Description

Org provides basic HTML support. Though, we can easily override CSS stylesheets and add our own HTML themes.

Objective

The goal of the Org-HMTL themes is to provide you with a list of very nice (cross-browser) themes.

Requirements

Org mode version 8 (or later) is required.

If such a version is not bundled with your Emacs, install one from ELPA.

Gallery

This is a list of available themes for Org, which you can use right now! Well, I hope to have more than one in a couple of weeks…

BigBlow

BigBlow is perfect for your work: it is a clean design aimed at optimal Org experience in your browser. It looks just awesome!

Click thumbnail for a demo.

Installing a theme

Using a theme from the theme gallery for your own Org documents is very easy: you just need to clone the Org-HTML themes project and add a #+SETUPFILE: directive in the preamble to include the CSS and JavaScript files.

You can either:

copy the "setup file" of the chosen theme to the directory of your Org files,
```
#+SETUPFILE: THEME-NAME.setup
```
or
use the (relative or absolute) path to the "setup file" (in your Git local repository)
```
#+SETUPFILE: path/to/Git/repo/setup/THEME-NAME.setup
```

BigBlow

In order to use this style, just copy the bigblow-pirilampo.setup file to your project and link to it this way:

#+SETUPFILE: bigblow-pirilampo.setup

If you prefer, you can add the content of the setup file at the beginning of your Org file instead:

# -*- mode: org; -*-

#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="http://www.pirilampo.org/styles/bigblow/css/htmlize.css"/>
#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="http://www.pirilampo.org/styles/bigblow/css/bigblow.css"/>
#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="http://www.pirilampo.org/styles/bigblow/css/hideshow.css"/>

#+HTML_HEAD: <script type="text/javascript" src="http://www.pirilampo.org/styles/bigblow/js/jquery-1.11.0.min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="http://www.pirilampo.org/styles/bigblow/js/jquery-ui-1.10.2.min.js"></script>

#+HTML_HEAD: <script type="text/javascript" src="http://www.pirilampo.org/styles/bigblow/js/jquery.localscroll-min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="http://www.pirilampo.org/styles/bigblow/js/jquery.scrollTo-1.4.3.1-min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="http://www.pirilampo.org/styles/bigblow/js/jquery.zclip.min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="http://www.pirilampo.org/styles/bigblow/js/bigblow.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="http://www.pirilampo.org/styles/bigblow/js/hideshow.js"></script>

Here a local version (using relative paths):

# -*- mode: org; -*-

#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="styles/bigblow/css/htmlize.css"/>
#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="styles/bigblow/css/bigblow.css"/>
#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="styles/bigblow/css/hideshow.css"/>

#+HTML_HEAD: <script type="text/javascript" src="styles/bigblow/js/jquery-1.11.0.min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="styles/bigblow/js/jquery-ui-1.10.2.min.js"></script>

#+HTML_HEAD: <script type="text/javascript" src="styles/bigblow/js/jquery.localscroll-min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="styles/bigblow/js/jquery.scrollTo-1.4.3.1-min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="styles/bigblow/js/jquery.zclip.min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="styles/bigblow/js/bigblow.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="styles/bigblow/js/hideshow.js"></script>

Here is a remote version (with CSS/JS files served from GitHub webservers) to share temporary examples or demos with small numbers of people:

# -*- mode: org; -*-

#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/css/htmlize.css"/>
#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/css/bigblow.css"/>
#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/css/hideshow.css"/>

#+HTML_HEAD: <script type="text/javascript" src="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/js/jquery-1.11.0.min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/js/jquery-ui-1.10.2.min.js"></script>

#+HTML_HEAD: <script type="text/javascript" src="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/js/jquery.localscroll-min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/js/jquery.scrollTo-1.4.3.1-min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/js/jquery.zclip.min.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/js/bigblow.js"></script>
#+HTML_HEAD: <script type="text/javascript" src="https://rawgit.com/fniessen/org-html-themes/master/styles/bigblow/js/hideshow.js"></script>

Contributing

I love contributions! If you'd like to contribute, please send a patch file or submit a pull request via GitHub.

License

These Org-HTML Themes are open source and free to use under GPL.