What are /r/gohugo's favorite Products & Services?

From 3.5 billion Reddit comments

Well Spacing you can control in css. Check in assets/_markdown.scss and override in assets/_custom.scss.

For images it's likely that shortcode needed, which will generate img tag with float styles.

https://gohugo.io/content-management/shortcodes/

> https://gohugo.io/templates/sitemap-template/

Thanks. That makes perfect sense.

"You should configure a parameter as the public url and use that as the base to generate the whole taxonomy"

Do you mean specify my custom domain name in the yaml file ?

Many thanks

> 2. Then, I would git submodule add a theme, such as my-foobar into the themes directory. So the command would be run within my-site/themes and look like git submodule add [URL to my-foobar repo]. This would produce my-site/themes/my-foobar.

Take a look: https://gohugo.io/getting-started/quick-start/#step-3-add-a-theme

> 3. If I make changes to my website's contents, I would git push from the my-site directory.

Yes.

> 4. If I make changes to the theme, I would change files in my-site/themes/my-foobar and git push from within my-site/themes/my-foobar.

Yes, but also you'd go up to the website directory, and add and push the changes from there too, but like git add themes/my-foobar (instead of having to specify the file).

Even with how confusing this can be, I can say I haven't actually had any major issues, nothing complicated that I had to correct, or no file changes loss or anything like that.

What? No. Why?

Hugo is a go app. Compiled to run anywhere with a dev server built right into it. It even has support for live reload out of the box. You don't need to compile, push, and upload new versions every edit.

This is terrible advice.

Please go through the getting started guide again and then hit up Using Hugo which explicitly details all of this.

Never heard of git subtree before. Thank you!

I am only just starting to look at the documentation on subtree merging and it looks promising.

> saves you the extra repository

Based on what I see so far from the documentation, the "extra repository" you're referring to is the my-foobar in my original post, right?

You might actually be better off with something like Carrd.co. No code, has built in forms and embeds, static, easy to learn. Specifically made for landing pages. Kind of like a Wix Lite.

They have a free tier, and $20 a year gets let's you have a custom domain name and 10 sites.

(Affiliate link, if you're so inclined)

All date format declarations have to use the date/time of "Jan 2, 2006 at 3:04:05pm -0700" (with time zone)

Something about 1-2-3-4-5-6-7; so Jan(1) 2nd(2), 3:04:05pm of year 2006(6) in the -0700 time zone

All the examples on the Format page do this, but it's not super obvious at first glance

Not sure why, but that's how it works

That only works locally in your browser since you're using "file://".

It sounds like your goal is to create a list of files in a directory. Look into: https://gohugo.io/templates/lists/ and https://discourse.gohugo.io/t/list-files-in-a-directory/21258/3

Thanks for the reply. Good thing to consider. However that can easily be handled in Hugo by simply defining an Alias in the Front Matter of each page’s .md file. See the Aliases section of URL Management in the Hugo documentation.

https://gohugo.io/content-management/urls/#aliases

This will allow me to build the site with more SEO friendly (longer, more descriptive URLs), as well as organize the site more logically than before.

If you need a UI, check out Kirby CMS, like Hugo authors write code in markdown, but unlike Hugo there is an integrated UI and it’s not static (but is still very fast).

Great ecosystem of plugins, great community, etc.

I find it really hits the sweet spot between something like Hugo and WordPress..

The package manager for that repo might not be keeping it up to date. I had this problem on fedora and just decided to use homebrew https://brew.sh/ for hugo. The speed it updates when new versions come out is impressive.

Well, for my case, its free. I was paying $5 per month for a WordPress on hosting, and I had to struggle a lot and waste time on plugins upgrades etc. And even after all that, site was slow and heavy (maybe wrong theme I guess).

​

Now, I only pay for the domain. Its all Markdown. So, I basically write one article in iA Writer, and publish it everywhere on Medium, Dev.to, and Website easily. I do some alterations. Firebase Hosting is very flexible and Free for my case. And I have setup one time CI. So, its all a breeze.

Depends how I'm deploying.

A few examples:

If using GitHub pages, you need to provide the built output.

If deploying with Netlify, they take the source and build.

If being naughty and using FileZilla to drag-and-drop upload, then the built output.

And so on . . .

> Thank you again - but I'm confused about your first example: I thought that a double-starred entry was a subtree of its single-starred parent in org-mode? Or have I totally misunderstood something?

That's correct.. that double-starred entry is a subtree under the single-starred subtree.. but why is that is problem? I am intentionally doing that.

This is one of the places where ox-hugo shines over the inbuilt Org mode support in Hugo! I am leveraging the Org mode feature of Property Inheritance. So as * Post has :EXPORT_HUGO_SECTION: set to post, the same will be the case for ** Post 1 too, by inheritance.

So extending that, you can have:

#+hugo_base_dir: /set/abs/or/release/path

* Posts :PROPERTIES: :EXPORT_HUGO_SECTION: post :END: ** Post 1 :PROPERTIES: :EXPORT_FILE_NAME: post-1 :END: Post 1 content. ** Post 2 :PROPERTIES: :EXPORT_FILE_NAME: post-2 :END: Post 2 content.

Above, you don't need to specify the section for each of the nested subtrees under * Post.

> Anyway, I've pushed my efforts to > https://github.com/amca01/whats_this

I'll have a look at that at a later point, and get back to you tomorrow. But hopefully you can figure out the confusion yourself once you "get" the Org Inheritance magic.

> I have indeed opened an issue on the theme repo about hard coding paths, but I'm not sure (yet) how to implement your suggestion of using .Site.Params.mainSections. I'll check that out...

It's alright. As I said earlier, don't try to solve all the questions in one go. Just make note of those, and they will get resolved as you better understand Hugo templating.

Read the Hugo docs, and frequent the Discourse forum just to read the Q'n'A over there. Just doing that, you'll learn a lot (that's how I started).

