Meta tags not displaying

support
1

I used this in my head.html,
{{ with .Title }}<title>{{ . | title }}</title>{{ end }} {{ with .Site.Params.description }}<meta name="description" content="{{ . }}">{{ end }} {{ with .Site.Params.keywords }}<meta name="keywords" content="{{ . }}">{{ end }}

and my config.toml is,

baseURL = "https://prabhatha.com/"
languageCode = "en-us"
title = "Prabhat"
theme = "Hugo- Organization Portfolio"
summaryLength = 30

[params]
description = "Prabhat, The Temple of Art is an internationally renowned artistic institution from India. The organization has created stage history with a unique blend of tradition along with sophisticated stage techniques of the present technological era."

keywords = "arts, dance, music, theatre, plays, dramas, classical arts studios, a dance studio in Bengaluru, classical dance, theatre performance, stage props arena, costumes unit, make-up, training classes, Abhinaya, dance, music, drama, yoga courses, recording studios"

author = "Balachandiran - TenSketch"

title, description and keywords don’t show up

Screenshot_22
Screenshot_22805Ă—511 45.2 KB

Kindly let me know what should I change. And adding to this,

Title, description and keywords have to change dynamically for each page, What should I do for that. Will separate .md files work or can do something in the config file?

Kindly let me know

2

Hi @TenSketch. Moved your post to a new thread.

1 Like
3

@zwbetz Thanks, waiting for help on my question!

4

Yep, use front matter to assign your page variables. A common practice I like is using default to render values from your config if they are not present in front matter.

Read Requesting Help and share your code, I’ll take a look.

5

@maiki this is my repository,

Kindly let me know what should i change

6

Hi,

A few issues:

Make sure you are passing the context or the “dot” to your partials. In your layouts/_default/baseof.html for example:

{{ partial "head" }} => {{ partial "head" . }}

Relevant docs: https://gohugo.io/templates/partials/

As posted above, you can use page variables in the front matter of your content to have different values applied to each page. And then use a default site-wide value when it is not specified.

So, for example:

{{ if .Params.description }}
  <meta name="description" content="{{ .Params.description }}">
{{ else if .Site.Params.description }}
  <meta name="description" content="{{ .Site.Params.description }}">
{{ end }}

Relevant docs:

Extra notes:

  • You are using <meta property="og:url" content="{{.baseURL}}"> in your partials/head.html. This should be {{.Site.BaseURL}} instead.

  • content/_index.md has no front matter.

3 Likes
7

@pointyfar, Thanks a lot. Works fine now! :grinning:

Sharing the working code- unique titles, description, keywords, og meta tags…

<title>{{ if .Title }}{{ .Title }} | {{ end }}{{ .Site.Title }}</title>
{{ if .Params.description }}
<meta name="description" content="{{ .Params.description }}">
{{ else if .Site.Params.description }}
<meta name="description" content="{{ .Site.Params.description }}">
{{ end }}
{{ if .Params.keywords }}
<meta name="keywords" content="{{ .Params.keywords }}">
{{ else if .Site.Params.keywords }}
<meta name="keywords" content="{{ .Site.Params.keywords }}">
{{ end }}
<!-- og meta tags -->
<meta property="og:url" content="{{.Site.BaseURL}}">
<meta property="og:image" content="{{.Site.BaseURL}}images/logo2.png">
{{ if .Params.description }}
<meta property="og:description" content="{{ .Params.description }}">
{{ else if .Site.Params.description }}
<meta property="og:description" content="{{ .Site.Params.description }}">
{{ end }}
{{ if .Params.keywords }}
<meta property="og:keywords" content="{{ .Params.keywords }}">
{{ else if .Site.Params.keywords }}
<meta property="og:keywords" content="{{ .Site.Params.keywords }}">
{{ end }}

and the site link,

https://www.prabhatha.com/

2 Likes
9

hi, I have been using the same code, and after some days, og image and description are not showing in both whatsapp and facebook,

Screenshot_4
Screenshot_4.png1011Ă—213 20.6 KB

i tried clearing caches, but doesn’t work.

whereas, i tried adding og tags to my content manager page it works fine,

`<!doctype html>
 <html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=egde">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Prabhat-Content Manager</title>
<meta property="og:url" content="https://www.prabhatha.com/admin/">
<meta property="og:type" content="website">
<meta property="og:image" content="https://www.prabhatha.com/admin/ogimage.png">
<meta property="og:description" content="Admin panel of Prabhat site">
<link rel="icon" type="image/png" sizes="32x32" href="/images/favicons/favicon- 
 32x32.png">
<script src="https://identity.netlify.com/v1/netlify-identity-widget.js"></script>
</head>

<body>
<!-- Include the script that builds the page and powers Netlify CMS -->
<script src="https://unpkg.com/netlify-cms@^2.3.1/dist/netlify-cms.js"></script>
</body>

</html>`

is it anything to do with hugo?

10

@pointyfar Hi can you check the code and tell me,

OG description and image is not showing again in hugo sites