Block template explanation

Cool. This is the very definition of how it has to work. Think of a {{define}} code block the same as extends…that is, anything inside that block extends the base template. If you put anything outside of that block, what exactly would it be extending?

However, if you put content outside the block intentionally, remember that you can define multiple blocks. This comes in great for things like extra scripts for specific layouts, etc. So, for example, here is a sample baseof.html:

<!DOCTYPE html>
<html lang="en">
<head>
  {{partial "site-head.html" . }}
</head>
<body>
  {{ partial "site-header.html" . }}
    <main>
    <!--block #1; that is, your "main" page content...-->
    {{block "main" . }}
    {{end}}
    </main>
    {{ partial "site-footer.html" . }}
    {{ partial "site-scripts.html" . }}
    <!--block #2; in this example, for adding additional scripts based on page template...-->
    {{ block "addscripts" . }}
    {{ end }}
</body>
</html>

You can then “define” both main and addscripts in individual pages. You can set conditionals for additional scripts based on front matter, etc, etc. There is a ton of flexibility here…