The author seems to be pursuing a different approach with static site hosting or low-code scenario. Yours requires at least a VPS.

Quote: >actually kills two birds with one stone providing organic search discoverability and the site specific full-text search and requires no maintenance.

Anyway, the solution you offer is definitely worth mentioning at https://gohugo.io/tools/search/. Have you thought of submitting there?

Normally Hugo should put the permalink as the location of the sitemap, because the sitemap protocol requires absolute urls.

If you host your site on github and then map the github to a custom domains, hugo has no way to detect this mapping because it's handled by github, therefore it considers the url(s) on github as the "absolute" url(s).

You should configure a parameter as the public url and use that as the base to generate the whole taxonomy.

https://gohugo.io/templates/sitemap-template/

<loc>{{ .Permalink }}</loc>

You could use an external service, such as Discus, to provide comment features: https://gohugo.io/content-management/comments/#add-disqus

However, this will mean comments are ONLY available to those with Javascript enabled. It will also mean your privacy policy will need to extend to account for this service.

> Images should go in the static folder, in which though you're allowed to create custom subfolders for organization sake.

Depends. If you want to process the images further they should not be in /static.

https://gohugo.io/content-management/image-processing/

I don't think you can do this directly in your configuration file.

However, you should be able to add something like this in your menu partial:

{{ $menu := .Site.GetPage "/menu" }} {{ range $menu.Pages }} <a href="{{ .Permalink }}">{{.Title}}</a> {{ end }}

That will expand to all pages under your "/menu" section. Inside the {{ range }} bit . will refer to the specific page, so you can use it to get all page variables for that page. Above I only used Permalink and Title, which are most likely to be the ones you're interested in.

Would humanize be what you're looking for?

https://gohugo.io/functions/humanize/

{{humanize "my-first-post"}} → "My first post" {{humanize "myCamelPost"}} → "My camel post" {{humanize "52"}} → "52nd" {{humanize 103}} → "103rd"

https://gohugo.io/content-management/urls/

For example if you use the file format toml for the configuration file (config.toml) you have to enter the following into the file:

[permalinks] post = ":slug"

You'll want to look at https://gohugo.io/functions/sort/

This, and depending on how you store your data; is it .Site.Data or are you relying on .Site.AllPages

The implementation details might vary a bit. Good luck!

> Any clues as to what I should be looking for?

