/hyde/layouts/starter/content/first-steps.html
http://github.com/hyde/hyde · HTML · 85 lines · 61 code · 24 blank · 0 comment · 0 complexity · 8a66f4c835a967c027aa12b085ef23e3 MD5 · raw file
- ---
- extends: base.j2
- title: First steps
- ---
- {# In-file metadata. Supplements data from the site's configuration file
- and node (folder) level data in "meta.yaml" files.
- Use the AutoExtendPlugin to extend templates from metadata. In this
- case the metadata and "extends" statement has to be on the top of the
- file.
- #}
- {% block content %}
- Walk this way if you're a beginner
- ==================================
- This template was created to look at its code. So you should spend about
- 5% of your time looking at the web from the outside and the other 95%
- tinkering with things under the hood.
- The template is not perfect nor does it contain the best practices. It
- is not even consistent. It is designed to help you with the learning
- process. If you follow the steps below, you'll get a pretty good picture of
- how things work. Every step adds some new features and builds upon the
- previous one.
- 1. Site structure and configuration file
- ----------------------------------------
- The site is made of two folders and a [Hyde configuration][hyde_config]
- file. The folders are **content** and **layout**.
- **content** contains all your page content, blog articles, pictures and
- resources like CSS and JavaScript. Everything that is unique is here.
- **layout** contains templates and macros. Everything that you'll want to
- reuse is here.
- 2. Jinja2 template
- ------------------
- **base.j2** is a very short and simple Jinja2 template. This way you can
- concentrate on some of the basic features. Notice meta and context
- variables invocation inside curly braces, dynamic media path generation
- and running all content through the Markdown filter.
- **macros.j2** contains macros for common and repetitive tasks.
- For more information or to try something new, visit the extensive [Jinja2
- documentation][jinja2_docs].
- 3. Content
- ----------
- Look at the three files in this order: [index.html](index.html),
- [first-steps.html](first-steps.html) and [about.html](about.html).
- [Index](index.html) extends the base layout in the classic Jinja way and
- fills the content block with some simple Markdown data.
- [First steps](first-steps.html) goes a step furher. It introduces the
- in-file metadata that plugins will use to extend and fill the layout. It
- also uses some new Markdown features.
- [About](about.html) has a **default_block** metadata and mixes Markdown
- content with Jinja templates.
- [hyde_config]: http://hyde.github.com/config.html "Hyde configuration"
- [jinja2_docs]: http://jinja.pocoo.org/docs/templates/ "Jinja2 documentation"
- 4. Advanced sections
- --------------------
- While searching and navigating this template you'll find more files and
- sections than mentioned on this page (something like **meta.yaml**
- files, the **content/advanced** folder or other Jinja templates). Those
- files are needed for the [advanced topics](advanced/overview.html) so
- just ignore them at the beginning. They will start to make sense while
- you're working through the template or will be explicitly explained when
- the right time comes.
- {% endblock %}