147 lines
6.3 KiB
Org Mode
147 lines
6.3 KiB
Org Mode
|
#+TITLE: Awesome HTML themes for files exported from Org mode
|
||
|
#+AUTHOR: Fabrice Niessen
|
||
|
#+EMAIL: (concat "fniessen" at-sign "pirilampo.org")
|
||
|
#+Time-stamp: <2014-09-13 Sat 15:07>
|
||
|
#+DESCRIPTION: Org-HTML export made simple.
|
||
|
#+KEYWORDS: org, export, html, theme, style, css, js
|
||
|
#+LANGUAGE: en
|
||
|
#+OPTIONS: H:4 toc:t num:2
|
||
|
|
||
|
#+PROPERTY: padline no
|
||
|
#+SETUPFILE: setup/bigblow.setup
|
||
|
|
||
|
* 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
|
||
|
:PROPERTIES:
|
||
|
:ID: 79e0ed21-c3b0-4f00-bdab-29fbff9dcad4
|
||
|
:END:
|
||
|
|
||
|
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...
|
||
|
|
||
|
Click thumbnails for a bigger view.
|
||
|
|
||
|
** BigBlow
|
||
|
|
||
|
BigBlow is perfect for your work: it is a clean design aimed at optimal *Org
|
||
|
experience in your browser*. It looks just awesome!
|
||
|
|
||
|
#+ATTR_HTML: :width 640
|
||
|
[[file:bigblow.png]]
|
||
|
|
||
|
* Installing a theme
|
||
|
|
||
|
Using a theme from the [[id:79e0ed21-c3b0-4f00-bdab-29fbff9dcad4][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,
|
||
|
|
||
|
#+begin_src org :exports code
|
||
|
,#+SETUPFILE: THEME-NAME.setup
|
||
|
#+end_src
|
||
|
|
||
|
or
|
||
|
|
||
|
- use the (relative or absolute) path to the "setup file" (in your Git local
|
||
|
repository)
|
||
|
|
||
|
#+begin_src org :exports code
|
||
|
,#+SETUPFILE: path/to/Git/repo/setup/THEME-NAME.setup
|
||
|
#+end_src
|
||
|
|
||
|
** BigBlow
|
||
|
|
||
|
In order to use this style, just copy the [[file:setup/bigblow.setup][bigblow.setup]] file to your project
|
||
|
and link to it this way:
|
||
|
|
||
|
#+begin_src org :exports code
|
||
|
,#+SETUPFILE: bigblow.setup
|
||
|
#+end_src
|
||
|
|
||
|
If you prefer, you can add the content of the setup file at the beginning of
|
||
|
your Org file instead:
|
||
|
|
||
|
#+begin_src org :exports code :tangle setup/bigblow.setup
|
||
|
# -*- mode: org; -*-
|
||
|
|
||
|
,#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/css/htmlize.css"/>
|
||
|
,#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/css/bigblow.css"/>
|
||
|
,#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/css/hideshow.css"/>
|
||
|
|
||
|
,#+HTML_HEAD: <script type="text/javascript" src="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/js/jquery-1.11.0.min.js"></script>
|
||
|
,#+HTML_HEAD: <script type="text/javascript" src="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/js/jquery-ui-1.10.2.min.js"></script>
|
||
|
|
||
|
,#+HTML_HEAD: <script type="text/javascript" src="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/js/jquery.localscroll-min.js"></script>
|
||
|
,#+HTML_HEAD: <script type="text/javascript" src="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/js/jquery.scrollTo-1.4.3.1-min.js"></script>
|
||
|
,#+HTML_HEAD: <script type="text/javascript" src="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/js/jquery.zclip.min.js"></script>
|
||
|
,#+HTML_HEAD: <script type="text/javascript" src="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/js/bigblow.js"></script>
|
||
|
,#+HTML_HEAD: <script type="text/javascript" src="http://svn/mc/missioncriticalit/org-style/trunk/styles/bigblow/js/hideshow.js"></script>
|
||
|
#+end_src
|
||
|
|
||
|
#+begin_src org :exports code :tangle setup/bigblow-pirilampo.setup
|
||
|
# -*- 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>
|
||
|
#+end_src
|
||
|
|
||
|
Here a local version (using relative paths):
|
||
|
|
||
|
#+begin_src org :exports code :tangle setup/bigblow-local.setup
|
||
|
# -*- 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>
|
||
|
#+end_src
|
||
|
|
||
|
* Contributing
|
||
|
|
||
|
I love contributions! If you'd like to contribute, please send a patch file or
|
||
|
submit a pull request via GitHub.
|
||
|
|
||
|
* License
|
||
|
|
||
|
Copyright (C) 2011-2014 Fabrice Niessen.
|
||
|
|
||
|
These Org-HTML Themes are open source and free to use under GPL.
|