Creating & Organizing Content | Hugo - Static Site Generator | Tutorial 6

[@danielmurphy4653]

For all those new to hugo and have just installed it, change the list.html in the theme folder from .URL to .Permalink or the files will not load. Thanks for the content

[@weisideng8153]

Thanks a lot!!!!

[@affonsovieira6341]

Very good! Thanks!

[@procrastinator24]

thank you so much!

[@vbipul]

thanks bud

[@SemtaSoft]

Thank you very much Danial. Mike Dane, please correct GITHUB file

[@isaacgraphics1416]

If anyone else is getting an error which says: "execute of template failed at : can’t evaluate field url in type page.Page" It's because ".URL" is depreciated and won't work in modern installs. You can fix it by changing {{.URL}} to {{.Permalink}}

[@jobechoi]

Nice catch. Saved me from stress eating a few Domino pizzas!

[@alimulondo3308]

Thanks a lot. You saved me ages of google search.

[@TheMestreWeLL]

Obrigado, me salvou aqui ja estava perdido procurando pelo google, sorte que vim vê os comentarios

[@samanehabbasi2886]

Thank you

[@frazampad]

Thanks!

[@Sudden.Planet]

I'm seeing something a little different than what your showing at 4:33 which I can describe as an in-between page labeled “List Template - Section”. So rather than clicking on the “B” which should take you to "b.md" , I see a “Dir1s” link that takes me to a “List Template - Section” page, then I can see the “B” on the next page which takes me to the “Single Template - Page”. I’m using Hugo version “hugo_0.71.0_Windows-64bit” so maybe something has changed since the version this tutorial is using?

[@Sudden.Planet]

I think this difference might have something to do with the new Page Bundles introduced in Hugo 0.32 which was Dec. 31st 2017, so this video was recorded on an older version i guess. gohugo.io/news/0.32-relnotes/ You can find out more about this on page 96 of Brian P. Hogan's book entitled "Build Websites with Hugo - Fast Web Development with Markdown".

[@michaellisanti1522]

I am glad I am not the only one this happened to I am using Hugo 0.68.3 Pop_OS!.

[@MuppidiSaiRajeshwaraSiddarthRe]

how to fix this? Anyone?

[@jdubs-56]

These are fantastic videos, brief and accurate. Not a lot of background blabbing like so many others. Clear, direct, and to the point. For people trying this and getting build errors with the tutorial theme, ga-hugo-theme, there's a solution posted below, but is a bit vague. This might help: Go to the list.html file for the installed theme (it is in "themes -> layout -> _default"). Find this line of code (line 14 for me), {{.Title}}. Change ".URL" to ".Permalink" so the code looks like this: {{.Title}}. That should fix the build errors.

[@ChristineLGolden]

As of this post, Hugo automatically creates a directory folder on the root list file. Nice! And one must use --buildDrafts with hugo server instead of -D

[@makkurotatsu]

According to the output of "hugo server --help" of v0.87.0, the options "-D" and "--buildDrafts" are interchangeable.

[@manuchaudhary7902]

Thank you. great help

[@jobechoi]

Messing around with different configurations. Neither -D or --buildDrafts successfully builds the website with {{.URL}}. {{.Permalink}} shows the best to Mike's output. That he hasn't updated the file to make this small but important change probably may mean he's waiting for a pull request.

[@Grogueman]

The -D still works, as of Aug 2024.

[@sulmantalib5479]

Can somebody help me with this error I don't understand it. I'm new to hugo and I'm tagging along with mike but this error just popped up as i'm trying to open a markdown file. ERROR 2022/04/18 08:19:37 render of "section" failed: "/Users/somi/Documents/Hugo/first_site/themes/ga-hugo-theme/layouts/_default/list.html:14:31": execute of template failed: template: _default/list.html:14:31: executing "_default/list.html" at : can't evaluate field URL in type page.Page Error: Error building site: failed to render pages: render of "home" failed: "/Users/somi/Documents/Hugo/first_site/themes/ga-hugo-theme/layouts/_default/list.html:14:31": execute of template failed: template: _default/list.html:14:31: executing "_default/list.html" at : can't evaluate field URL in type page.Page

[@relaxing_beatsss]

