Amber templates not working... documentation?

Greetings,

I’m attempting to use Amber templates with Hugo with absolutely no success. Seems Hugo simply doesn’t recognize them. Moreoever, I haven’t been able to find anything on using Amber within Hugo in the Hugo docs.

Questions:

  • What extension to use with Amber files in Hugo, .amber or .html?
  • Are there any important differences to how the layouts directory should be structured when using Amber?
2 Likes

Upon further testing, it seems that Hugo simply doesn’t recognize anything with a .amber extension. If I try to use Amber syntax with a .html extension then plain text is output (ie: things don’t work).

Is there some type of flag or configuration that must be set for Hugo to recognize Amber files?

Reading the code, .amber should work. What version of Hugo are you using?

Using the latest version of Hugo, 0.12

I think we need to spend a bit more time on ensuring amber works properly in hugo. We definitely don’t have enough tests around it and not enough users use it to let us know if we’ve broken things. I’d be surprised if we didn’t break something given that we’ve recently put in an entire theme engine.

It would be great if amber was properly supported and could interoperate along side the go templates. We need volunteers with an interest in making sure that the tests and documentation for it are produced.

Any volunteers?

I’m more than happy to test and help with documentation. I’ve yet to start programming in Go so I can’t be of much help there… but I’m happy to offer what I can from a Hugo user’s perspective.

Also, has any thought been given to supporting Ace. I just came across it today and I’m curious what the primary differences are between it and Amber (other than the fact that it seems to have been updated more recently). My main interest in one of these languages is the bracket free syntax (preference) and support for extends and blocks (which I find to be much more powerful than partials/includes).

Ace also looks interesting.

Once we’ve addressed all that we need to for additional template languages, it shouldn’t be much more effort to support another one.

Sweet. I’ve begun working with Hugo using Go templates, and though powerful, it’s quite the mind-shift from working with Jade (javascript templating similar to Amber) - and I’ve been much less productive. Especially in efforts to stay “dry,” this is much easier with block inheritance. Hugo already has a ton going for it… full support for Amber/Ace would be incredible.

I wrote some code for support for ace and found the function like amber’s CompileWithTemplate is needed for ace or adding FuncMap filed to GoHtmlTemplate to do it. I think extending ace is better than the latter.

As @spf13 said, before doing it, I should check something problems are still there on multiple template languages implementation. My ace implementation loaded templates and rendered them even if both ace and html templates were there so it seems not to have to do more on it but to check it, I’ll rewrite my site’s template in amber and see how it work

I tried rewriting in amber and soon found a fundamental issue. Current implementation checks template file’s suffix for which compiler should be used and it’s also included in a template name but all layout names in hugo includes .html suffix so Amber template files are never used. I think it is needed to choose removing suffixes from all layout names and fix caller strings or replacing layout name’s suffixes .amber to .html after compiled them

We need to allow end extension to be configurable (by file & default for site). Then we need to rename end files appropriately.

And now, all of template functions defined at hugolib/templates.go: NewTemplete() can’t be used with Amber. It seems to be caused by the bug described in https://github.com/eknkc/amber/pull/27

I struggled making Amber possible to work with my Hugo site and finally I found out it’s very hard and now it’s impossible. Amber has its own template language and compile it into Go standard template’s one but now it’s incomplete so to use it with Hugo, we have to improve Amber itself.

If we support an other template language besides Go’s standard, I would like to suggest Ace, discussed above. It allows you to use Go’s standard syntax in its template. It’s easy to understand and works well with Hugo. Now it works on my custom Hugo and Ace build, modified about 10 lines in each of them.

I’d be happy to support Ace. Please make a PR when you feel it’s ready.

Yes finally, I successfully built my site with Amber! To do it, I had to fix Amber code a little. I’ll send PR to both Amber and Ace project and if those are accepted, I’ll send PR to hugo to support them.

2 Likes

Hi, my name is Keiji Yoshida. I’m an author of Ace.

Thanks for considering to use Ace. I’d love to support connecting Ace with Hugo. If you have any problems, please feel free to contact me.

Thanks.

2 Likes

I tried to start porting one of my sites to Ace, but hit a wall really fast - all I get is a blank page.

@tatsushid if I have a template “single.html” I should be able to replace that with “single.ace”? (with new syntax).

@bjornerik, you can replace original single.html with single.ace, and I confirmed both type template can be used at the same time when I wrote the patch. Here is the single.ace example of my real site

= doctype html
html xmlns=http://www.w3.org/1999/xhtml xml:lang=ja lang=ja

  = include theme/partials/header.html .

  body.theme-base-0d.layout-reverse.sidebar-overlay

    = include theme/partials/sidebar.html .

    //
      Wrap is the content to shift when toggling the sidebar. We wrap the
      content to avoid any CSS collisions with our real content.
    div.wrap
      div.masthead
        div.container
          h3.masthead-title
            a href=/ title=Home {{ .Site.Title }}

      div.container.content
        {{ .Render "content" }}
        nav.prev-next
          ul
            li
              {{ if .Prev }}
                a href={{ .Prev.RelPermalink }} Newer Post
              {{ else }}
                | Newer Post
              {{ end }}
            li
              {{ if .Next }}
                a href={{ .Next.RelPermalink }} Older Post
              {{ else }}
                | Older Post
              {{ end }}

    = include theme/partials/footer.html .

It works with Hugo current tip in my env. In this example, the expressions like = include theme/partials/header.html . are used. These are not mistake, correct expression. Whether go standard template or Ace you use, it should have html extension because theme/partials/header.html is a go’s text/template internal name, not a real path. Now Hugo removes the template file extension and automatically adds html to it for the internal template name.

OK, will try to figure it out, but I get nothing but white pages.

If you’d like to know how Ace template is compiled, you can use ace command for the purpose. Please build https://github.com/yosssi/ace/blob/master/cmd/ace/main.go and use it but be careful it works with a plane Ace template but couldn’t work with Hugo’s Ace template because Ace itself doesn’t know Hugo specific template functions.