Skip to content
Regis Philibert edited this page Jan 28, 2022 · 9 revisions

HUGE will take care of your SEO needs...

TL;DR:

Page

---
# content/blog/victorian-houses.md
title: Victorian Houses
date: 2021-06-24T08:32:27.000Z
image: /media/aldric-rivat-LfsDV6VObmw-unsplash.jpg
translationKey: victorian-houses
seo:
  description: Victorian House galore for everyone who loves them!
---
Photo Credits: [Aldric Rivat](https://unsplash.com/@aldric)

Hugo template

<head>
<!-- SEO -->
{{ partial "huge/seo/tags" . }}
</head>

HTML

<head>
<!-- SEO -->
<title >Victorian Houses | Architecture Then!</title>
<meta content="index, follow" name="robots">
<meta content="Victorian Houses | Architecture Then!" property="og:title">
<meta content="Victorian Houses | Architecture Then!" name="twitter:title">
<meta content="Today we write about: Victorian House galore for everyone who loves them!" name="description">
<meta content="Today we write about: Victorian House galore for everyone who loves them!" property="og:description">
<meta content="Today we write about: Victorian House galore for everyone who loves them!" name="twitter:description">
<script type="application/ld+json">{"@context":"https://schema.org","@type":"website","dateModified":null,"datePublished":null,"description":"Today we write about: Victorian House galore for everyone who loves them!","headline":"Victorian Houses | Architecture Then!","image":"media/aldric-rivat-LfsDV6VObmw-unsplash_1200x0_resize_q75_box.jpg","url":"https://archi-then.com/post/victorian-houses/","wordcount":"8"}</script>
<meta content="https://archi-then.com/post/victorian-houses/" property="og:url">
<meta content="https://archi-then.com/post/victorian-houses/" name="twitter:url">
<meta content="Architecture Then!" property="og:site_name">
<meta content="en" property="og:locale">
<meta content="https://archi-then.com/post/victorian-houses/" name="canonical">
<link href="https://archi-then.com/fr/post/maisons-victoriennes/" hreflang="fr" rel="alternate">
<meta content="website" property="og:type">
<meta content="2021-06-24T08:32:27+00:00" property="og:published_time">
<meta content="/media/aldric-rivat-LfsDV6VObmw-unsplash_1200x0_resize_q75_box.jpg" property="og:image">
<meta content="/media/aldric-rivat-LfsDV6VObmw-unsplash_1200x0_resize_q75_box.jpg" name="twitter:image">
<meta content="summary_large_image" name="twitter:card">
</head>

Settings

HUGE has everything it needs from the pages' Front Matter and the project settings to deduce a page's SEO data. Yet some settings are relevants:

default_image

A string. This path will be used as the src for the image to use in the absence of page's seo.image or image key. Either relative to assets directory, or the static directory.

disable_jsonld

A boolean. Defaults to false.

HUGE/SEO add JSON+LD by default, this will disable it if needed.

disable_title_tag

A boolean. HUGE/SEO handles the <title> tag for your pages. If set to true, this will not print the tag. Defaults to false.

enable_follow

A boolean. If enabled, this will let HUGE handles follow/nofollow tags for your pages. See Prevent Indexing/Private Pages. Defaults to false.

Front Matter

To give control over one page's SEO Data, HUGE look for an seo field in the page's Front Matter.

  • description: A raw string.
  • title: A raw string.
  • canonical: A URL.
  • image: A path relative to the image.

Example

---
# content/blog/victorian-houses.md
title: Victorian Houses
image: /media/aldric-rivat-LfsDV6VObmw-unsplash.jpg
seo:
  image: /media/victorian-social.jpg
  description: Victorian House galore for everyone who loves them!
---

Prevent indexing / Private Pages

If the enable_follow setting is enabled, HUGE will add the following meta tags to all your pages only if the string returned by huge/env/Get matches production (See HUGE/Env):

<meta name="robots" content="index, follow">

This setting can be overridden on a page-by-page-basis with the following front matter:

---
# content/note/note-to-self.md
title: Note to self
# [...]
private: true
---

The page above, when in production will sport the nofollow/noindex meta tag.

<meta name="robots" content="noindex, nofollow">

Alternatively, you can set to private all pages from a section with Hugo's front matter cascade:

---
# content/note/_index.md
title: Notes
# [...]
cascade:
  private: true
---

Utlimately to make all pages private, add the aforementioned cascade field to the homepage content file.

Functions

huge/seo/tags

The "huge/seo/tags" partial is used to print the tags for the page's SEO data.

Parameters

A Page

Examples

<head>
<!-- SEO -->
{{ partial "huge/seo/tags" . }}
</head>

Override HUGE SEO Logic

As smart as this feature is, any given project will have its own logic to build SEO Data for its pages. In order to complement HUGE's default logic you should add to your project the following returning partial: layouts/partials/huge/seo/data.html

From the partial you can access the SEO Data model with .SEO and the original Page Object with .Page

Here is the Data model before user modification:

  • canonical: String (ex: https://example.com/that-page)
  • description: String
  • image: A string. The absolute URL of the HUGE generated asset (1200 x 630 when applicable)
  • image_original: The original value of the deduced image without HUGE's media transformations.
  • image_relative: The relative URL of the HUGE generated asset.
  • locale: A string matching the page's language code.
  • private: A boolean.
  • site_name: A string. The name of the site as referenced in SEO titles etc...
  • title: String (ex: That Page | That Site)
  • translations: Slice
    • code: A string with the translation's language code.
    • permalink: The absolute URL of the translation
  • twitter_card: summary_large_image
  • type: website

Example

In this example we need to focus our efforts on the site recipes and

  1. Use a custom parameter for the SEO description
  2. Update type with the value recipe
{{/* layouts/partials/huge/seo/data.html */}}
{{ $s := newScratch }}
{{ $s.Set "data" dict }}

{{ if eq .Page.Type "recipe" }}
  {{ $s.SetInMap "data" "type" "recipe" }}
  {{ with .Page.Params.recipe_incentive }}
    {{ $s.SetInMap "data" "description" . }}
  {{ end }}
{{ end }}

{{ return $s.Get "data" }}