Go to ga-hugo-theme>layouts>_default>list.html and on line 14 replace {{.URL}} with {{.RelPermalink}}, it should work!

[@cekterdown]

This content (and all your other vids btw) is great ! You speak clearly and (more or less) slowly, which is REALLY cool when we try to learn something new... Thanks a lot for all your work here !

[@StefTechSurfer]

Running it at x1.25

[@judostuff9233]

@@StefTechSurfer Running it at x1.75

[@Gongodler]

Also he has no Soyboy fakefriendly voice. I hate it when people speak so weird overfriendly.

[@ash.mystic]

That was helpful to learn about automatic list pages and overriding them!

[@khalifahshabazz5495]

Super awesome course videos, really helping me fly through understanding Hugo even faster.

[@xigong3009]

Note to myself: somehow one must type "hugo new a.md" inside the "first_site" folder, ranther than in "first_site\content", and it automatically stores the file inside the content folder.

[@user-th3xl6qf7b]

Thank you!

[@allokay3781]

How can you remove the very first subdirectory from appearing on the page, without affecting the lower level subdirectories?

[@TimBradleyFromOz]

*MY EXPERIENCE FOLLOWING IN JUNE 2018:* *1. Creating **_index.md_**_ List Page now automatically gives "Title" the value of its directory?_*_ In the example @__10:25__ When I created _/dir1/dir2/___index.md_ , in the frontmatter the "title" value was automatically "Dir2" (from directory name) and not "_Index". *2. IS YOUR LIST INCOMPLETE?* For clarity, if a nested directory has an "_index.md" it will not be listed by it's parent list page. So, for example, in this example _"localhost:1313/dir1/"_ will not show the D post (/dir1/dir2/d.md) like shown @10:25 once the _"/dir1/dir2/___index.md__"_ has been made. Great tute - thank you very much!

[@rossedelman8899]

My dir directories in the top level keep getting names Dir1s and Dir3s. It is not listing out all the contents of the dir directories like they are supposed to. I am using the ga-hugo-theme. What am I doing wrong?

[@songrongmu]

Hey I am facing the same problem. Any solutions yet?

[@harsharora2391]

Hi Me and my friends are also facing the same problem. Please give us a solution!

[@jimallen1351]

I'm a newbie also having this problem. The solution is to edit the list.html file in the ga-hugo-theme/layouts/_default directory. The file permissions are set to "root", that needs to be changed so that it may be edited first - see directions for the bash terminal command chmod. In the list.html file, line 11 is: {{ range .Pages }} change this to: {{ range .Site.RegularPages }} See the documentation at : gohugo.io/variables/page/#pages

[@peterantley]

@@songrongmu if your files have numbers in the name, it means that a file of that name already exists in that location.

[@rossmc92]

@@jimallen1351 Works a treat, good show. Edit: Actually, this forces every single list page to display a list of every page in the website, meaning that if I navigate to a child folder in the URL like root/dir3, it lists every single page.

[@captainobvious7898]

Running hugo version 0.83.1+extended on Ubuntu Linux. Following this tutorial exactly, and the home page does not display the md files directly as shown in this video. Those md files that are within a subdirectory are not shown. What is shown is a link to a list file for the sub-directory, and you have to drill down thru the links to the list files in order to access the individual md files. Maybe this is because this is an older tutorial and hugo has since been updated to change how it presents the site?

[@DagnyKight]

I'm on Windows. It worked for me by using git Bash and creating the a.md file in the first_sites directory. The file appeared in the content folder! I kept making the mistake of trying to create it in the content folder but apparently Hugo will put it where it should be. Same for dir1/b.md. Created in the first_sites directory and it automatically appeared in the content folder. It's a little hard to see where Mike is when he's doing this stuff. I tried using the terminal pane in Atom like he is and it wasn't working the same. I've switched to git Bash with Visual Studio Code.

[@BlackThreadDev]

Thanks for your videos. FYI: you don't have to zoom in on every thing you're talking about. Many times I'm following along behind you and still want to see things in context, but when you zoom in, I am not able to see the other things (i.e. folder structure, open tabs, etc), and it makes me a little nauseous.

[@danielreispereira]

choosing the dir(s) and .md files names in a more consistent/informative fashion would make following the video a bit easier. Also agree that zooming in and out a little less would be great.

