favicon added
[kengrimes.com/content.git] / content.org
index 2ef879c..714e4f0 100644 (file)
 #+hugo_base_dir: .
 #+hugo_level_offset: 0
 #+seq_todo: TODO DRAFT DONE
-
-#+startup: indent showeverything
-
-#+author: Ken Grimes
+#+startup: indent showall
 
 * Home
 :PROPERTIES:
 :EXPORT_HUGO_SECTION:
 :END:
-** Blog
+** Computers are the Devil
 :PROPERTIES:
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :caption '("A Nonnormative Tomorrow")
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER+: :header /img/blog.png
+:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :header /img/blog.png
 :EXPORT_FILE_NAME: _index
-:EXPORT_HUGO_MENU: :menu "main" :weight -1
+:EXPORT_HUGO_MENU: :menu "main" :weight -1 :title Blog
+:END:
+
+** DONE Using ox-hugo To Build Websites with Emacs :org:emacs:hugo:@tutorial:
+CLOSED: [2018-04-19 Thu 18:06]
+:PROPERTIES:
+:EXPORT_FILE_NAME: ox-hugo-tutorial
+:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :header /img/org.png
 :END:
-** DONE Another topic
-CLOSED: [2018-04-05 Thu 18:29]
+This article explains in detail the process of setting up a bare-bones website
+using Hugo and Org mode. My goal in writing this is to provide readers with a
+superior understanding of the fundamentals of this workflow. It is by no means
+an exhaustive explanation of Org mode or Emacs, but should give readers of any
+skill level a strong foundation to apply their own knowledge and techniques to
+the Emacs-Hugo toolchain.
+
+I assume only beginner-level knowledge of Emacs.
+
+*** Intro & Setup
+[[https://github.com/kaushalmodi][Kaushal Modi]] created ox-hugo on top of his ox-blackfriday package, providing an
+impressive amount of features for organizing blog text and linked data with
+Hugo. He maintains [[https://ox-hugo.scripter.co/][great documentation]] and ample [[https://github.com/kaushalmodi/ox-hugo/tree/master/test/site/content-org][examples]] for using the
+package. I will explain my own workflow here, but for an exhaustive (though
+terse) reference, I highly recommend Modi's [[https://ox-hugo.scripter.co/test/][test site]] and [[https://raw.githubusercontent.com/kaushalmodi/ox-hugo/master/test/site/content-org/all-posts.org][post source]] Org file,
+which contain demonstrations and tests for all of ox-hugo's features.
+
+After issuing the Emacs command ~M-x package-install RET ox-hugo RET~, you'll
+need to ~require~ it. You can do this by running ~M-: (require 'ox-hugo)~, but
+you'll want to add it to your configuration as explained [[https://ox-hugo.scripter.co/doc/usage/][here]]. Once this is
+done, using ox-hugo is just a matter of making an Org file and writing
+content. Org's format is very straightforward, and is designed to make sense to
+the reader even if they're unfamiliar with the formal syntax. For instance,
+#+begin_src org
+,* My food
+| Where's My Food? | Fridge | Counter | Mouth | Total          |
+| Oranges          |      1 |       3 |     0 | :=vsum($2..$4) |
+| Marshmallows     |      0 |     100 |    20 | :=vsum($2..$4) |
+| Brussel Sprouts  |     32 |       4 |     0 | :=vsum($2..$4) |
+#+end_src
+Produces a dynamic spreadsheet table in Org mode that exports to HTML like this:
+**** My food
+| Where's My Food? | Fridge | Counter | Mouth | Total |
+| Oranges          |      1 |       3 |     0 |     4 |
+| Marshmallows     |      0 |     100 |    20 |   120 |
+| Brussel Sprouts  |     32 |       4 |     0 |    36 |
+#+TBLFM: @2$5=vsum($2..$4)::@3$5=vsum($2..$4)::@4$5=vsum($2..$4)
+
+If you're already familiar with Org mode, the benefits are obvious and creating
+content is fairly trivial. Org mode is, however, a complex and expansive program
+with many features, and its learning curve can appear daunting at first glance.
+Using ox-hugo is a great way to learn the format, since it gives the author a
+command-center view of their entire content hierarchy, much like a traditional
+database, but in a flat format that's much easier to read and understand. Org
+features present themselves naturally, and the author can easily visualize the
+correspondence between the Org format and the output on their webpage.
+
+Just take a look at the [[https://www.kengrimes.com/gitweb/?p=kengrimes.com/content.git;a=blob_plain;f=content.org;hb=HEAD][Org file]] for this webpage. Search for "ox-hugo is super
+cool!" and you should find this very paragraph.
+
+Eventually you'll want to [[https://orgmode.org/manual/][read the manual]], though. You may access it in Emacs
+with ~M-x org-info~.
+
+*** Making a New Blog
+Compared to a generic Org file, the only necessary data that ox-hugo needs to
+properly export to Hugo is an ~:EXPORT_FILE_NAME:~ property in the
+~:PROPERTIES:~ block of an Org heading. ~:PROPERTIES:~ blocks are common in Org
+for defining arbitrary metadata about sections, and ox-hugo uses them to
+generate Hugo's [[https://gohugo.io/content-management/front-matter/][front matter]] (used for associating a title, header, or other
+custom data with the page it generates). Providing an ~:EXPORT_FILE_NAME:~
+definition signals to ox-hugo that a particular heading is available for export
+to Hugo.  For example, the ~:PROPERTIES:~ block of the page you're currently
+reading looks like this:
+#+begin_src org
 :PROPERTIES:
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :caption "Just Another Topic"
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER+: :header /img/ox-hugo.png
-:EXPORT_FILE_NAME: another-topic
+:EXPORT_FILE_NAME: ox-hugo-tutorial
+:EXPORT_DESCRIPTION: Exporting to Hugo's Blackfriday Markdown from Orgmode
+:EXPORT_HUGO_IMAGES: /img/org.png
 :END:
-This is just another topic, don't worry about it.
-
-** DONE ox-hugo                          :org:emacs:hugo:markdown:@blogging:
-CLOSED: [2018-04-04 Wed 18:29]
+#+end_src
+The ~:EXPORT_HUGO_IMAGES:~ and ~:EXPORT_DESCRIPTION:~ variables are optional
+definitions allowed by the Speedy theme of this website, but the filename is the
+only required property for ox-hugo. Our goal here is to organize the structure
+of our website as a tree using Org headers. So, as a minimal example, here's
+what a new site might look like in its entirety:
+#+begin_src org -n
+#+hugo_base_dir: .
+,* My Blog
+:PROPERTIES:
+:EXPORT_HUGO_SECTION:
+:END:
+,** Home
+:PROPERTIES:
+:EXPORT_FILE_NAME: _index
+:END:
+This is the home of my blog!
+,** One Bad Night
+:PROPERTIES:
+:EXPORT_FILE_NAME: bad-night
+:END:
+Someone gave me herpes! Oh no!
+#+end_src
+The Org file can be placed in any directory so long as ~HUGO_BASE_DIR~ correctly
+identifies the Hugo project's root directory. This path definition is required
+for any valid ox-hugo file, and in the example above uses ~#+hugo_base_dir: .~
+to specify that the base directory will be the same path as this Org file. If
+you saved this file as hugotest.org, exported it with Org's exporter ~C-c C-e~
+and selected the Hugo output ~H~ and the All Subtrees To Files option ~A~, you'd
+wind up with the following files in your directory:
+#+begin_src
+.
+├── content
+│   ├── bad-night.md
+│   └── _index.md
+└── hugotest.org
+#+end_src
+Most sites will be more than a blog, though, and will want multiple sections. In
+fact, many sites are made up of nothing but a slew of sections that users
+navigate between with some built-in menu. So a more functional minimal example
+would be the following:
+#+begin_src org -n
+#+hugo_base_dir: .
+,* Homepage
+:PROPERTIES:
+:EXPORT_HUGO_SECTION:
+:EXPORT_FILE_NAME: _index
+:EXPORT_HUGO_MENU: :menu "main"
+:END:
+This is the home of my blog!
+,* Blog Posts
+:PROPERTIES:
+:EXPORT_HUGO_SECTION: posts
+:END:
+,** My Blog Homepage
+:PROPERTIES:
+:EXPORT_HUGO_MENU: :menu "main"
+:EXPORT_FILE_NAME: _index
+:END:
+Man, look at all my blog posts.
+,** One Bad Night
+:PROPERTIES:
+:EXPORT_FILE_NAME: bad-night
+:END:
+Someone gave me herpes! Oh no!
+#+end_src
+Which yields the following files on export:
+#+begin_src
+.
+├── content
+│   ├── _index.md
+│   └── posts
+│       ├── bad-night.md
+│       └── _index.md
+└── hugotest.org
+#+end_src
+As you might expect if you're already familiar with Hugo, this structure adheres
+to the Hugo [[https://gohugo.io/content-management/organization/][content management]] scheme. Additionally, the index files have been
+marked with menu metadata, which allows Hugo themes to automatically generate
+navigation menus from the markdown files. Hereafter, making new blog posts is as
+simple as adding new sub-headings under the "Blog Posts" heading, and
+exporting. As you can see, this is suitable for defining the hierarchical
+structure of any general website, not just blogs. Org mode and Hugo just make
+creating new pages so simple and well-structured that providing content is all
+that's required for a new page, blog entry, or entirely new site section. If you
+can blog with ox-hugo, you can deftly deploy any manner of web content, or even
+develop entire websites as naturally as you make blog posts. Any tool that can
+turn blogging and web development into the same task is quite an achievement!
+
+Of course, themes to style this content are another can of worms entirely, but
+we'll get to that soon. It is sufficient for now to mention that Hugo makes
+[[https://gohugo.io/themes/installing-and-using-themes/][using themes]] as easy as downloading one and specifying it in Hugo's config file.
+
+**** Heading Management
+One question you may ask is why the blog's homepage is not defined in the *Blog
+Posts* heading. This is a fair question! Any heading with an
+~:EXPORT_FILE_NAME:~ property will export /all/ of that heading's content,
+/including subheadings/ beneath it. This allows Org headings to be used as part
+of the content of a post, where they will be exported as markdown heading
+levels, which translate to HTML heading elements ~<h1>~, ~<h2>~, ~<h3>~,
+etcetera.
+
+Furthermore, properties other than ~:EXPORT_FILE_NAME:~ are /inherited/ by
+sub-headings, including the ~:EXPORT_HUGO_MENU:~ properties. A
+~:EXPORT_HUGO_MENU:~ property at the section root would cause all exported files
+within that section to be added to the menu specified. This might be intended by
+the content creator, but most likely you don't want every single post you make
+to be in the main menu. So it makes sense to define all your pages, including
+the index, as a sub-heading of the section definition (which merely specifies
+which sub-directory the content will output to).
+
+To illustrate, let's assume you want to extend the previous site definition with
+a section about fishsticks. We'll do this the "wrong way" first to show how Org
+handles inheritence:
+#+begin_src org -n 24
+,* Fishsticks
+:PROPERTIES:
+:EXPORT_HUGO_SECTION: fishsticks
+:EXPORT_HUGO_MENU: :menu "main"
+:EXPORT_FILE_NAME: _index
+:END:
+This section devoted to Orson Wells, R.I.P.
+,** Van De Camps
+:PROPERTIES:
+:EXPORT_FILE_NAME: van-de-camps
+:END:
+If this is fish, I'll be a monkey's uncle.
+,** Gortons
+:PROPERTIES:
+:EXPORT_FILE_NAME: gortons
+:END:
+I think these gave me the herpes.
+#+end_src
+In this example, we've defined the main homepage of the section inside the
+tier-1 heading for Fishsticks. This is /technically/ valid, and produces the
+expected file output:
+#+begin_src
+.
+├── content
+│   ├── fishsticks
+│   │   ├── gortons.md
+│   │   ├── _index.md
+│   │   └── van-de-camps.md
+│   ├── _index.md
+│   └── posts
+│       ├── bad-night.md
+│       └── _index.md
+└── hugotest.org
+#+end_src
+But on inspection of the gortons.md file, we find the anomoly mentioned above:
+#+begin_src markdown -n
+---
+title: "Gortons"
+author: ["Ken Grimes"]
+draft: false
+menu:
+  main:
+    weight: 2002
+    identifier: "gortons"
+---
+
+I think these gave me the herpes.
+#+end_src
+Uh oh! Not only did these fishsticks give us herpes, they are now part of the
+main menu. Worse, when the index page was exported, each of the subsequent posts
+became part of its content:
+#+begin_src markdown -n
+---
+title: "Fishsticks"
+author: ["Ken Grimes"]
+draft: false
+menu:
+  main:
+    weight: 1001
+    identifier: "fishsticks"
+---
+
+This section devoted to Orson Wells, R.I.P.
+
+
+## Van De Camps {#van-de-camps}
+
+If this is fish, I'll be a monkey's uncle.
+
+
+## Gortons {#gortons}
+
+I think these gave me the herpes.
+#+end_src
+This explains the flexibility of ox-hugo's straightforward parsing
+rules. Specifically, that any headings with an ~:EXPORT_FILE_NAME:~ tag will
+export everything beneath them as content. The content organization in this
+erroneous example duplicates data, but might still be useful if you wanted to
+create, for instance, an "all_content" page for the section. In general, though,
+be sure to put your index pages in subheadings (just as you do with normal
+pages) so that the tier-1 heading can be used for "global" definitions that
+affect all of the pages. A /correct/ section for fishsticks should look like
+this:
+#+begin_src org -n 24
+,* Fishsticks
+:PROPERTIES:
+:EXPORT_HUGO_SECTION: fishsticks
+:END:
+,** Fishsticks Home
+:PROPERTIES:
+:EXPORT_HUGO_MENU: :menu "main"
+:EXPORT_FILE_NAME: _index
+:END:
+This section devoted to Orson Wells, R.I.P.
+,** Van De Camps
+:PROPERTIES:
+:EXPORT_FILE_NAME: van-de-camps
+:END:
+If this is fish, I'll be a monkey's uncle.
+,** Gortons
+:PROPERTIES:
+:EXPORT_FILE_NAME: gortons
+:END:
+I think these gave me the herpes.
+#+end_src
+Now the homepage for the fishsticks section has a heading all its own, just like
+any other page. That's better! Now our homepage will output the content only
+from its subheading, and the other pages don't inherit the homepage's
+properties. All pages inherit the ~:EXPORT_HUGO_SECTION: fishsticks~ property
+though, which is what we want to ensure that these pages are exported to the
+proper section.
+
+*** Hugo Setup
+At this point, setting up Hugo and publishing is simple. [[https://gohugo.io/getting-started/installing/][Installing]] Hugo is
+pretty straightforward on any Unix-like system with a package manager; it is
+available on most distributions at this point. Windows installation is a bigger
+pain in the ass, but you should be used to that if you're still in the
+stone-age.
+
+Using ~hugo new site .~ on the command-line will create a new hugo site in the
+current directory, but ~hugo~ expects to be creating a new directory with this
+command and will complain if it already exists. It also provides the ~--force~
+option to allow creating a new site in an extant directory, but this too will
+fail if the *content* subdirectory already exists (which ox-hugo will create
+when you export).
+
+So you have three choices: 
+1. run ~hugo new site /path/to/some-new-dir~ and move your Org file to this new
+   directory
+2. simply ~rm -Rf content/~ to remove the content directory ox-hugo created,
+   then run ~hugo new site --force .~
+3. don't even bother with the ~hugo new site~ command, and make a *config.toml*
+   file manually (the only file really required for Hugo to run).
+
+It's convenient to do this through the ~hugo~ command because it will create
+Hugo-specific subdirectories like archetypes, layouts, themes, etcetera, in
+addition to populating a basic *config.toml* file. The subdirectories it creates
+aren't necessary, but help illustrate Hugo's structure. In any case, you'll want
+to wind up with a directory structure something like this (created with option 2
+above, extending from previous examples):
+#+begin_src
+.
+├── archetypes
+│   └── default.md
+├── config.toml
+├── content
+├── data
+├── hugotest.org
+├── layouts
+├── static
+└── themes
+#+end_src
+Exporting with ox-hugo using ~C-c C-e H A~ again will, as expected, fill the
+content directory with our content.
+#+begin_src
+.
+├── archetypes
+│   └── default.md
+├── config.toml
+├── content
+│   ├── fishsticks
+│   │   ├── gortons.md
+│   │   ├── _index.md
+│   │   └── van-de-camps.md
+│   ├── _index.md
+│   └── posts
+│       ├── bad-night.md
+│       └── _index.md
+├── data
+├── hugotest.org
+├── layouts
+├── static
+└── themes
+#+end_src
+
+**** Theming
+The last thing to do here is to download or create a theme for Hugo. As
+mentioned before, installing a theme is very simple. This blog uses a custom
+theme named Speedy that I have been developing to help myself learn Hugo's
+internals, but for this example I'll be using Kaushal Modi's [[https://github.com/kaushalmodi/hugo-bare-min-theme][bare-min theme]]. The
+bare-min theme is the best starting place out there for making new themes, and
+outputs basic HTML pages without any need to mess with CSS or JS. It also
+provides easy debugging facilities and search features.
+
+So let's install it! You can download the theme from its github page and extract
+it to the themes folder, or much more easily use git to clone it to your themes
+directory.  ~git clone https://github.com/kaushalmodi/hugo-bare-min-theme.git
+themes/bare-min~ Then open up your *config.toml* file, and add the theme.
+#+begin_src toml -n
+baseURL = "http://example.org/"
+languageCode = "en-us"
+title = "My New Hugo Site"
+# Adding a theme:
+theme = "bare-min"
+#+end_src
+Be sure that the theme's name matches the theme directory's name in the *themes/*
+directory of your project base directory. (e.g. *themes/bare-min* here). That's it
+for installing the theme.
+
+Now, running the command ~hugo~ with no subcommands will invoke the Hugo
+generator on the current directory, and output finalized content in the
+*public/* directory.
+#+begin_src
+.
+├── archetypes
+│   └── default.md
+├── config.toml
+├── content
+│   ├── fishsticks
+│   │   ├── gortons.md
+│   │   ├── _index.md
+│   │   └── van-de-camps.md
+│   ├── _index.md
+│   └── posts
+│       ├── bad-night.md
+│       └── _index.md
+├── data
+├── hugotest.org
+├── layouts
+├── public
+│   ├── categories
+│   │   ├── index.html
+│   │   └── index.xml
+│   ├── css
+│   │   └── github_chroma.css
+│   ├── fishsticks
+│   │   ├── gortons
+│   │   │   └── index.html
+│   │   ├── index.html
+│   │   ├── index.xml
+│   │   └── van-de-camps
+│   │       └── index.html
+│   ├── index.html
+│   ├── index.xml
+│   ├── js
+│   │   └── search.js
+│   ├── page
+│   │   └── 1
+│   │       └── index.html
+│   ├── posts
+│   │   ├── bad-night
+│   │   │   └── index.html
+│   │   ├── index.html
+│   │   └── index.xml
+│   ├── sitemap.xml
+│   └── tags
+│       ├── index.html
+│       └── index.xml
+├── static
+└── themes ...
+#+end_src
+Hugo, by default, generates xml files that are suitable for RSS feeds. With a
+theme installed, Hugo will produce more suitable web content (usually HTML) to
+be served over HTTP. The bare-min theme outputs HTML, provides CSS for doing
+chroma-based syntax highlighting (in case you include code blocks), and inline
+styles for basic page formatting. Generated pages also have a lot of useful
+debugging information. You'll also notice that Hugo has generated folders for
+"categories" and "tags". These are default organization labels for your content
+called [[https://gohugo.io/content-management/taxonomies/][taxonomies]].
+
+**** Taxonomies
+The taxonomy index pages allow users to browse content by category or tag. These
+taxonomies correspond to Org mode tags, and ox-hugo will automatically
+associated tagged headings with the tags taxonomy, or the categories taxonomy if
+prefixed with an @ symbol. You are free to define your own taxonomies, and even
+disable the default "tags" and "categories" taxonomies, but since Org mode tags
+directly translate to the default Hugo taxonomies, it makes sense to just use
+the default taxonomies for now.
+
+As an example of taxonomies, I'll add some tags and categories to our
+*hugotest.org* file to create a complete blog structure with tags and categories:
+#+begin_src org -n
+#+hugo_base_dir: .
+,* Homepage
+:PROPERTIES:
+:EXPORT_HUGO_SECTION:
+:EXPORT_FILE_NAME: _index
+:EXPORT_HUGO_MENU: :menu "main"
+:END:
+This is the home of my blog!
+,* Blog Posts
+:PROPERTIES:
+:EXPORT_HUGO_SECTION: posts
+:END:
+,** My Blog Homepage
+:PROPERTIES:
+:EXPORT_HUGO_MENU: :menu "main"
+:EXPORT_FILE_NAME: _index
+:END:
+Man, look at all my blog posts.
+,** One Bad Night  :@updates:herpes:fear:
+:PROPERTIES:
+:EXPORT_FILE_NAME: bad-night
+:END:
+Someone gave me herpes! Oh no!
+,* Fishsticks
+:PROPERTIES:
+:EXPORT_HUGO_SECTION: fishsticks
+:END:
+,** Fishsticks Home
+:PROPERTIES:
+:EXPORT_HUGO_MENU: :menu "main"
+:EXPORT_FILE_NAME: _index
+:END:
+This section devoted to Orson Wells, R.I.P.
+,** Van De Camps   :@reviews:fear:
+:PROPERTIES:
+:EXPORT_FILE_NAME: van-de-camps
+:END:
+If this is fish, I'll be a monkey's uncle.
+,** Gortons        :@reviews:herpes:
+:PROPERTIES:
+:EXPORT_FILE_NAME: gortons
+:END:
+I think these gave me the herpes.
+#+end_src
+Exporting *hugotest.org* with ~C-c C-e H A~ and generating with ~hugo~ will yield
+the same file structure as before, but this time we'll see that the categories
+and tags directories have sections for our newly added taxonomies.
+#+begin_src
+.
+└── public
+    ├── categories
+    │   ├── index.html
+    │   ├── index.xml
+    │   ├── reviews
+    │   │   ├── index.html
+    │   │   └── index.xml
+    │   └── updates
+    │       ├── index.html
+    │       └── index.xml
+    └── tags
+        ├── fear
+        │   ├── index.html
+        │   └── index.xml
+        ├── herpes
+        │   ├── index.html
+        │   └── index.xml
+        ├── index.html
+        └── index.xml
+#+end_src
+The index pages of taxonomies provide a list of all available taxonomies of that
+type, each with list pages that show all content associated with them. This
+allows themes to easily build navigation pages for browsing or querying
+taxonomies. Files like these are often useful to output as JSON (done by the
+theme) to allow Javascript-driven dynamic search features, but a simpler scheme
+can output HTML pages to browse taxonomies just as you would posts in a section
+(i.e. Org mode heading).
+
+**** Serving Content
+You can now serve the *public/* directory over an HTTP server. Hugo is packaged
+with an internal [[https://gohugo.io/commands/hugo_server/][HTTP server]] to help with testing, which is quite convenient
+because it can automatically refresh whenever content in its *content/* directory
+is updated (so when you export from ox-hugo, you don't have to run ~hugo~
+again). To use it, simply run ~hugo server~ and point your browser at
+http://localhost:1313 (1313 is the default ~--port~ argument for ~hugo server~).
+
+*** Additional Information
+Eventually you'll want to move on to [[https://themes.gohugo.io/][other themes]], or [[https://gohugo.io/themes/creating/][develop your own]], but at
+this point you've got a fully functional blog publishing workflow from start to
+finish that you can view in-browser as you develop.
+
+**** Attaching Files, Capturing Information & Automation
+Once you have a basic site structured in your Org file, you're ready to start
+throwing information in it. It is of course sufficient to open the Org file and
+edit it, but most Org mode users prefer to automate /everything/, and being able
+to use Org's capture feature to instantly populate new blog posts is extremely
+convenient.
+
+The [[https://ox-hugo.scripter.co/][ox-hugo documentation]] provides succinct explanations on how to do this,
+including elisp snippets for [[https://ox-hugo.scripter.co/doc/org-capture-setup/][capture setup]], [[https://ox-hugo.scripter.co/doc/images-in-content/][image linking]], and [[https://ox-hugo.scripter.co/doc/auto-export-on-saving/][automating
+exports]] when you save your Org file (so no more need to ~C-c C-e H A~ every
+time, just save the file as usual with ~C-x C-s~).
+
+**** Indexes and Page Resources
+You may be wondering why our index pages are exported as *_index* rather than
+*index*. Hugo uses a concept called [[https://gohugo.io/content-management/page-bundles/][Page Bundles]] to organize exported
+content. The gist of this is that a file named *index* is known as a "Leaf Node"
+and cannot have any children. A file named *_index* is considered a "Branch
+Node" and allows nesting other bundles beneath it. In other words, an Org
+heading with an exported file name of *index* will be treated as a single page
+with no subfolders. This is useful for single pages, but a section index
+(e.g. for a blog) with many subpages and other resources will more than likely
+want to allow nested bundles beneath it.
+
+You may export an Org heading as a Page Bundle by providing the Org property
+~:EXPORT_HUGO_BUNDLE:~ with an argument (string) that will become the name of
+the folder created. If you do this, you will need to set the
+~:EXPORT_FILE_NAME:~ property to either *index* for Leaf Nodes, or *_index* for
+Branch Nodes.
+
+The [[https://ox-hugo.scripter.co/doc/org-capture-setup/][capture setup]] provided by Kaushal Modi above provides methods to
+automatically create either a normal page, or a leaf node bundle when invoking
+Org Capture.
+
+**** Drafts and Automatic Timestamps
+By default, Hugo will not build any markdown files whose front-matter properties
+include ~draft: true~. This is very convenient for in-progress posts that you
+leave in your Org file, or in the *content/* directory. 
+
+Ox-hugo will always fill out the draft property, and by default every exported
+header will have its draft property set to *false*. However, ox-hugo also links
+this behavior to the TODO feature of Org. When you cycle a heading's TODO value
+with ~S-<RIGHT>~ (that's Shift + Right Arrow Key), you will signal to ox-hugo to
+export this heading as a draft (i.e. ~draft: true~), which will prevent Hugo
+from building it into an HTML page.
+
+When a heading is cycled to the DONE state in Org, it will automatically
+generate a timestamp for when the heading was closed. Ox-hugo will export DONE
+headings with ~draft: false~ and, better still, will use Org's timestamp to fill
+out the Date property in the markdown file. This makes it trivial to manage
+writing multiple posts at once, and automatically timestamp completion dates.
+
+You may also explicitly set this date parameter with the ~:EXPORT_DATE:~
+property, but the ease of using DONE-state switching is pretty hard to pass up.
+
+**** Renaming Tags and Other Properties
+If a theme you are using has any idiosyncrasies about your naming conventions
+(e.g. if you export your content to more than one site using more than one
+theme), ox-hugo provides a [[https://ox-hugo.scripter.co/doc/replace-front-matter-keys/][convenient way]] to automatically replace any key
+values on export. This can be done on a per-heading, or a per-file basis.
+
+To replace keys for the entire file, simply add a property to the top of your
+Org file. For example:
+#+begin_src org
+#+hugo_front_matter_key_replace: description>summary
+#+end_src
+This will make any ~:EXPORT_DESCRIPTION:~ properties export, instead, to a
+"summary" key in the front-matter of your output markdown file. It will also be
+able to replace exported values in the Org body:
+#+begin_src org
+,#+begin_description
+This is the description, 
+it has multiple lines too!
+It will export as the Summary value in front-matter
+,#+end_description
+#+end_src
+To do this on a per-heading basis, simply add the
+~:EXPORT_HUGO_FRONT_MATTER_KEY_REPLACE:~ property to a heading's property block,
+and the replacements will only occur within that heading.
+
+**** Why not use Hugo's internal Org parser?
+It's true that Hugo has an internal Org parser that is well maintained. It
+provides this as an alternative to markdown files. You may wonder, then, why
+someone would use Org mode to export to markdown instead of just letting Hugo
+parse the Org files itself. The answer is two-fold:
+1. Hugo's Org format is currently less feature complete than markdown, so
+   exporting from Org mode to the Hugo Org Format would limit potential output.
+2. Org mode is a lot more than just a file format, and its integration with your
+   system allows all kinds of benefits you can never get out of a simple Org
+   file parser.
+Therefore, supporting the Org format in another tool will give you a superior
+text format for organizing information, but it will be crippled when compared to
+an actual Org mode implementation. Ox-hugo gives you the ability to use Org mode
+itself to generate content.
+
+If Hugo's Org parser gains parity with, or eclipses, the Blackfriday Markdown
+format currently used by Hugo, ox-hugo could certainly be used to output those
+Org-Hugo files instead of the current markdown. This would be nice because it
+would allow Org mode users to view their output content more easily, but the
+advantages of ox-hugo and a real, bona fide Org mode would still remain.
+
+So you see, Hugo's Org parser isn't really in competition with ox-hugo, it's in
+competition with the /other/ Hugo parsers (e.g. markdown).
+
+*** Thanks
+Thanks to Kaushal Modi, who found this article on the googs within days of me
+posting it, for reaching out to me and providing thorough feedback and error
+checking.
+
+And special thanks to me, for once again overcoming Hamhock the Laziness Demon
+who has possessed me since birth and hates it when I do anything productive.
+
+** DONE I did a blog                                   :blog:org:emacs:hugo:
+CLOSED: [2018-04-06 Fri 18:29]
 :PROPERTIES:
 :EXPORT_FILE_NAME: ox-hugo
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :caption "Exporting to Hugo's Blackfriday Markdown from Orgmode"
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER+: :header /img/emacs-logo.png
+:EXPORT_DESCRIPTION: "Exporting to Hugo's Blackfriday Markdown from Orgmode"
+:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :header /img/org.png
 :END:
-#+attr_html: :class center
-[[file:static/img/ox-hugo.png]]
-
-ox-hugo is an [[http://en.wikipedia.org/wiki/Emacs][Emacs]] package providing a Hugo backend for the [[http://en.wikipedia.org/wiki/org-mode][org-mode]]
-exporter. Today I integrated its expectations about file structure into the
-Speedy theme for this blog, allowing me to keep all blog contents in a single
-org-mode file which exports content to [[http://en.wikipedia.org/wiki/markdown][markdown]] format for Hugo's excellent
-[[https://github.com/russross/blackfriday][blackfriday markdown parser]] (a markdown format with added features useful for
-blogs). Hugo does support limited parsing of org files internally, but the org
-file format is only a piece of what org-mode is all about. A full org
-integration is beyond the scope of most external tools, so org-mode is generally
-best used as an exporter. As an Emacs user, this allows me to instantly capture
-interesting information I come across and publish it within seconds. 
-
-Now I have no excuse!
-
-*** Using ox-hugo
-This is where I will explain how to use ox-hugo
-
-#+begin_export md
-Blackfriday Markdown: Syntax
-================
-
-<ul id="ProjectSubmenu">
-    <li><a href="/projects/markdown/" title="Markdown Project Page">Main</a></li>
-    <li><a href="/projects/markdown/basics" title="Markdown Basics">Basics</a></li>
-    <li><a class="selected" title="Markdown Syntax Documentation">Syntax</a></li>
-    <li><a href="/projects/markdown/license" title="Pricing and License Information">License</a></li>
-    <li><a href="/projects/markdown/dingus" title="Online Markdown Web Form">Dingus</a></li>
-</ul>
-
-
- *   [Overview](#overview)
-    *   [Philosophy](#philosophy)
-    *   [Inline HTML](#html)
-    *   [Automatic Escaping for Special Characters](#autoescape)
- *   [Block Elements](#block)
-    *   [Paragraphs and Line Breaks](#p)
-    *   [Headers](#header)
-    *   [Blockquotes](#blockquote)
-    *   [Lists](#list)
-    *   [Code Blocks](#precode)
-    *   [Horizontal Rules](#hr)
- *   [Span Elements](#span)
-    *   [Links](#link)
-    *   [Emphasis](#em)
-    *   [Code](#code)
-    *   [Images](#img)
- *   [Miscellaneous](#misc)
-    *   [Backslash Escapes](#backslash)
-    *   [Automatic Links](#autolink)
-
-
-**Note:** This document is itself written using Markdown; you
-can [see the source for it by adding '.text' to the URL][src].
-
-  [src]: https://raw.githubusercontent.com/russross/blackfriday/master/testdata/Markdown%20Documentation%20-%20Syntax.text
-
- * * *
-
-<h2 id="overview">Overview</h2>
-
-<h3 id="philosophy">Philosophy</h3>
-
-Markdown is intended to be as easy-to-read and easy-to-write as is feasible.
-
-Readability, however, is emphasized above all else. A Markdown-formatted
-document should be publishable as-is, as plain text, without looking
-like it's been marked up with tags or formatting instructions. While
-Markdown's syntax has been influenced by several existing text-to-HTML
-filters -- including [Setext] [1], [atx] [2], [Textile] [3], [reStructuredText] [4],
-[Grutatext] [5], and [EtText] [6] -- the single biggest source of
-inspiration for Markdown's syntax is the format of plain text email.
-
-  [1]: http://docutils.sourceforge.net/mirror/setext.html
-  [2]: http://www.aaronsw.com/2002/atx/
-  [3]: http://textism.com/tools/textile/
-  [4]: http://docutils.sourceforge.net/rst.html
-  [5]: http://www.triptico.com/software/grutatxt.html
-  [6]: http://ettext.taint.org/doc/
-
-To this end, Markdown's syntax is comprised entirely of punctuation
-characters, which punctuation characters have been carefully chosen so
-as to look like what they mean. E.g., asterisks around a word actually
-look like \*emphasis\*. Markdown lists look like, well, lists. Even
-blockquotes look like quoted passages of text, assuming you've ever
-used email.
-
-
-
-<h3 id="html">Inline HTML</h3>
-
-Markdown's syntax is intended for one purpose: to be used as a
-format for *writing* for the web.
-
-Markdown is not a replacement for HTML, or even close to it. Its
-syntax is very small, corresponding only to a very small subset of
-HTML tags. The idea is *not* to create a syntax that makes it easier
-to insert HTML tags. In my opinion, HTML tags are already easy to
-insert. The idea for Markdown is to make it easy to read, write, and
-edit prose. HTML is a *publishing* format; Markdown is a *writing*
-format. Thus, Markdown's formatting syntax only addresses issues that
-can be conveyed in plain text.
-
-For any markup that is not covered by Markdown's syntax, you simply
-use HTML itself. There's no need to preface it or delimit it to
-indicate that you're switching from Markdown to HTML; you just use
-the tags.
-
-The only restrictions are that block-level HTML elements -- e.g. `<div>`,
-`<table>`, `<pre>`, `<p>`, etc. -- must be separated from surrounding
-content by blank lines, and the start and end tags of the block should
-not be indented with tabs or spaces. Markdown is smart enough not
-to add extra (unwanted) `<p>` tags around HTML block-level tags.
-
-For example, to add an HTML table to a Markdown article:
-
-    This is a regular paragraph.
-
-    <table>
-        <tr>
-            <td>Foo</td>
-        </tr>
-    </table>
-
-    This is another regular paragraph.
-
-Note that Markdown formatting syntax is not processed within block-level
-HTML tags. E.g., you can't use Markdown-style `*emphasis*` inside an
-HTML block.
-
-Span-level HTML tags -- e.g. `<span>`, `<cite>`, or `<del>` -- can be
-used anywhere in a Markdown paragraph, list item, or header. If you
-want, you can even use HTML tags instead of Markdown formatting; e.g. if
-you'd prefer to use HTML `<a>` or `<img>` tags instead of Markdown's
-link or image syntax, go right ahead.
-
-Unlike block-level HTML tags, Markdown syntax *is* processed within
-span-level tags.
-
-
-<h3 id="autoescape">Automatic Escaping for Special Characters</h3>
-
-In HTML, there are two characters that demand special treatment: `<`
-and `&`. Left angle brackets are used to start tags; ampersands are
-used to denote HTML entities. If you want to use them as literal
-characters, you must escape them as entities, e.g. `&lt;`, and
-`&amp;`.
-
-Ampersands in particular are bedeviling for web writers. If you want to
-write about 'AT&T', you need to write '`AT&amp;T`'. You even need to
-escape ampersands within URLs. Thus, if you want to link to:
-
-    http://images.google.com/images?num=30&q=larry+bird
-
-you need to encode the URL as:
-
-    http://images.google.com/images?num=30&amp;q=larry+bird
-
-in your anchor tag `href` attribute. Needless to say, this is easy to
-forget, and is probably the single most common source of HTML validation
-errors in otherwise well-marked-up web sites.
-
-Markdown allows you to use these characters naturally, taking care of
-all the necessary escaping for you. If you use an ampersand as part of
-an HTML entity, it remains unchanged; otherwise it will be translated
-into `&amp;`.
-
-So, if you want to include a copyright symbol in your article, you can write:
-
-    &copy;
-
-and Markdown will leave it alone. But if you write:
-
-    AT&T
-
-Markdown will translate it to:
-
-    AT&amp;T
-
-Similarly, because Markdown supports [inline HTML](#html), if you use
-angle brackets as delimiters for HTML tags, Markdown will treat them as
-such. But if you write:
-
-    4 < 5
-
-Markdown will translate it to:
-
-    4 &lt; 5
-
-However, inside Markdown code spans and blocks, angle brackets and
-ampersands are *always* encoded automatically. This makes it easy to use
-Markdown to write about HTML code. (As opposed to raw HTML, which is a
-terrible format for writing about HTML syntax, because every single `<`
-and `&` in your example code needs to be escaped.)
-
-
- * * *
-
-
-<h2 id="block">Block Elements</h2>
-
-
-<h3 id="p">Paragraphs and Line Breaks</h3>
-
-A paragraph is simply one or more consecutive lines of text, separated
-by one or more blank lines. (A blank line is any line that looks like a
-blank line -- a line containing nothing but spaces or tabs is considered
-blank.) Normal paragraphs should not be intended with spaces or tabs.
-
-The implication of the "one or more consecutive lines of text" rule is
-that Markdown supports "hard-wrapped" text paragraphs. This differs
-significantly from most other text-to-HTML formatters (including Movable
-Type's "Convert Line Breaks" option) which translate every line break
-character in a paragraph into a `<br />` tag.
-
-When you *do* want to insert a `<br />` break tag using Markdown, you
-end a line with two or more spaces, then type return.
-
-Yes, this takes a tad more effort to create a `<br />`, but a simplistic
-"every line break is a `<br />`" rule wouldn't work for Markdown.
-Markdown's email-style [blockquoting][bq] and multi-paragraph [list items][l]
-work best -- and look better -- when you format them with hard breaks.
-
-  [bq]: #blockquote
-  [l]:  #list
-
-
-
-<h3 id="header">Headers</h3>
-
-Markdown supports two styles of headers, [Setext] [1] and [atx] [2].
-
-Setext-style headers are "underlined" using equal signs (for first-level
-headers) and dashes (for second-level headers). For example:
-
-    This is an H1
-    =============
-
-    This is an H2
-    -------------
-
-Any number of underlining `=`'s or `-`'s will work.
-
-Atx-style headers use 1-6 hash characters at the start of the line,
-corresponding to header levels 1-6. For example:
-
-    # This is an H1
-
-    ## This is an H2
-
-    ###### This is an H6
-
-Optionally, you may "close" atx-style headers. This is purely
-cosmetic -- you can use this if you think it looks better. The
-closing hashes don't even need to match the number of hashes
-used to open the header. (The number of opening hashes
-determines the header level.) :
-
-    # This is an H1 #
-
-    ## This is an H2 ##
-
-    ### This is an H3 ######
-
-
-<h3 id="blockquote">Blockquotes</h3>
-
-Markdown uses email-style `>` characters for blockquoting. If you're
-familiar with quoting passages of text in an email message, then you
-know how to create a blockquote in Markdown. It looks best if you hard
-wrap the text and put a `>` before every line:
-
-    > This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
-    > consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
-    > Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
-    > 
-    > Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
-    > id sem consectetuer libero luctus adipiscing.
-
-Markdown allows you to be lazy and only put the `>` before the first
-line of a hard-wrapped paragraph:
-
-    > This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
-    consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
-    Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
-
-    > Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
-    id sem consectetuer libero luctus adipiscing.
-
-Blockquotes can be nested (i.e. a blockquote-in-a-blockquote) by
-adding additional levels of `>`:
-
-    > This is the first level of quoting.
-    >
-    > > This is nested blockquote.
-    >
-    > Back to the first level.
-
-Blockquotes can contain other Markdown elements, including headers, lists,
-and code blocks:
-
-       > ## This is a header.
-       > 
-       > 1.   This is the first list item.
-       > 2.   This is the second list item.
-       > 
-       > Here's some example code:
-       > 
-       >     return shell_exec("echo $input | $markdown_script");
-
-Any decent text editor should make email-style quoting easy. For
-example, with BBEdit, you can make a selection and choose Increase
-Quote Level from the Text menu.
-
-
-<h3 id="list">Lists</h3>
-
-Markdown supports ordered (numbered) and unordered (bulleted) lists.
-
-Unordered lists use asterisks, pluses, and hyphens -- interchangably
--- as list markers:
-
-    *   Red
-    *   Green
-    *   Blue
-
-is equivalent to:
-
-    +   Red
-    +   Green
-    +   Blue
-
-and:
-
-    -   Red
-    -   Green
-    -   Blue
-
-Ordered lists use numbers followed by periods:
-
-    1.  Bird
-    2.  McHale
-    3.  Parish
-
-It's important to note that the actual numbers you use to mark the
-list have no effect on the HTML output Markdown produces. The HTML
-Markdown produces from the above list is:
-
-    <ol>
-    <li>Bird</li>
-    <li>McHale</li>
-    <li>Parish</li>
-    </ol>
-
-If you instead wrote the list in Markdown like this:
-
-    1.  Bird
-    1.  McHale
-    1.  Parish
-
-or even:
-
-    3. Bird
-    1. McHale
-    8. Parish
-
-you'd get the exact same HTML output. The point is, if you want to,
-you can use ordinal numbers in your ordered Markdown lists, so that
-the numbers in your source match the numbers in your published HTML.
-But if you want to be lazy, you don't have to.
-
-If you do use lazy list numbering, however, you should still start the
-list with the number 1. At some point in the future, Markdown may support
-starting ordered lists at an arbitrary number.
-
-List markers typically start at the left margin, but may be indented by
-up to three spaces. List markers must be followed by one or more spaces
-or a tab.
-
-To make lists look nice, you can wrap items with hanging indents:
-
-    *   Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
-        Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi,
-        viverra nec, fringilla in, laoreet vitae, risus.
-    *   Donec sit amet nisl. Aliquam semper ipsum sit amet velit.
-        Suspendisse id sem consectetuer libero luctus adipiscing.
-
-But if you want to be lazy, you don't have to:
-
-    *   Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
-    Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi,
-    viverra nec, fringilla in, laoreet vitae, risus.
-    *   Donec sit amet nisl. Aliquam semper ipsum sit amet velit.
-    Suspendisse id sem consectetuer libero luctus adipiscing.
-
-If list items are separated by blank lines, Markdown will wrap the
-items in `<p>` tags in the HTML output. For example, this input:
-
-    *   Bird
-    *   Magic
-
-will turn into:
-
-    <ul>
-    <li>Bird</li>
-    <li>Magic</li>
-    </ul>
-
-But this:
-
-    *   Bird
-
-    *   Magic
-
-will turn into:
-
-    <ul>
-    <li><p>Bird</p></li>
-    <li><p>Magic</p></li>
-    </ul>
-
-List items may consist of multiple paragraphs. Each subsequent
-paragraph in a list item must be intended by either 4 spaces
-or one tab:
+ox-hugo is an [[http://en.wikipedia.org/wiki/Emacs][Emacs]] package for [[http://en.wikipedia.org/wiki/org-mode][Org mode]] that produces input for the static
+content generator [[https://gohugo.io/][Hugo]], which I use for this website. Today I integrated its
+expectations about file structure into the Speedy theme for this blog, allowing
+me to keep all blog contents in a single Org mode file and export [[http://en.wikipedia.org/wiki/markdown][markdown]]
+content for Hugo's excellent [[https://github.com/russross/blackfriday][blackfriday markdown parser]] (a markdown format with
+many added features). Hugo does support limited parsing of org files internally,
+but Org mode features like inline spreadsheets and system communication are
+beyond the scope of most external tools, so Org mode is best used as an
+exporter. As an Emacs user, this allows me to instantly capture interesting
+information I come across and publish it within seconds. Now I have no excuses!
 
-    1.  This is a list item with two paragraphs. Lorem ipsum dolor
-        sit amet, consectetuer adipiscing elit. Aliquam hendrerit
-        mi posuere lectus.
-
-        Vestibulum enim wisi, viverra nec, fringilla in, laoreet
-        vitae, risus. Donec sit amet nisl. Aliquam semper ipsum
-        sit amet velit.
-
-    2.  Suspendisse id sem consectetuer libero luctus adipiscing.
-
-It looks nice if you indent every line of the subsequent
-paragraphs, but here again, Markdown will allow you to be
-lazy:
-
-    *   This is a list item with two paragraphs.
-
-        This is the second paragraph in the list item. You're
-    only required to indent the first line. Lorem ipsum dolor
-    sit amet, consectetuer adipiscing elit.
-
-    *   Another item in the same list.
-
-To put a blockquote within a list item, the blockquote's `>`
-delimiters need to be indented:
-
-    *   A list item with a blockquote:
-
-        > This is a blockquote
-        > inside a list item.
-
-To put a code block within a list item, the code block needs
-to be indented *twice* -- 8 spaces or two tabs:
-
-    *   A list item with a code block:
-
-            <code goes here>
-
-
-It's worth noting that it's possible to trigger an ordered list by
-accident, by writing something like this:
-
-    1986. What a great season.
-
-In other words, a *number-period-space* sequence at the beginning of a
-line. To avoid this, you can backslash-escape the period:
-
-    1986\. What a great season.
-
-
-
-<h3 id="precode">Code Blocks</h3>
-
-Pre-formatted code blocks are used for writing about programming or
-markup source code. Rather than forming normal paragraphs, the lines
-of a code block are interpreted literally. Markdown wraps a code block
-in both `<pre>` and `<code>` tags.
-
-To produce a code block in Markdown, simply indent every line of the
-block by at least 4 spaces or 1 tab. For example, given this input:
-
-    This is a normal paragraph:
-
-        This is a code block.
-
-Markdown will generate:
-
-    <p>This is a normal paragraph:</p>
-
-    <pre><code>This is a code block.
-    </code></pre>
-
-One level of indentation -- 4 spaces or 1 tab -- is removed from each
-line of the code block. For example, this:
-
-    Here is an example of AppleScript:
-
-        tell application "Foo"
-            beep
-        end tell
-
-will turn into:
-
-    <p>Here is an example of AppleScript:</p>
-
-    <pre><code>tell application "Foo"
-        beep
-    end tell
-    </code></pre>
-
-A code block continues until it reaches a line that is not indented
-(or the end of the article).
-
-Within a code block, ampersands (`&`) and angle brackets (`<` and `>`)
-are automatically converted into HTML entities. This makes it very
-easy to include example HTML source code using Markdown -- just paste
-it and indent it, and Markdown will handle the hassle of encoding the
-ampersands and angle brackets. For example, this:
-
-        <div class="footer">
-            &copy; 2004 Foo Corporation
-        </div>
-
-will turn into:
-
-    <pre><code>&lt;div class="footer"&gt;
-        &amp;copy; 2004 Foo Corporation
-    &lt;/div&gt;
-    </code></pre>
-
-Regular Markdown syntax is not processed within code blocks. E.g.,
-asterisks are just literal asterisks within a code block. This means
-it's also easy to use Markdown to write about Markdown's own syntax.
-
-
-
-<h3 id="hr">Horizontal Rules</h3>
-
-You can produce a horizontal rule tag (`<hr />`) by placing three or
-more hyphens, asterisks, or underscores on a line by themselves. If you
-wish, you may use spaces between the hyphens or asterisks. Each of the
-following lines will produce a horizontal rule:
-
-    * * *
-
-    ***
-
-    *****
-       
-    - - -
-
-    ---------------------------------------
-
-       _ _ _
-
-
- * * *
-
-<h2 id="span">Span Elements</h2>
-
-<h3 id="link">Links</h3>
-
-Markdown supports two style of links: *inline* and *reference*.
-
-In both styles, the link text is delimited by [square brackets].
-
-To create an inline link, use a set of regular parentheses immediately
-after the link text's closing square bracket. Inside the parentheses,
-put the URL where you want the link to point, along with an *optional*
-title for the link, surrounded in quotes. For example:
-
-    This is [an example](http://example.com/ "Title") inline link.
-
-    [This link](http://example.net/) has no title attribute.
-
-Will produce:
-
-    <p>This is <a href="http://example.com/" title="Title">
-    an example</a> inline link.</p>
-
-    <p><a href="http://example.net/">This link</a> has no
-    title attribute.</p>
-
-If you're referring to a local resource on the same server, you can
-use relative paths:
-
-    See my [About](/about/) page for details.
-
-Reference-style links use a second set of square brackets, inside
-which you place a label of your choosing to identify the link:
-
-    This is [an example][id] reference-style link.
-
-You can optionally use a space to separate the sets of brackets:
-
-    This is [an example] [id] reference-style link.
-
-Then, anywhere in the document, you define your link label like this,
-on a line by itself:
-
-    [id]: http://example.com/  "Optional Title Here"
-
-That is:
-
- *   Square brackets containing the link identifier (optionally
-    indented from the left margin using up to three spaces);
- *   followed by a colon;
- *   followed by one or more spaces (or tabs);
- *   followed by the URL for the link;
- *   optionally followed by a title attribute for the link, enclosed
-    in double or single quotes.
-
-The link URL may, optionally, be surrounded by angle brackets:
-
-    [id]: <http://example.com/>  "Optional Title Here"
-
-You can put the title attribute on the next line and use extra spaces
-or tabs for padding, which tends to look better with longer URLs:
-
-    [id]: http://example.com/longish/path/to/resource/here
-        "Optional Title Here"
-
-Link definitions are only used for creating links during Markdown
-processing, and are stripped from your document in the HTML output.
-
-Link definition names may constist of letters, numbers, spaces, and punctuation -- but they are *not* case sensitive. E.g. these two links:
-
-       [link text][a]
-       [link text][A]
-
-are equivalent.
-
-The *implicit link name* shortcut allows you to omit the name of the
-link, in which case the link text itself is used as the name.
-Just use an empty set of square brackets -- e.g., to link the word
-"Google" to the google.com web site, you could simply write:
-
-       [Google][]
-
-And then define the link:
-
-       [Google]: http://google.com/
-
-Because link names may contain spaces, this shortcut even works for
-multiple words in the link text:
-
-       Visit [Daring Fireball][] for more information.
-
-And then define the link:
-       
-       [Daring Fireball]: http://daringfireball.net/
-
-Link definitions can be placed anywhere in your Markdown document. I
-tend to put them immediately after each paragraph in which they're
-used, but if you want, you can put them all at the end of your
-document, sort of like footnotes.
-
-Here's an example of reference links in action:
-
-    I get 10 times more traffic from [Google] [1] than from
-    [Yahoo] [2] or [MSN] [3].
-
-      [1]: http://google.com/        "Google"
-      [2]: http://search.yahoo.com/  "Yahoo Search"
-      [3]: http://search.msn.com/    "MSN Search"
-
-Using the implicit link name shortcut, you could instead write:
-
-    I get 10 times more traffic from [Google][] than from
-    [Yahoo][] or [MSN][].
-
-      [google]: http://google.com/        "Google"
-      [yahoo]:  http://search.yahoo.com/  "Yahoo Search"
-      [msn]:    http://search.msn.com/    "MSN Search"
-
-Both of the above examples will produce the following HTML output:
-
-    <p>I get 10 times more traffic from <a href="http://google.com/"
-    title="Google">Google</a> than from
-    <a href="http://search.yahoo.com/" title="Yahoo Search">Yahoo</a>
-    or <a href="http://search.msn.com/" title="MSN Search">MSN</a>.</p>
-
-For comparison, here is the same paragraph written using
-Markdown's inline link style:
-
-    I get 10 times more traffic from [Google](http://google.com/ "Google")
-    than from [Yahoo](http://search.yahoo.com/ "Yahoo Search") or
-    [MSN](http://search.msn.com/ "MSN Search").
-
-The point of reference-style links is not that they're easier to
-write. The point is that with reference-style links, your document
-source is vastly more readable. Compare the above examples: using
-reference-style links, the paragraph itself is only 81 characters
-long; with inline-style links, it's 176 characters; and as raw HTML,
-it's 234 characters. In the raw HTML, there's more markup than there
-is text.
-
-With Markdown's reference-style links, a source document much more
-closely resembles the final output, as rendered in a browser. By
-allowing you to move the markup-related metadata out of the paragraph,
-you can add links without interrupting the narrative flow of your
-prose.
-
-
-<h3 id="em">Emphasis</h3>
-
-Markdown treats asterisks (`*`) and underscores (`_`) as indicators of
-emphasis. Text wrapped with one `*` or `_` will be wrapped with an
-HTML `<em>` tag; double `*`'s or `_`'s will be wrapped with an HTML
-`<strong>` tag. E.g., this input:
-
-    *single asterisks*
-
-    _single underscores_
-
-    **double asterisks**
-
-    __double underscores__
-
-will produce:
-
-    <em>single asterisks</em>
-
-    <em>single underscores</em>
-
-    <strong>double asterisks</strong>
-
-    <strong>double underscores</strong>
-
-You can use whichever style you prefer; the lone restriction is that
-the same character must be used to open and close an emphasis span.
-
-Emphasis can be used in the middle of a word:
-
-    un*fucking*believable
-
-But if you surround an `*` or `_` with spaces, it'll be treated as a
-literal asterisk or underscore.
-
-To produce a literal asterisk or underscore at a position where it
-would otherwise be used as an emphasis delimiter, you can backslash
-escape it:
-
-    \*this text is surrounded by literal asterisks\*
-
-
-
-<h3 id="code">Code</h3>
-
-To indicate a span of code, wrap it with backtick quotes (`` ` ``).
-Unlike a pre-formatted code block, a code span indicates code within a
-normal paragraph. For example:
-
-    Use the `printf()` function.
-
-will produce:
-
-    <p>Use the <code>printf()</code> function.</p>
-
-To include a literal backtick character within a code span, you can use
-multiple backticks as the opening and closing delimiters:
-
-    ``There is a literal backtick (`) here.``
-
-which will produce this:
-
-    <p><code>There is a literal backtick (`) here.</code></p>
-
-The backtick delimiters surrounding a code span may include spaces --
-one after the opening, one before the closing. This allows you to place
-literal backtick characters at the beginning or end of a code span:
-
-       A single backtick in a code span: `` ` ``
-       
-       A backtick-delimited string in a code span: `` `foo` ``
-
-will produce:
-
-       <p>A single backtick in a code span: <code>`</code></p>
-       
-       <p>A backtick-delimited string in a code span: <code>`foo`</code></p>
-
-With a code span, ampersands and angle brackets are encoded as HTML
-entities automatically, which makes it easy to include example HTML
-tags. Markdown will turn this:
-
-    Please don't use any `<blink>` tags.
-
-into:
-
-    <p>Please don't use any <code>&lt;blink&gt;</code> tags.</p>
-
-You can write this:
-
-    `&#8212;` is the decimal-encoded equivalent of `&mdash;`.
-
-to produce:
-
-    <p><code>&amp;#8212;</code> is the decimal-encoded
-    equivalent of <code>&amp;mdash;</code>.</p>
-
-
-
-<h3 id="img">Images</h3>
-
-Admittedly, it's fairly difficult to devise a "natural" syntax for
-placing images into a plain text document format.
-
-Markdown uses an image syntax that is intended to resemble the syntax
-for links, allowing for two styles: *inline* and *reference*.
-
-Inline image syntax looks like this:
-
-    ![Alt text](/path/to/img.jpg)
-
-    ![Alt text](/path/to/img.jpg "Optional title")
-
-That is:
-
- *   An exclamation mark: `!`;
- *   followed by a set of square brackets, containing the `alt`
-    attribute text for the image;
- *   followed by a set of parentheses, containing the URL or path to
-    the image, and an optional `title` attribute enclosed in double
-    or single quotes.
-
-Reference-style image syntax looks like this:
-
-    ![Alt text][id]
-
-Where "id" is the name of a defined image reference. Image references
-are defined using syntax identical to link references:
-
-    [id]: url/to/image  "Optional title attribute"
-
-As of this writing, Markdown has no syntax for specifying the
-dimensions of an image; if this is important to you, you can simply
-use regular HTML `<img>` tags.
-
-
- * * *
-
-
-<h2 id="misc">Miscellaneous</h2>
-
-<h3 id="autolink">Automatic Links</h3>
-
-Markdown supports a shortcut style for creating "automatic" links for URLs and email addresses: simply surround the URL or email address with angle brackets. What this means is that if you want to show the actual text of a URL or email address, and also have it be a clickable link, you can do this:
-
-    <http://example.com/>
-    
-Markdown will turn this into:
-
-    <a href="http://example.com/">http://example.com/</a>
-
-Automatic links for email addresses work similarly, except that
-Markdown will also perform a bit of randomized decimal and hex
-entity-encoding to help obscure your address from address-harvesting
-spambots. For example, Markdown will turn this:
-
-    <address@example.com>
-
-into something like this:
-
-    <a href="&#x6D;&#x61;i&#x6C;&#x74;&#x6F;:&#x61;&#x64;&#x64;&#x72;&#x65;
-    &#115;&#115;&#64;&#101;&#120;&#x61;&#109;&#x70;&#x6C;e&#x2E;&#99;&#111;
-    &#109;">&#x61;&#x64;&#x64;&#x72;&#x65;&#115;&#115;&#64;&#101;&#120;&#x61;
-    &#109;&#x70;&#x6C;e&#x2E;&#99;&#111;&#109;</a>
-
-which will render in a browser as a clickable link to "address@example.com".
-
-(This sort of entity-encoding trick will indeed fool many, if not
-most, address-harvesting bots, but it definitely won't fool all of
-them. It's better than nothing, but an address published in this way
-will probably eventually start receiving spam.)
-
-
-
-<h3 id="backslash">Backslash Escapes</h3>
-
-Markdown allows you to use backslash escapes to generate literal
-characters which would otherwise have special meaning in Markdown's
-formatting syntax. For example, if you wanted to surround a word with
-literal asterisks (instead of an HTML `<em>` tag), you can backslashes
-before the asterisks, like this:
-
-    \*literal asterisks\*
-
-Markdown provides backslash escapes for the following characters:
-
-    \   backslash
-    `   backtick
-    *   asterisk
-    _   underscore
-    {}  curly braces
-    []  square brackets
-    ()  parentheses
-    #   hash mark
-       +       plus sign
-       -       minus sign (hyphen)
-    .   dot
-    !   exclamation mark
-#+end_export
 * Forth
 :PROPERTIES:
 :EXPORT_FILE_NAME: _index
 :EXPORT_HUGO_MENU: :menu "main"
 :EXPORT_HUGO_SECTION: forth
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :caption "Highly Factored Code"
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER+: :header /img/forth.png
+:EXPORT_DESCRIPTION: "Highly Factored Code"
+:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :header /img/forth.png
 :END:
 This is where I post my watForth programs.
 
-* Git
+At present, my forth testbed is located at https://forth.kengrimes.com
+
+* Code Repositories
 :PROPERTIES:
 :EXPORT_FILE_NAME: _index
-:EXPORT_HUGO_MENU: :menu "main"
+:EXPORT_HUGO_MENU: :menu "main" :title Git
 :EXPORT_HUGO_SECTION: git
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :caption "Code Repositories"
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER+: :header /img/git.png
+:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :header /img/git.png
 :END:
 <iframe height="600px" width="100%" frameborder="0" scrolling="no" src="/gitweb" onload="resizeIFrame(this)">
+  <meta http-equiv="Content-type" content="text/html;charset=UTF-8">
   <a href="https://git.kengrimes.com">https://git.kengrimes.com</a>
 </iframe>
 
 * About
 :PROPERTIES:
 :EXPORT_HUGO_SECTION: about
-:EXPORT_HUGO_MENU: :menu "main"
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :caption '("Ken Grimes" "Computer Scientist At Large")
-:EXPORT_HUGO_CUSTOM_FRONT_MATTER+: :header /img/home.png
+:EXPORT_HUGO_MENU: :menu "main" :title About
+:EXPORT_HUGO_CUSTOM_FRONT_MATTER: :header /img/home.png
 :EXPORT_FILE_NAME: _index
 :END:
-This is a website I've constructed for the purpose of developing blogging
-software. I will probably blog with it once development is complete. In the mean
-time, if you're curious, this is my [[file:/cv.pdf][curriculum vitae]]
+#+begin_description
+Ken Grimes
+
+Computer Scientist
+
+At Large
+#+end_description
+Hi! I'm Ken, a 34-year-old computer scientist currently living in Irvine,
+California. This is a website I've constructed for the purpose of developing
+web-facing software. I will probably blog with it once development is
+complete. In the meantime, if you're curious, this is my [[file:static/cv.pdf][curriculum vitae]]