Hugo using Org-Mode
Fri, Jan 15, 2016Table of Contents
1 Links in Hugo using Org-Mode
Org-mod does not know about Hugo, and that is reflected in how org-mode handles links. Here we discuss how to handle links in org-mode. It's a little bit of work, but not that much.
Note that this file is called hugo_ormode.org
and contains a lot of
formatting to show the source code for doing an org file on this web
page. For a more normal example org file, see sample_orgmode.org
in
the /asl
content directory. Note: Hugo copies *.org
files to the
actual web site, so you can always download the source for a page by
removing the trailing \
and adding .org
to the URL you are
viewing.
The Hugo website view of both the "content" and "static" directories
are at the Hugo top-level (they are combined). You can put limited
figures in the static directory, but I don't want to fill-up the
aslhugo git repo with figures. For example, if you want a photo in
your home page, put it in /static/hepplewhite/hepplewhite.jpg
as an
example. To refer to the figure in your markdown you would use
/hepplewwhite/hepplewhite.jpg
if you are working inside a
top-level directory like /asl
or /hepplewhite
.
Most figures (and data files) should be put on maya in
/asl/ftp/pub/username/xxx
where username is your location in the ftp
pub site, and xxx is whatever you want. Note that the nginx
application that serves up our web pages maps /asl/ftp/pub
to /pub
inside Hugo. However, you cannot take advantage of that in orgmode
since there is no way to get orgmode to output /pub/...
in html, as
far as I know. So, we need to stick to absolute URLs with orgmode.
Your figure URLs will look something like:
https:/asl.umbc.edu/pub/strow/figs/nov2015/ciras/Png/airs_ak_t_image.png.
It is really easy too avoid having to type most of this URLs in
org-mode, see the source file, sample_orgmode.org
, to see how. Also
shown in that file is how to easily switch to LaTeX output using the
same source file. After reading that file, you will see that in
general you can refer to figures using
[[hpub:nov2015/ciras/Png/temp_dof_all.png]]
instead of the longer version shown above. hpub
is essentially a
macro defined at the top of your file.
2 Orgmode Syntax
I will give examples for the most important things you need to know about org-mode here, for a full (and lengthly) view see the Org-Mode on-line docs
Code blocks, examples, prose, etc can be done a number of ways, two ways are shown below, see the source code of this document to see how these are done.
#+BEGIN_SRC text Here is the rendering of an =in-line code block=. Is was done by enclosing the code block in =, as shown below where we repeat these last two sentences. #+END_SRC
Here is the rendering of an =in-line code block=. Is was done by enclosing the code block in =, as shown below where we repeat these last two sentences.
Note that the code block rendering will render carriage return, line feeds if they exist.
To render a matlab file (or latex, or html, etc) just use the backticks, and put the language right after the first set of three backticks. I would generally put language of "text" for notes, or if you do not want automatic colorization, etc. I can't figure out how to render a code block inside a code block, so look at the source of this file (/strow/hugo_orgmode.md) to see how this works.
% A matlab code snippet for i=1:n a(i) = fact(i); end
If you want to make this look like the Hugo markdown, there is a slightly more complicated way to do the above, shown below and then rendered.
#+BEGIN_EXPORT HTML <pre><code class="language-matlab">% A matlab code snippet for i=1:n a(i) = fact(i); end </code></pre> #+END_EXPORT
% A matlab code snippet
for i=1:n
a(i) = fact(i);
end
3 Figures
Orgmode has it's own syntax for including figures. However, remember
you have to be careful with URL's as discussed above.
The figure syntax assuming you have copied /asl/ftp/pub/xxx
to your
local machine is:
#+CAPTION: Another caption for a figure. #+ATTR_HTML: :width 400 [[hpub:pub_test.png]]
Figure 1: Another caption for a figure.
Here is another example, using an absolute URL
#+CAPTION: A caption for a figure. #+ATTR_HTML: :width 600 [[https://asl.umbc.edu/pub/strow/figs/desert_rtp.png]]
Figure 2: A caption for a figure.
4 Math
To include a mathematical formula in-line using org-mode, just use normal latex syntax. Here is some in-line math $a = α × β.$ For latex equations or displaymath just type them in the file as usual:
\begin{equation}
\frac{n!}{k!(n-k)!} = \binom{n}{k}
\end{equation}
which gives,
\begin{equation} \frac{n!}{k!(n-k)!} = \binom{n}{k}. \end{equation}5 Lists
Lists work out of the box (enumerated or itemize)
1. Just write a Markdown document, and sprinkle your LaTeX code snippets in between. 1. Save the document with an `.md` suffix. 1. Run the Pandoc conversion:
- Just write a Markdown document, and sprinkle your LaTeX code snippets in between.
- Save the document with an
.md
suffix. - Run the Pandoc conversion:
- Just write a Markdown document, and sprinkle your LaTeX code snippets in between. - Save the document with an `.md` suffix. - nested list - Run the Pandoc conversion:
- Just write a Markdown document, and sprinkle your LaTeX code snippets in between.
- Save the document with an
.md
suffix.- nested list
- Run the Pandoc conversion:
There is a css formating bug somewhere that puts in the extra space after a nested list.
6 Tables
Hugo is limited to simple tables, org-mode provides much more flexibility. Here is the Hugo (default markdown) table syntax, followed by it's html rendering. The code block is fancier than it's rendering…
Here is a table using org-mode, followed by the code. Unfortunately, there is a bug in org-mode that doesn't put a carriage-return, line-feed after a left-justified table, so avoid those for now.
Name | Age |
---|---|
Bob | 27 |
Alice | 23 |
The code. If you don't center the table, the rendering goes bad.
#+ATTR_html: :align center :width 200 #+CAPTION: the caption Name | Age -------|------ Bob | 27 Alice | 23
7 Table of Contents
You can get org-mode to produce your table of contents quite easily,
you just have to put the following, #+TOC: headlines 2
, on the line
right after the #END_EXPORT
command in your Hugo configuration
sections at the top of the file. The "2" refers to how deep you want
the table of contents sectioning.
8 Fenced Matlab Code Block
Here is an example of a Matlab fenced code block. Note, you can do ascii tables inside code block if you like. Looks at the source for this file to see how to do this.
% A matlab code snippet
% NAME
% rad2bt - translate radiance to brightness temperature
%
% SYNOPSIS
% bt = rad2bt(fr, rad);
%
% INPUTS
% fr - n-vector of wavenumbers, cm-1
% rad - n x k array of radiances, mW/m2 per strad
%
% OUTPUT
% bt - n x k array of brightness temps, K
%
% AUTHOR
% H. Motteler
%
function bt = rad2bt(fr, rad);
% Constants; values from NIST (CODATA98)
c = 2.99792458e+08; % speed of light 299 792 458 m s-1
h = 6.62606876e-34; % Planck constant 6.626 068 76 x 10-34 J s
k = 1.3806503e-23; % Boltzmann constant 1.380 6503 x 10-23 J K-1
% Compute radiation constants c1 and c2
c1 = 2*h*c*c * 1e+11;
c2 = (h*c/k) * 100;
% the scalar calculation, for reference
% bt = c2 * fr / log(1 + c1 * fr^3 / rad)
% LLS cut a bunch out here!
% do the vectorized calculation
bt = c2 * (fr * ones(1,j)) ./ log(1 + c1 * (fr.^3 * ones(1,j)) ./ rad);
% restore rad original shape
bt = reshape(bt, d2);