Black | Autistic | 22 | Enjoyer of things | Huge blue rat enjoyer | Beginner (occasional) artist| Aspiring Game Dev and VA
i'm currently working on migrating my site (which is currently just the front page) to eleventy. and the thing about the site is that i'm using the one that's from the sadgrl's layout maker. and i am struggling to know on which line of code goes where on both the index.md and base.njk.
if anyone knows the answer to this, please tell me and thank you.
(also sorry for asking so much, i am a complete beginner at this.)
So generally, you want to put all the "outer" html stuff that you want on multiple pages and that you don't want to have to type out each time in your .njk
So that would be stuff like the < html >, < head >, < body >
And then generally, all of your "inner" content would go in the .md, so all the stuff you actually want to print on your page.
If that didn't make sense, I found this tutorial super helpful when I was getting set up on eleventy!
so from my understanding + my idea of what i want the site template to be,
is that correct?
that's right, pretty much! you have your layout skeleton in the njk and the extra stuff in the njk
Yep! You just have to make sure to include the {{ content | safe }} tag in your njk at the location where you want your stuff to go
index.njk file:
<body>
{{ content | safe }}
</body>
index.md file:
---
layout: index.njk
---
Hello World!
In this example, the "Hello World!" from your .md file will be inserted between the body tags of the final index.html file once 11ty builds it.
I see, so I use this for something like putting text or images in the area of the site in different pages, right?
Yeah so basically this lets you keep your html "wrapper" in a template (.njk) file, and then when you invoke that template with the layout tag in your markdown frontmatter, all the content in your markdown file (the stuff you want people to see) will be rendered into html using that wrapper. Which lets you write out all the html garbage once, and then just write out a bunch of page content super quickly. This also helps when you need to change some piece of your html - you only have to change it in one place (the template file), rather than on every page.
Really hope this makes sense!
i see now, i'll keep all this in mind and also watch the tutorial you linked. thank you so much for providing the details!
Absolutely! I'm by no means an expert, but feel free to reach out if you have questions!