summaryrefslogtreecommitdiffstats
path: root/content/content/overview.md
diff options
context:
space:
mode:
Diffstat (limited to 'content/content/overview.md')
-rw-r--r--content/content/overview.md117
1 files changed, 117 insertions, 0 deletions
diff --git a/content/content/overview.md b/content/content/overview.md
new file mode 100644
index 0000000..98b1d47
--- /dev/null
+++ b/content/content/overview.md
@@ -0,0 +1,117 @@
++++
+title = "Overview"
+weight = 10
++++
+
+Zola uses the directory structure to determine the site structure.
+Each child directory in the `content` directory represents a [section](@/content/section.md)
+that contains [pages](@/content/page.md) (your `.md` files).
+
+```bash
+.
+└── content
+ ├── content
+ │   └── something.md // -> https://mywebsite.com/content/something/
+ ├── blog
+ │   ├── cli-usage.md // -> https://mywebsite.com/blog/cli-usage/
+ │   ├── configuration.md // -> https://mywebsite.com/blog/configuration/
+ │   ├── directory-structure.md // -> https://mywebsite.com/blog/directory-structure/
+ │   ├── _index.md // -> https://mywebsite.com/blog/
+ │   └── installation.md // -> https://mywebsite.com/blog/installation/
+ └── landing
+ └── _index.md // -> https://mywebsite.com/landing/
+```
+
+Each page path (the part after `base_url`, for example `blog/cli-usage/`) can be customised by changing the `path` or
+`slug` attribute of the [page front-matter](@/content/page.md#front-matter).
+
+You might have noticed a file named `_index.md` in the example above.
+This file is used to store both the metadata and content of the section itself and is not considered a page.
+
+To ensure that the terminology used in the rest of the documentation is understood, let's go over the example above.
+
+The `content` directory in this case has three `sections`: `content`, `blog` and `landing`. The `content` section has only
+one page (`something.md`), the `landing` section has no pages and the `blog` section has 4 pages (`cli-usage.md`,
+`configuration.md`, `directory-structure.md` and `installation.md`).
+
+Sections can be nested indefinitely.
+
+## Asset colocation
+
+The `content` directory is not limited to markup files. It's natural to want to co-locate a page and some related
+assets, such as images or spreadsheets. Zola supports this pattern out of the box for both sections and pages.
+
+All non-Markdown files you add in a page/section directory will be copied alongside the generated page when the site is
+built, which allows us to use a relative path to access them.
+
+Pages with co-located assets should not be placed directly in their section directory (such as `latest-experiment.md`), but
+as an `index.md` file in a dedicated directory (`latest-experiment/index.md`), like so:
+
+
+```bash
+└── research
+ ├── latest-experiment
+ │ ├── index.md
+ │ └── yavascript.js
+ ├── _index.md
+ └── research.jpg
+```
+
+With this setup, you may access `research.jpg` from your 'research' section
+and `yavascript.js` from your 'latest-experiment' page directly within the Markdown:
+
+```Markdown
+Check out the complete program [here](yavascript.js). It's **really cool free-software**!
+```
+
+By default, this page's slug will be the directory name and thus its permalink will be `https://example.com/research/latest-experiment/`.
+
+### Excluding files from assets
+
+It is possible to ignore selected asset files using the
+[ignored_content](@/getting-started/configuration.md) setting in the config file.
+For example, say that you have an Excel spreadsheet from which you are taking several screenshots and
+then linking to these image files on your website. For maintainability, you want to keep
+the spreadsheet in the same directory as the Markdown file, but you don't want to copy the spreadsheet to
+the public web site. You can achieve this by setting `ignored_content` in the config file:
+
+```
+ignored_content = ["*.xlsx"]
+```
+
+## Static assets
+
+In addition to placing content files in the `content` directory, you may also place content
+files in the `static` directory. Any files/directories that you place in the `static` directory
+will be copied, without modification, to the `public` directory.
+
+Typically, you might put site-wide assets (such as the site favicon, site logos or site-wide
+JavaScript) in the root of the static directory. You can also place any HTML or other files that
+you wish to be included without modification (that is, without being parsed as Markdown files)
+into the static directory.
+
+Note that the static directory provides an _alternative_ to co-location. For example, imagine that you
+had the following directory structure (a simplified version of the structure presented above):
+
+```bash
+.
+└── content
+ └── blog
+    ├── configuration
+ │    └── index.md // -> https://mywebsite.com/blog/configuration/
+    └── _index.md // -> https://mywebsite.com/blog/
+```
+
+To add an image to the `https://mywebsite.com/blog/configuration` page, you have three options:
+ * You could save the image to the `content/blog/configuration` directory and then link to it with a
+ relative path from the `index.md` page. This is the approach described under **co-location**
+ above.
+ * You could save the image to a `static/blog/configuration` directory and link to it in exactly the
+ same way as if you had co-located it. If you do this, the generated files will be identical to those
+ obtained if you had co-located the image; the only difference will be that all static files will be saved in the
+ static directory rather than in the content directory. The choice depends on your organizational needs.
+ * Or you could save the image to some arbitrary directory within the static directory. For example,
+ you could save all images to `static/images`. Using this approach, you can no longer use relative links. Instead,
+ you must use an absolute link to `images/[filename]` to access your
+ image. This might be preferable for small sites or for sites that associate images with
+ multiple pages (e.g., logo images that appear on every page).