Not specifically. The site worked perfectly first time for me (apart from its trying to load http://analytics.example.com/tracker.js).

It sounds like you might be getting an out-of-date version of the page. That's a common problem when visiting your site with the devices you were building and testing it with. The server appears to be sending appropriate caching-related headers, though.

Are you perhaps behind a proxy server?

Have you made sure any adblockers you have are deactivated for your own site?

Check your browser's devtools and server log files to see which requests are being made and whether the pages are coming from the server, your browser's cache or a proxy server.

Also, the site's pretty sleek. Well done.

You should shrink that photo of yourself, though. It's over 1MB and 3000px wide, but it's only shown at 224px wide on the site. Shrink it to 448px (for Retina displays), and it should only be about 50KB.

Hugo can resize it automatically for you.

https://gohugo.io/getting-started/installing/#debian-and-ubuntu

You must also keep in mind that not every developer necessarily creates ready-made packages for various distributions. This is often done by someone who is involved in the respective distribution.

That means you've used Ubuntu's package management system (`apt`). To make sure its list of potential upgrades is up to date, always run a `sudo apt update` before anything else, and then try installing it again; it should upgrade to the latest it finds.

However, in Hugo's case, it seems that the `apt` repository is quite behind, I'm only getting `0.63.2` myself. So you might be better off just downloading the Hugo binary.

You can call built-in functions e.g. getJSON with a URL

https://gohugo.io/templates/data-templates/#call-the-functions-with-a-url

Straightforward for simple use-cases, but so far it doesn't support adding a custom request body or headers, only URLs.

> What I really want is the ability to call any REST service, > Have Huo run the call and fetch the content during the build > then insert the retrieved content into a pre-defined space.

Hugo can use data files, even if it can't fetch them, so you can retrieve the data in your build script before you run hugo.

Well, Hugo's get started guide just mentions public folder: https://gohugo.io/getting-started/usage/#the-hugo-command

> The command hugo renders your site into public/ dir and is ready to be deployed to your web server

Sounds like a good idea.

> To me this looks like it could break easily.

If I were you, I'd use the APIs of the CI and hosting services to generate JSON/TOML files that Hugo can build the site from. That should be very reliable.

I may not have posted links to the the documentation that I have been looking over, but I have been searching. It seems like pagination may provide something close to what I am looking for (but not quite).

https://gohugo.io/templates/pagination/

You must include the code in the theme you use (e.g. list.html or single.html) and not in the markdown files.

If you want I can send you a link to the source code of my Hugo page. The theme used is pretty simple, so you can most likely reproduce how it works with the tags.

>as the subject says I need to know how I can add a link to a specific tag in a post.

Did you specify the tag you want to link to in the front matter of the respective post? If so, you can use the following code.

<div class="article-tag">{{- if .Params.tags }} {{ range $index, $tag := .Params.tags }}{{ if gt $index 0 }} | {{ end }}<a href="{{ "tags/" | relLangURL }}{{ . | urlize | lower }}" rel="tag">{{ . }}</a>{{ end }}</div>

Take the embed code you generate from here https://www.classynemesis.com/projects/ytembed/ and paste it into your shortcode file, name the file "invidio.html". Replace the YouTube domain with the incision.us domain in the embed code. Where the watch code for the video goes in the URL (all the xxxx in your question here) put {{ .Get 0 }} to use the Hugo shortcode function to take the first (0) parameter passed to the shortcode. Then in your content file where you want the video to show up place {{< invidio xxxxxxxx >}} where you replace all the x's with the watch code for the video. That should get you started, from there you can add a div wrapper and styles to make the embedded video responsive. I don't know if all the embed parameters for YouTube have a direct parallel in an invidio embed, so start simple and add parameters as needed to make sure they all work. I hope this helps, for more info see: https://gohugo.io/templates/shortcode-templates/

If I understand correctly, you want to use a different partial depending of the type. If that is true, you should check the type of each Page from the range. Type is one of the page variables as stated here: https://gohugo.io/variables/page/

So :

{{ if eq "Post" .Type}} insert partial
{{else if eq "Character" .Type}} insert character partial 
And so on

> To me that is all presentation.

Okay. To each his own, but that's an odd way to view data storage. I mean in place of your Ulysses, MacJournal, or VoodooPAD just use atom and directories. Can't get much simpler. :)

It should be fairly easy to write a scraper that pulled the content off of wherever your store it and convert it to hugo's format.

It would be a matter of converting the metadata to markdown and then put the body of the post (in HTML or markdown) in the body.

https://gohugo.io/content-management/formats/

From the docs section on [Hugo Layouts Lookup Rules With Theme](https://gohugo.io/templates/lookup-order/#hugo-layouts-lookup-rules-with-theme)

> In Hugo, layouts can live in either the project’s or the themes’ layout folders, and the most specific layout will be chosen. Hugo will interleave the lookups listed below, finding the most specific one either in the project or themes.

I agree that the concept is covered in the docs. But there are no concrete examples. Thus the reason for my post.

From how I understand that error message, you have two shortcodes (toc and alert) in four Markdown files that cannot be found.

Have you checked those Markdown files to see if the shortcode is referenced properly? Here's is how you execute shortcodes: https://gohugo.io/content-management/shortcodes/#readout

It might also be that the shortcode files are missing from your theme. In that case I'd re-add them (since you did had them previously, from what I understand).

I also use vscode. A normal Markdown editor is not suitable for me, because I automatically create the front matter area via snippet and fill it up automatically with various shortcuts (e.g. date and slug).

The fact that no images are displayed does not bother me. They are integrated via a shortcode that automatically fits the images to my page. I usually also create the page locally first for testing.

Apart from that, I consider https://typora.io not bad. As far as I know, this should also display pictures. And it also supports YAML Front Matter.