[@joseluismonterocastellanos9861]

I need to insert an image at the top of the menu on the left side (list page?). The notepad++ logo. Any suggestion?

[@HarshVerma-ht7bo]

my cmd says id doesn't recognise 'hugo' command

[@DrHeinzDoofenshmirtz]

How do you turn off the list pages? I want a site solely consisting of a few single pages that I want to be able to place in whatever folder I want. But there should not be any list pages.

[@samanand3824]

Error: Unable to locate Config file. Perhaps you need to create a new site. Run `hugo help new` for details. while in the ‘content’ directory, You need to call hugo new a.md from the root of the project, not from inside content

[@VibrantEarthBee]

brilliant, thank you!

[@김나연-o2f8v]

Gosh! Thank u

[@muragekibicho3646]

Wow You're amazing!

[@adamklein962]

saved me - this comment needs to rise to the top!

[@AR-ny6ow]

where can i get his theme...there is no link for that in the description. Anyone pls help

[@xigong3009]

It is in one of his previous videos.

[@nareshchaurasia26]

How can I change the header of each page that is newly created ?

[@santoshkrpathak5954]

hi mike den is must to first to create them them create content file,,,,or can we create directly content file

[@sigurfeanaro3356]

I am not being able to create other directories inside other directories... I guess I will simply enter manually at my archives and create them! It would have been nice if you explained how. I am a total newbie at this.

[@manikdhingra1606]

Firs of all, that's for the quality content here. Problem I'm facing - Hugo server -D command doesn't render 'a.md' or 'b.md'. I'm using the theme Backburn, my understanding is regardless of theme pages should render, may be in different style and location than in the video. Please advise. Thanks in advance!!

[@VECT4GAMING]

Hey, I'm currently using a hugo theme called massively, I sucsessfully created a markdown file, put some text in it, and ran the server with drafts enabled, but nothing new is showing up. How do I get the content to show up?

[@VECT4GAMING]

It also shows that there is a new page when I run it in draft mode compared to without draft mode when I run hugo server

[@samsibbens8164]

I was using a theme other than hte one from the turoail at first and most f my pages weren't showing up. I went ahead and got the theme you made for the tutorial and now everything shows up. Apparently maybe the layouts file need t be changed when using custom themes?

[@SovietAra]

I"ve had some issues.. Dunn if i was doing something wrong or it's just a newer version of hugo.... I've had to put my posts in .../content/post/name.md to be able to see it on my page

[@ovuokeaghwotu2389]

Great tutorial. I am using Hugo v0.82.0+extended and the folders display on the home page. Great work!

[@uliseszaratelopez605]

Hi, I'm using the "normal" 0.84 version and the same happens for any theme I use, is there a way to avoid that?

[@Roman-Voronezh]

hugo server -D is not working, see the ERROR render of "home" failed, therefore can't move on with this course further... since this course was made in 2017, it definitely needs to be updated considering all the changes for the last 5 years.

[@ehabbustami7691]

as pointed out by Isaac Graphics above, the error is resulted from using a deprecated parameter .URL ... just change {{.URL}} to {{.Permalink}} in the list.html from the theme ... path: themes -> ga-hugo-theme ->layouts -> _default -> list.html

[@DarrylGibbs]

you're doing great work here man!! thanks a ton!

[@Andaluz_TV]

Hey Mike, what's up? Thank you so much for your time making this. Your work is great! I'm stuck with a problem tho. In this very phase of the process, while creating a.md file inside content, I get this return. Z:\Hugo\first_site\content>hugo new a.md Error: Unable to locate Config file. Perhaps you need to create a new site. Run `hugo help new` for details. Not sure what's happening. Did I misunderstood it and tried it in the wrong dir? Using Win 10 btw. Thanks! EDIT: Figured it out myself. I don't need to open the terminal whitin the content folder. I need to be in the site directory... My bad!

[@nurdianamalahayati3772]

you should create new site first by typing hugo new site site_name

[@imagineabout4153]

exit the content, you have to commit the command in the main folder

[@VECT4GAMING]

go to the main folder with "cd .." then I just copied and pasted the path to the content folder

[@carjaune6793]

Hey Mike, Maybe this is covered in a future video, but how would you *prevent* hugo from creating a list page for a certain directory, if you didn't want a list page to be available for that directory?

