Update readme instructions for css and images
The instructions should be changed to properly reflect the way css and images are handled in the configuration. At the moment the instructions reference css and png files being handled via templateFormats, but in reality they're configured to be located in special css and img directories and handled via addPassthroughCopy().
This commit is contained in:
parent
c10b171a40
commit
2145a3169c
38
README.md
38
README.md
@ -6,16 +6,16 @@ A starter repository showing how to build a blog with the [Eleventy](https://git
|
|||||||
|
|
||||||
## Demos
|
## Demos
|
||||||
|
|
||||||
* [Netlify](https://eleventy-base-blog.netlify.com/)
|
- [Netlify](https://eleventy-base-blog.netlify.com/)
|
||||||
* [GitHub Pages](https://11ty.github.io/eleventy-base-blog/)
|
- [GitHub Pages](https://11ty.github.io/eleventy-base-blog/)
|
||||||
* [Remix on Glitch](https://glitch.com/~11ty-eleventy-base-blog)
|
- [Remix on Glitch](https://glitch.com/~11ty-eleventy-base-blog)
|
||||||
|
|
||||||
## Deploy this to your own site
|
## Deploy this to your own site
|
||||||
|
|
||||||
These builders are amazing—try them out to get your own Eleventy site in a few clicks!
|
These builders are amazing—try them out to get your own Eleventy site in a few clicks!
|
||||||
|
|
||||||
* [Get your own Eleventy web site on Netlify](https://app.netlify.com/start/deploy?repository=https://github.com/11ty/eleventy-base-blog)
|
- [Get your own Eleventy web site on Netlify](https://app.netlify.com/start/deploy?repository=https://github.com/11ty/eleventy-base-blog)
|
||||||
* [Get your own Eleventy web site on Vercel](https://vercel.com/import/project?template=11ty%2Feleventy-base-blog)
|
- [Get your own Eleventy web site on Vercel](https://vercel.com/import/project?template=11ty%2Feleventy-base-blog)
|
||||||
|
|
||||||
## Getting Started
|
## Getting Started
|
||||||
|
|
||||||
@ -25,7 +25,6 @@ These builders are amazing—try them out to get your own Eleventy site in a few
|
|||||||
git clone https://github.com/11ty/eleventy-base-blog.git my-blog-name
|
git clone https://github.com/11ty/eleventy-base-blog.git my-blog-name
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
### 2. Navigate to the directory
|
### 2. Navigate to the directory
|
||||||
|
|
||||||
```
|
```
|
||||||
@ -40,7 +39,7 @@ Specifically have a look at `.eleventy.js` to see if you want to configure any E
|
|||||||
npm install
|
npm install
|
||||||
```
|
```
|
||||||
|
|
||||||
### 4. Edit _data/metadata.json
|
### 4. Edit \_data/metadata.json
|
||||||
|
|
||||||
### 5. Run Eleventy
|
### 5. Run Eleventy
|
||||||
|
|
||||||
@ -49,30 +48,33 @@ npx eleventy
|
|||||||
```
|
```
|
||||||
|
|
||||||
Or build and host locally for local development
|
Or build and host locally for local development
|
||||||
|
|
||||||
```
|
```
|
||||||
npx eleventy --serve
|
npx eleventy --serve
|
||||||
```
|
```
|
||||||
|
|
||||||
Or build automatically when a template changes:
|
Or build automatically when a template changes:
|
||||||
|
|
||||||
```
|
```
|
||||||
npx eleventy --watch
|
npx eleventy --watch
|
||||||
```
|
```
|
||||||
|
|
||||||
Or in debug mode:
|
Or in debug mode:
|
||||||
|
|
||||||
```
|
```
|
||||||
DEBUG=* npx eleventy
|
DEBUG=* npx eleventy
|
||||||
```
|
```
|
||||||
|
|
||||||
### Implementation Notes
|
### Implementation Notes
|
||||||
|
|
||||||
* `about/index.md` shows how to add a content page.
|
- `about/index.md` shows how to add a content page.
|
||||||
* `posts/` has the blog posts but really they can live in any directory. They need only the `post` tag to be added to this collection.
|
- `posts/` has the blog posts but really they can live in any directory. They need only the `post` tag to be added to this collection.
|
||||||
* Add the `nav` tag to add a template to the top level site navigation. For example, this is in use on `index.njk` and `about/index.md`.
|
- Add the `nav` tag to add a template to the top level site navigation. For example, this is in use on `index.njk` and `about/index.md`.
|
||||||
* Content can be any template format (blog posts needn’t be markdown, for example). Configure your supported templates in `.eleventy.js` -> `templateFormats`.
|
- Content can be any template format (blog posts needn’t be markdown, for example). Configure your supported templates in `.eleventy.js` -> `templateFormats`.
|
||||||
* Because `css` and `png` are listed in `templateFormats` but are not supported template types, any files with these extensions will be copied without modification to the output (while keeping the same directory structure).
|
- The `css` and `png` directories in the input directory are going to be copied without modification to the output, because they're passed to `addPassthroughCopy()`.
|
||||||
* The blog post feed template is in `feed/feed.njk`. This is also a good example of using a global data files in that it uses `_data/metadata.json`.
|
- The blog post feed template is in `feed/feed.njk`. This is also a good example of using a global data files in that it uses `_data/metadata.json`.
|
||||||
* This example uses three layouts:
|
- This example uses three layouts:
|
||||||
* `_includes/layouts/base.njk`: the top level HTML structure
|
- `_includes/layouts/base.njk`: the top level HTML structure
|
||||||
* `_includes/layouts/home.njk`: the home page template (wrapped into `base.njk`)
|
- `_includes/layouts/home.njk`: the home page template (wrapped into `base.njk`)
|
||||||
* `_includes/layouts/post.njk`: the blog post template (wrapped into `base.njk`)
|
- `_includes/layouts/post.njk`: the blog post template (wrapped into `base.njk`)
|
||||||
* `_includes/postlist.njk` is a Nunjucks include and is a reusable component used to display a list of all the posts. `index.njk` has an example of how to use it.
|
- `_includes/postlist.njk` is a Nunjucks include and is a reusable component used to display a list of all the posts. `index.njk` has an example of how to use it.
|
||||||
|
Loading…
Reference in New Issue
Block a user