Skip to main content
Version: Next

📝 Templates

Templates are a great tool to render dynamic content without using a separate frontend framework.

Template Engines

Fiber allows you to provide a custom template engine at app initialization.

app := fiber.New(fiber.Config{
// Pass in Views Template Engine
Views: engine,

// Default global path to search for views (can be overriden when calling Render())
ViewsLayout: "layouts/main",

// Enables/Disables access to `ctx.Locals()` entries in rendered views
// (defaults to false)
PassLocalsToViews: false,
})

Supported Engines

The Fiber team maintains a templates package that provides wrappers for multiple template engines:

info

Custom template engines can implement the Views interface to be supported in Fiber.

Views interface
type Views interface {
// Fiber executes Load() on app initialization to load/parse the templates
Load() error

// Outputs a template to the provided buffer using the provided template,
// template name, and binded data
Render(io.Writer, string, interface{}, ...string) error
}
note

The Render method is linked to the ctx.Render() function that accepts a template name and binding data.

Rendering Templates

Once an engine is set up, a route handler can call the ctx.Render() function with a template name and binded data to send the rendered template.

Signature
func (c Ctx) Render(name string, bind Map, layouts ...string) error
info

By default, ctx.Render() searches for the template name in the ViewsLayout path. To override this setting, provide the path(s) in the layouts argument.

app.Get("/", func(c fiber.Ctx) error {
return c.Render("index", fiber.Map{
"Title": "Hello, World!",
})

})
caution

If the Fiber config option PassLocalsToViews is enabled, then all locals set using ctx.Locals(key, value) will be passed to the template. It is important to avoid clashing keys when using this setting.

Advanced Templating

Custom Functions

Fiber supports adding custom functions to templates.

AddFunc

Adds a global function to all templates.

Signature
func (e *Engine) AddFunc(name string, fn interface{}) IEngineCore
// Add `ToUpper` to engine
engine := html.New("./views", ".html")
engine.AddFunc("ToUpper", func(s string) string {
return strings.ToUpper(s)
}

// Initialize Fiber App
app := fiber.New(fiber.Config{
Views: engine,
})

app.Get("/", func (c fiber.Ctx) error {
return c.Render("index", fiber.Map{
"Content": "hello, World!"
})
})

AddFuncMap

Adds a Map of functions (keyed by name) to all templates.

Signature
func (e *Engine) AddFuncMap(m map[string]interface{}) IEngineCore
// Add `ToUpper` to engine
engine := html.New("./views", ".html")
engine.AddFuncMap(map[string]interface{}{
"ToUpper": func(s string) string {
return strings.ToUpper(s)
},
})

// Initialize Fiber App
app := fiber.New(fiber.Config{
Views: engine,
})

app.Get("/", func (c fiber.Ctx) error {
return c.Render("index", fiber.Map{
"Content": "hello, world!"
})
})

Full Example

package main

import (
"log"
"github.com/gofiber/fiber/v3"
"github.com/gofiber/template/html/v2"
)

func main() {
// Initialize standard Go html template engine
engine := html.New("./views", ".html")
// If you want to use another engine,
// just replace with following:
// Create a new engine with django
// engine := django.New("./views", ".django")

app := fiber.New(fiber.Config{
Views: engine,
})
app.Get("/", func(c fiber.Ctx) error {
// Render index template
return c.Render("index", fiber.Map{
"Title": "Go Fiber Template Example",
"Description": "An example template",
"Greeting": "Hello, World!",
});
})

log.Fatal(app.Listen(":3000"))
}