How-to: How to add a new block?
How to add a new block?
Step 1
Open the HTML layout configuration file:
themes
+--- {theme}
+--- layout
+--- html.json
Add a new entry with the block template path:
{
...
"banner": "template/block/banner.html"
...
}
Step 2
Create the new block template file with the HTML content:
themes
+--- {theme}
+--- template
+--- block
+--- banner.html
<div id="banner>
Welcome!
</div>
Step 3
Add the new block in the page template:
themes
+--- {theme}
+--- template
+--- default.html
<!-- ... -->
<main>
{% banner %}
<!-- ... -->
</main>
<!-- ... -->
Next
- ✓ How to add a new block?
- How to add a new blog post?
- How to build reusable HTML components?
- How to implement a custom plugin?
- How to display a list of items?
- How to display a list of links?
- How to add dynamic data to a page with a plugin?
- How to use Stapy on Windows?
- How to host my static website for free?
- How to auto-deploy my website with GitHub Action?
- How to write content in Markdown?
- How to add a JSON feed?
- How to use Stapy with Apache HTTP Server?
- How to update Stapy?