Per quanto read more alla fine dei post si presti perfettamente allo scopo, una delle feature di Hugo è sicuramente la sua capacità di personalizzazione.

Come personalizzare il read more in Hugo⌗

È una cosa estremamente banale ma non avendola trovata altrove la segno di seguito. Di default, Hugo prende dal file di configurazione config.toml la stringa da apporre. Segue un estratto del file, si faccia riferimento al parametro “readMore”.

copyright = ""
menuMore = "Show more"
readMore = "Read more"
readOtherPosts = "Read other posts"
missingContentMessage = "Page not found..."
missingBackButtonLabel = "Back to home page"

Sicché, se l’obiettivo è semplicemente cambiare il testo, sarà sufficiente modificare quanto all’interno delle virgolette del parametro “readMore”. Tuttavia per variazioni un attimo più complesse, sarà necessario agire direttamente su index.html, situato generalmente in \layouts\_default\.

Di default, cercando il read-more button all’interno di index.html troveremo

        <div>
          <a class="read-more button"
           href="{{.RelPermalink}}">{{ $.Site.Params.ReadMore }} →/a>
        </div>

{{ $.Site.Params.ReadMore }} attinge al parametro readMore settato su config.toml. Ovvero, così com’è, il post visualizzerà il testo che avremo dato in pasto a readMore. Se vogliamo che visualizzi qualcosa di diverso, sarà necessario, molto banalmente, agire su quella riga. Segue un esempio di modifica (che poi, nel momento in cui scrivo, è quello che utilizzo su questo blog).

        <div>
          <a class="read-more button"
            href="{{.RelPermalink}}">cat "~/posts/{{ .Title }}.md" →</a>
        </div>

Giusto per amor di chiarezza, {{.RelPermalink}} è una variabile che restituisce il link al post e non va toccata mentre {{ .Title }} restituisce semplicemente il titolo del post.