[@GiraffeAcademy]

Taken from the docs (as of Nov 12, 2017): "You do not have to create an _index.md file for every list page (i.e. section, taxonomy, taxonomy terms, etc) or the homepage. If Hugo does not find an _index.md within the respective content section when rendering a list template, the page will be created but with no {{.Content}} and only the default values for .Title etc. " - gohugo.io/templates/lists/ Im not sure if what you're describing is possible (at the current time), but from the above paragraph on the docs it seems that Hugo is always going to create a list page. What you could do though is control what happens when the user goes to the specific page using an if statement on the list template. Basically just check to see if the user is on the page and if so, do something else. {{ if eq .Title "whatever title" }} do something {{ end }} Or you could always use a javascript redirect on the actual page. see : stackoverflow.com/questions/4744751/how-do-i-redirect-with-javascript

[@gaz1978]

Awesome content Mike keep up the good work

[@Christine-qx5ce]

Thanks so much for that ... you are a good teacher :)

[@HarshVerma-ht7bo]

'hugo' is not recognized as an internal or external command, operable program or batch file.

[@xigong3009]

You may want to add the path.

[@prudentia8210]

I am getting an error. Looks like the .URL in lists.html is the issue. I tried with RelPermalink instead of URL and that seems temporary fix as the lists page now shows Dir1s and a.md as single pages. If used Permalink instead of URL, it fixes the isseus and gives a nested link where now its Dir1 which takes you to another list page that has all the single from Dir1. However, it is not giving all the *.md in one page like the tutorial.

[@jeremyweidlich5970]

Hey, how did you get your cmd combined with atom? You got an + in your lower left corner. What atom packages do you use? Its confusing that my atom version looks not like yours.. :D

[@Andaluz_TV]

he's probably using platformio-ide-terminal package, which is, by far my favorite embeded terminal for atom. Altho I get an error with it while using on my first machine. It works on the second, tho. Regarding the looks of his atom, you can customize your UI by downloading themes or editing it yourself. Search for it here on KZbin. There's plenty of tuts about it. :)

[@DagnyKight]

