README.md 4.1 KB
id: html
title: HTML
HTML is the official Go template engine html/template, to see the original syntax documentation please click here
Info:
All templates within the specified view directory are analyzed and compiled at the beginning to increase the performance when using them.
Thus it should be noted that no definition with the same name should exist, otherwise they will overwrite each other.
For templating the {{embed}} tag should be used
Basic Example
./views/index.html
{{template "partials/header" .}}
<h1>{{.Title}}</h1>
{{template "partials/footer" .}}
./views/partials/header.html
<h2>Header</h2>
./views/partials/footer.html
<h2>Footer</h2>
./views/layouts/main.html
<!DOCTYPE html>
<html>
<head>
<title>Main</title>
</head>
<body>
{{embed}}
</body>
</html>
package main
import (
"log"
"github.com/gofiber/fiber/v2"
"github.com/gofiber/template/html/v2"
)
func main() {
// Create a new engine
engine := html.New("./views", ".html")
// Or from an embedded system
// See github.com/gofiber/embed for examples
// engine := html.NewFileSystem(http.Dir("./views", ".html"))
// Pass the engine to the Views
app := fiber.New(fiber.Config{
Views: engine,
})
app.Get("/", func(c *fiber.Ctx) error {
// Render index
return c.Render("index", fiber.Map{
"Title": "Hello, World!",
})
})
app.Get("/layout", func(c *fiber.Ctx) error {
// Render index within layouts/main
return c.Render("index", fiber.Map{
"Title": "Hello, World!",
}, "layouts/main")
})
app.Get("/layouts-nested", func(c *fiber.Ctx) error {
// Render index within layouts/nested/main within layouts/nested/base
return c.Render("index", fiber.Map{
"Title": "Hello, World!",
}, "layouts/nested/main", "layouts/nested/base")
})
log.Fatal(app.Listen(":3000"))
}
Example with embed.FS
package main
import (
"log"
"net/http"
"embed"
"github.com/gofiber/fiber/v2"
"github.com/gofiber/template/html"
)
//go:embed views/*
var viewsfs embed.FS
func main() {
engine := html.NewFileSystem(http.FS(viewsfs), ".html")
// Pass the engine to the Views
app := fiber.New(fiber.Config{
Views: engine,
})
app.Get("/", func(c *fiber.Ctx) error {
// Render index - start with views directory
return c.Render("views/index", fiber.Map{
"Title": "Hello, World!",
})
})
log.Fatal(app.Listen(":3000"))
}
and change the starting point to the views directory
./views/index.html
{{template "views/partials/header" .}}
<h1>{{.Title}}</h1>
{{template "views/partials/footer" .}}
Example with innerHTML
package main
import (
"embed"
"html/template"
"log"
"net/http"
"github.com/gofiber/fiber/v2"
"github.com/gofiber/template/html"
)
//go:embed views/*
var viewsfs embed.FS
func main() {
engine := html.NewFileSystem(http.FS(viewsfs), ".html")
engine.AddFunc(
// add unescape function
"unescape", func(s string) template.HTML {
return template.HTML(s)
},
)
// Pass the engine to the Views
app := fiber.New(fiber.Config{Views: engine})
app.Get("/", func(c *fiber.Ctx) error {
// Render index
return c.Render("views/index", fiber.Map{
"Title": "Hello, <b>World</b>!",
})
})
log.Fatal(app.Listen(":3000"))
}
and change the starting point to the views directory
./views/index.html
<p>{{ unescape .Title}}</p>
html output
<p>Hello, <b>World</b>!</p>