Previous and Next links for my blog's posts (III)

Just a quick follow-up to the first and second post about this topic.

I found the way to name my navigation buttons depending on the subsequent post having a title or not. If it has a title, I want the button to show that title. But if it does not, I want a placeholder text like “Previous” and “Next”.

Once again, MacGPT came to the rescue and gave me this line:

<a class="button next" href="{{ .Permalink }}">{{ if .Title }}{{ .Title }}{{ else }}Next{{ end }}</a>

So this is the complete code for the HTML in the Sumo Theme’s Microhook (layouts/partials/microhook-after-post.html):

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Justificar Enlace</title>
    <link rel="stylesheet" href="/css/styles.css"> <!-- Ruta al archivo CSS -->
</head>
<body>
    <div class="navigation">
        {{ with .PrevInSection }}
        <a class="button previous" href="{{ .Permalink }}">
            {{ if .Title }}{{ .Title }}{{ else }}Previous{{ end }}
        </a>
        {{ end }}
        {{ with .NextInSection }}
        <a class="button next" href="{{ .Permalink }}">
            {{ if .Title }}{{ .Title }}{{ else }}Next{{ end }}
        </a>
        {{ end }}
    </div>
</body>
</html>

And this is the result: