---
navhome: /docs/
sort: 3
title: A static site
---

# A static site

Hosting a static tree of content is easy.  Let's put together a really
simple site for an imaginary Urbit meetup group.

We assume you have at least followed the beginning of [our first
example](./blog) and created a desk called `site` and mounted it to
unix.

In `site/web/meet.md` put:

    ---
    navdpad: false
    navmode: navbar
    navpath: /meet
    navhome: /meet
    ---

    # Neo-Tokyo Urbit meetup

    <img src="https://ofheroesandcliches.files.wordpress.com/2014/06/neo-tokyo.png" width="100%"/>

    Hi there! We meet once a week at The Chat to work on Urbit projects
    together.

    You can find out more about the group on the [about](about) page and
    follow our projects in [projects](projects).

This is our landing page.  Here we're using a few new bits of YAML:
`navdpad`, `navmode` and `navpath`.  `navdpad` just turns off the nav
arrows. `navmode` can be set to 'navbar' to switch to a horizontal top
nav instead of a left bar. `navpath` sets the path to load the nav
items from.  

Let's create `about.md` and `projects.md`.  From Unix use the
technique from before to create a new directory: `mkdir
your-urbit/site/web/meet/; touch your-urbit/site/web/meet/about.md`.
Then put the following in `site/web/about.md`:

    ---
    navdpad: false
    navmode: navbar
    navpath: /meet
    navhome: /meet
    title: About
    ---

    # About

    ## Mission statement

    The existing framework cannot subdue the new human force that is increasing day by day alongside the irresistible development of technology and the dissatisfaction of its possible uses in our senseless social life.

    ## Members

    Membership is open to anyone.  Just send a message to `~talsur-todres`.

    - Shōtarō Kaneda
    - Motoko Kusanagi
    - Ishikawa
    - Faye Valentine
    - Spike Spiegel

And `site/web/projects.md`:

    ---
    navdpad: false
    navmode: navbar
    navpath: /meet
    navhome: /meet
    title: Projects
    ---

    # Projects

    ## Active

    <list />

    ## Discussion

    <div class="mini-module">
        <script src="/~/at/lib/js/urb.js"/>
        <script src="https://cdn.rawgit.com/seatgeek/react-infinite/0.8.0/dist/react-infinite.js"/>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.11.2/moment-with-locales.js"/>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.1/moment-timezone.js"/>
        <script src="/talk/main.js"/>
        <link href="/talk/main.css" rel="stylesheet" />
        <talk readonly="" chrono="reverse" station="comments" />
    </div>

This page introduces a new thing: the `:talk` module.  Inside of the
`mini-module` div we load the scripts needed by the `<talk>`
component.  The `<talk>` component is a static component for
displaying a feed from a talk channel inline.  Here we're going to
display the discussion from our active projects inline.

We'll need a few active projects though.  From unix: `mkdir
your-urbit/site/web/meet/projects; touch
your-urbit/site/web/meet/projects/bike.md`.

In `site/web/meet/projects/bike.md`:

    ---
    navdpad: false
    navmode: navbar
    navpath: /meet
    navhome: /meet
    title: Kaneda's Bike
    comments: true
    ---

    # Urbit on a Motorcycle

    Discussion on getting urbit to power Kaneda's motorcycle.

Here we just use the `comments` YAML to enable comments on the page.
Adding other imaginary projects is left to the reader.  

Building a static site takes only a few minutes and a few markdown
files.  Have fun!