When showing your blog post, either as a single page or within a blog post list it can be nice to show the tags associated with that post (we do here on MakeWithHugo!). This is going to be a quick post (hopefully) showing you how to add your tags as a list and each linked up.
You can add this code to either your single.html layout file or inside the loop in list.html.
1
2
3
4
5
6
7
8
9
<divclass="tags-list"> {{- with .Params.tags -}}
{{- if ge (len .) 1 -}}
{{- range . -}}
<ahref="{{ $.Site.BaseURL }}tags/{{ . | urlize }}/">#{{ . }}</a> {{ end -}}
{{- end -}}
{{- end -}}
</div>
This code works by looping our your posts tags (using with and range) then making a link for each. When making the url we pass the tag name through urlize first incase there are spaces or non-url compatible characters.
For this to work, you’ll need to define your tags on the post like this:
1
2
3
4
5
6
7
8
---
layout: post
title: Tags Example
tags:
- example
- mytag
- makewithhugo
---
Which in HTML will output something like this (I’ve changed the indentation a bit):
Edd is a PHP and Go developer who enjoys blogging about his experiences, mostly about creating and coding new things he's working on and is a big beliver in open-source and Linux.
Add Adsense Ads to Your Posts
–
This post sets out how you can add your Google Adsense code to your blog posts. As this is MakeWithHugo, we’ll be adding them to our Hugo site.
You’ll need a few things before starting, an Adsense account, the snippet of code from Adsense and knowing where you want to put them (or auto ads for the easy option).
There’s a few different ways to achieve this, based on where you want them.
Change a URL on a Post (While Preserving SEO)
–
If you use Hugo, we’ve all been there: create a post, give it a url - spell something wrong in the url, doh! This post hopes to explain how you can change the URL of a post, while preserving the SEO benefits associated with it.
We can do this, by changing the URL on the post to what we want then setting up an alias for the old url. This was existing traffic and Google still know what’s going on and will treat it as the same page.
Hide a Page in Hugo
–
Option 1: Draft The simplest way to hide a page when using Hugo is probably to set the post as a draft. This way, you still have the content ready to go for when you need it.
To hide a page by setting it as draft, so our drafts page:
Set Post as Draft Tutorial Option 2: Hide from Posts List You still want the page to be visible, but you don’t want to show it your blog posts list?