Stuck on Step 8 of Quickstart Guide (adding multiple images)

support
1

Hi all, I’m following the QSG to learn Hugo and I’m stuck on Step 8 where it says “After adding a few more books, the shelf appears as shown below.” but there’s no example that actually shows how to do that… I’m trying to figure out how to make a page like that with all those different images.

I went to the github page of the robust theme and couldn’t find the index.html under layouts that the guide was referencing, so I don’t understand the structure of this bookshelf summary page as a whole.

Is the secret bit of code that makes the multiple images show up the last part of this line here? ie, I’m not seeing a for loop or something similar that I’d recognize. How is it making the list of items?
background-image: url({{ $.Site.BaseURL }}images/{{ with .Params.image }}{{ . }}

Thanks for any help!

2

The answer is way back in Step 5, and if you blink you miss it:

Now, you can clone one or more themes inside the themes directory. We will use the robust theme, but at a commit (in its history) that works with this quickstart.
$ git clone https://github.com/dim0627/hugo_theme_robust.git $ (cd hugo_theme_robust; git checkout b8ce466)

Here is a link for that commit. You’ll be able to find the index.html in the layouts folder there.

1 Like
3

Ah you’re right! Thanks so much for catching that!

4

If you’re on Step 8 of the QuickStart Guide (QSG) and you cannot find the index.html file referenced, you probably do not have the version of the Hugo Robust Theme that the QSG uses.

The QSG, in Step 5, assumes you understand the relevance of this:
$ (cd hugo_theme_robust; git checkout b8ce466)

I did not (I’m not a Git Guru). At this time, I understand this to mean, “Hey, go back and get an earlier version of these files.” I am also guessing that it is not possible to initially git an earlier version so I have to first git the latest version, then go back and checkout the earlier version. :smile:

Here is what worked for me.

  1. clone the latest and greatest Hugo Robust Theme with this:
    $ git clone https://github.com/dim0627/hugo_theme_robust.git

  2. Then change directories so that you are in the hugo_theme_robust sub-directory:
    $ cd hugo_theme_robust

  3. Finally, git the commit you need to follow the Quickstart Guide by doing this:
    $ git checkout b8ce466

5

I don’t understand Hugo well enough to do it today (not sure if I ever will), but if I find time I’ll try to contribute a rewrite to make the steps more understandable – and accurate…