On your computer, open a terminal and enter "apm install atom-terminal" then in Atom, hit Ctrl-` (that's the backtick key in the upper left corner)

[@cosmotk]

3 years later and I still find it complicated lol. Too many commands, I rather dig my hands directly into HTML than learning all this. And I guess Hugo needs to be installed on the server as well? What I'm looking is more like a PHP generator that will speed up my static website progress and soon as my work is done to export or just upload the static site on any server and work as a normal HTML site..You know any like that? Thanks.

[@anglaismoyen]

Hugo doesn't need to be installed on the server. It generates a static site which you can just upload to the server.

[@jimbrown4195]

Good stuff Mike! Thanks.

[@ChristineLGolden]

Great learning experience! Thanks

[@DagnyKight]

I went all the way through this and then went back through again while attempting to make my own blog with one of the free themes. That did not go well.

[@stefanhans7642]

Hi, Mike, it's me again. Maybe you should point out more clearly these two points: - the creation of /dir1/dir2/_index.md moves the display of d.md from /dir1 to /dir1/dir2, but it remains under / - the creation of /dir1/_index.md does not change the display of b.md and c.md in /dir1 or / Probably this behavior is a default and can be changed in one way or the other. Just an educated guess. Greets, Stefan

[@GiraffeAcademy]

Hey Stefan, I'm pretty sure this is default behavior. Hugo treats folders (like dir1) at the root directory of the content folder different than it does folders not at the root directory (like dir1/dir2). Therefore the _index files at those different directories will affect the way the files display and show up. Unfortunately Hugo's templating system isn't super straightforward

[@zynxajeaesthetics6067]

everyone is a gansta untill Mike dane arrives with a green background.

[@Andrew-ec4qd]

I'm creating the .md pages but when I actually go to them I'm getting the message "Cannot GET /pagenamehere". Any idea why this is?

[@GiraffeAcademy]

My guess would be that the pages are set as drafts and you're running the Hugo server without the build drafts flag --buildDrafts

[@tesla3361]

.URL in list.html is depricated. need use .Permalink

[@montygehtab925]

its not listing a b c d e just listing a dir1 dir3. :/ what am i doin wrong?

[@DagnyKight]

Hugo organization appears to be different now. Mike made this video in 2017. I'm seeing all the files and the paths are displaying correctly but they appear on the webpage differently. I'm seeing the directories displaying and when I click on them to see the .md files, the paths are correct.

[@ericak5628]

@@DagnyKight Any thoughts on what modification we make to fix it?

[@simzhou]

Great content! I've watched the whole series! But I think there's something not covered in this section: How does index.md work? (not _index.md) It seems creating a post with index.md would block all other md files in that directory. And in the official doc, it should be plausible: gohugo.io/content-management/page-bundles/#examples-of-leaf-bundle-organization (in my case only index.md is shown on my site.) Would appreciate if you could provide some tips on this!

[@simzhou]

Answering my own question: I got some reference here: discourse.gohugo.io/t/index-md-vs-index-md/18710/4

[@harvindersingh-xb2pz]

Are you from freecodecamp as-well? I recognise your face from somewhere, i think it was a ruby tutorial or something lol

[@NicholasStees]

Feedback - Picking human relateable names besides a.md and b.md and dir1, it gets very confusing. About.md and dog/lab.md would have been better. Thanks for the great videos!

[@GiraffeAcademy]

Thanks for the feedback Nicholas, much appreciated!

[@carjaune6793]

I disagree. Sometimes short+abstract is good.... +1 for "a.md", "b.md"

[@SemtaSoft]

Please correct Github file with change ".URL to .Permalink" I wasted my 3 hours to find the error !!! Afer i look comments, I saw Danial Murphy's message (THANKS a LOT) But Mike Dane must correct this error from GITHUB Or others trying to run the code get that same error !!! Thank you DANIAL again

[@AfricanFlightStar]

This all sounds great Mike, but you said we wouldn't have to do any coding - and then in the next breath you're constantly needing to use the command line to add and adjust things. Don't know about you, but I consider that 'getting dirty', if not actual coding. Anyway, I'm still watching, just with some suspicion now 😆

[@Auron380]

hugo new dir1/a.md does create a page, but it does not show up when I run hugo server -D? Why is this?

[@zynxajeaesthetics6067]

My hero

[@jessegwinn4794]

You do a great job you really should host your stuff on udemy etc..

[@sanhacrypto4852]

ขอบคุณครับ Thank you :)

[@gadeichhorn]

helpful! thanks.

[@peoray]

Please, I need help. I'm using Linux Ubuntu 16.04. When I try to add a new content, I get an error saying my version of Hugo (0.16) is not supported by the theme (Ghostwriter). I have uninstalled and installed Hugo severally but keep getting the same message. Please how do I solve this?

[@codewind7179]

thanks

[@ShreyanshPanchal]

Pro tip: If you're new to HUGO make sure you're using this same theme. Otherwise it'll be hard for you to follow along.

[@danieljiang1259]

He is handsome.

[@hjbarraza]

Man, great content. But the screen zooms in and outs made me dizzy. I stopped watching because of that.

[@GiraffeAcademy]

Hey hj, thanks for the feedback, much appreciated! I'll keep that in mind when filming videos in the future

[@Hendrix312002]

I agree, the content is great, but the constant zooming is really unnecessary. If you watch in HD you see everything perfectly fine

[@arronmccrory]

You know what they say... Once you zoom in, you can never zoom out.

[@skunchtv]

i thought the zooming was cool , Sorry boomer

[@robertmcdonnell2807]

enjoyied video thanks but please don't zoom in and out it just distracts from the information - thanks

[@fenixcustomsoftware]

This looks more complicated than doing bootstrap. I think I'll stick with bootstrap.

[@LoweHenry]

_index.md

[@TeenstarletsInfo2015]

Do you notice that you keep saying the same things over and over again?

[@bowen192]

Have you noticed that you could eat an apple through a letterbox?

[@KhadijahCelestine]

For beginners this is actually good because you're usually not going to learn something the first time it's said.

[@0cool966]

There is nothing worst than zooming in and out in tutorial videos. We are not blind.

[@zaragozareview4735]

? no sense comment

[@qwazlipumuller7749]

it's too nervous for me. please don't zoom the picture every few seconds. I would prefer you to higlit the places