Code syntax

support
1

Probably a silly question but I noticed in various Hugo Themes different ways in terms of syntax:
For example, what is the difference between {{- .Title -}} and {{ .Title }}
Same for {{ partial "footer.html" . }} {{- partial "footer.html" . -}} and {{ partial "footer" . }}
What is the best and correct option, if any ?

2

It depends on what you need to do. Sometimes you need to control whitespace and sometimes you don’t. There is no right or wrong here. See: https://gohugo.io/templates/introduction/#whitespace

1 Like
3

Well I realised the difference a bit late and had to bring in the {{- for quite a lot of lines afterwards.

For css files an effort is taken to minify those. E.g. Google PageSpeed tools want you to basically eliminate all white space’s for css files.

        {{ if true }}
        {{/* things to do */}}
        {{/* things to do */}}
        {{/* things to do */}}
        {{ end }}

will give you 5 lines of html - all filled up with white spaces (tabs or spaces - depending on your editor settings)
If you care about minifing (your) css, then you probably don’t want your html files filled up with tons of empty white space lines.

        {{-  if true }}
        {{- /* things to do */}}
        {{- /* things to do */}}
        {{- /* things to do */}}
        {{-  end }}

will eliminate those lines.
Review the generated html code (view source in browser) and eliminate the “empty line” blocks by using the {{- syntax.
(make sure you check the doc as mentioned by @alexandros)

4

I minify my HTML Code in Production and so don’t care about whitespace in the generated output. And in Development mode it doesn’t matter to me.

Minification is done by Gulp with gulp-htmlmin. I call this gulp task in my bash script for production.

5

Good tip - but you can’t assume a specific tool chain.
I’m deploying using rsync directly after hugo.
Of course one could use a perl one-liner for this - but this is not the point.
Question is whether the hugo output is ready for production or not.
When I check the demo pages of the first themes in https://themes.gohugo.io/tags/blog/, I see a lot of white space lines blocks (no offence).
Whether this is good or bad is arguable …

6

That’s true.

7

I am just about to finalize my site and I am wondering what is the best way to deploy it on my hosted website. My first basic approach was to directly upload the files (within the /public directory) with FTP.

@Leo_Merkel
Would you mind explai in more details or help me to minify it as you did

@it-gro
Is deploying with Rsync the most convenient way or the easiest

Considering that I am neither a developer nor very familiar with all these tools (gulp, Rsync, etc)

For the test period, I am building my site locally and deploy with Gitlab pages (succesfully so far).

8

Sure. But my Gulp pipeline is quite complex for CSS in Development, Staging and Production, responsive Images, JavaScript Concatenation, HTML Minification etc. So Gulp might be a bit of an overkill just for HTML minification.

Instead you could use an HTML Minifier at the command line: html-minifier-cli - npm

Give it a try and let me know if you need more.

9

Ok, well understood
I will try and revert

10

For my setup it’s both but it may work differently in your situation.

Check out:

I use:

What is not mentioned in the above doc is that rsync has a delta algorithm, minimizing network usage (rsync - Wikipedia).
So transferring updates is done quickly.

11

Thank you and now it’s up to me