Fix baseURL in Netlify deployments (needed to fix twitter:image) (#…

…3821) * Fix baseURL in Netlify deployments (needed to fix `twitter:image`) Signed-off-by: Mathew Wicks <[email protected]> * Fix `netlify-plugin-checklinks` failing Signed-off-by: Mathew Wicks <[email protected]> * Ensure social meta tags are ordered correctly Signed-off-by: Mathew Wicks <[email protected]> * Fix malformatted LD+JSON schema Signed-off-by: Mathew Wicks <[email protected]> * Add Twitter account for meta tags Signed-off-by: Mathew Wicks <[email protected]> * Fix missing descriptions on LD+JSON + prevent 404 page Signed-off-by: Mathew Wicks <[email protected]> --------- Signed-off-by: Mathew Wicks <[email protected]>
kubeflow · Jul 23, 2024 · fff5659 · fff5659
1 parent 2554073
commit fff5659
Show file tree

Hide file tree

Showing 5 changed files with 78 additions and 32 deletions.
diff --git a/config.toml b/config.toml
@@ -117,9 +117,8 @@ enable = true
   github_project_repo = "https://github.com/kubeflow/kubeflow"
 
   RSSLink = "/index.xml"
-  author = "kubeflow.org" # add your company name
-  github = "kubeflow" # add your github profile name
-  twitter = "kubeflow" # add your twitter profile
+  author = "kubeflow.org"
+  github = "kubeflow"
 
   copyright = "The Kubeflow Authors."
   privacy_policy = "https://policies.google.com/privacy"
@@ -152,6 +151,12 @@ enable = true
   # NOTE: enable it per-page with `mathjax: true` in front matter
   mathjax = false
 
+  # Social media accounts
+  [params.social]
+
+    # Twitter account (used to set `twitter:site` in the SEO partial)
+    twitter = "kubeflow"
+
   # These entries appear in the drop-down menu at the top of the website.
   [[params.versions]]
     version = "master"

diff --git a/layouts/partials/head.html b/layouts/partials/head.html
@@ -22,14 +22,12 @@
   {{ end -}}
 </title>
 <meta name="description" content="{{ template "partials/page-description.html" . }}">
-{{ template "_internal/opengraph.html" . -}}
 {{ template "_internal/schema.html" . -}}
-{{ template "_internal/twitter_cards.html" . -}}
 
-<!-- include our custom Kubeflow "social_image_generator" partial -->
+<!-- include our custom "social_image_generator" partial -->
 {{ partial "social_image_generator" . }}
 
-<!-- include our custom Kubeflow "seo_schema" partial -->
+<!-- include our custom "seo_schema" partial -->
 {{ partial "seo_schema" . }}
 
 {{ partialCached "head-css.html" . "asdf" -}}

diff --git a/layouts/partials/seo_schema.html b/layouts/partials/seo_schema.html
@@ -1,26 +1,46 @@
+{{- if and (not .IsHome) .File }}
 <script type="application/ld+json">
+[
   {
       "@context" : "http://schema.org",
-      "@type" : "WebSite",
-      "mainEntityOfPage": {
-           "@type": "WebPage",
-           "@id": "{{ .Site.BaseURL }}"
-      },
-      "articleSection" : "{{ .Section }}",
-      "name" : "{{ .Title }}",
-      "headline" : "{{ .Title }}",
-      "description" : "{{ if .Description }}{{ .Description }}{{ else }}{{if .IsPage}}{{ .Summary }}{{ end }}{{ end }}",
+      "@type" : "Article",
+      "articleSection" : {{ .Section }},
+      "name" : {{ .Title }},
+      "headline" : {{ .Title }},
+      {{- if .Description }}
+      "description" : {{ .Description }},
+      {{- else if .IsPage }}
+      "description" : {{ .Summary }},
+      {{- end }}
       "inLanguage" : "en-US",
-      "author" : "{{ range .Site.Author }}{{ . }}{{ end }}",
-      "creator" : "{{ range .Site.Author }}{{ . }}{{ end }}",
-      "publisher": "{{ range .Site.Author }}{{ . }}{{ end }}",
-      "accountablePerson" : "{{ range .Site.Author }}{{ . }}{{ end }}",
-      "copyrightHolder" : "{{ range .Site.Author }}{{ . }}{{ end }}",
-      "copyrightYear" : "{{ .Date.Format "2006" }}",
-      "datePublished": "{{ .Date }}",
-      "dateModified" : "{{ .Date }}",
-      "url" : "{{ .Permalink }}",
-      "wordCount" : "{{ .WordCount }}",
+      "copyrightHolder" : {{ .Site.Param "copyright" }},
+      "copyrightYear" : {{ .Lastmod.Year }},
+      "dateModified" : {{ .Lastmod }},
+      "url" : {{ .Permalink }},
+      "wordCount" : {{ .WordCount }},
       "keywords" : [ {{ if isset .Params "tags" }}{{ range .Params.tags }}"{{ . }}",{{ end }}{{ end }}"Kubeflow" ]
   }
-  </script>
+  {{- if gt (len .Ancestors) 1 }},
+  {
+      "@context" : "http://schema.org",
+      "@type" : "BreadcrumbList",
+      "itemListElement" : [
+          {{- $finalIndex := sub (len .Ancestors) 1 }}
+          {{- range $index, $item := .Ancestors.Reverse }}
+          {{- if gt $index 0 }}
+          {
+              "@type" : "ListItem",
+              "position" : {{ $index }},
+              "item" : {
+                  "@id" : {{ $item.Permalink }},
+                  "name" : {{ $item.Title }}
+              }
+          }{{ if ne $index $finalIndex }},{{ end }}
+          {{- end }}
+          {{- end }}
+      ]
+  }
+  {{- end }}
+]
+</script>
+{{- end }}
diff --git a/layouts/partials/social_image_generator.html b/layouts/partials/social_image_generator.html
@@ -7,13 +7,15 @@
 
   <!-- OpenGraph metadata (used by Facebook, LinkedIn, etc.) -->
   <meta property="og:image" content="{{ $img.Permalink }}">
-  <meta property="og:image:type" content="image/png">
+  <meta property="og:image:type" content="{{ $img.MediaType.Type }}">
   <meta property="og:image:width" content="{{ $img.Width }}">
   <meta property="og:image:height" content="{{ $img.Height }}">
+  {{ template "_internal/opengraph.html" . }}
 
   <!-- Twitter Card metadata -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:image" content="{{ $img.Permalink }}">
+  {{ template "_internal/twitter_cards.html" . }}
 
 {{- else if not .File }}
   <!-- NOTE: we filter out any pages that are not actually files (only the 404 page should match this) -->
@@ -51,11 +53,13 @@
 
   <!-- OpenGraph metadata (used by Facebook, LinkedIn, etc.) -->
   <meta property="og:image" content="{{ $img.Permalink }}">
-  <meta property="og:image:type" content="image/png">
+  <meta property="og:image:type" content="{{ $img.MediaType.Type }}">
   <meta property="og:image:width" content="{{ $img.Width }}">
   <meta property="og:image:height" content="{{ $img.Height }}">
+  {{ template "_internal/opengraph.html" . }}
 
   <!-- Twitter Card metadata -->
   <meta name="twitter:card" content="summary_large_image">
   <meta name="twitter:image" content="{{ $img.Permalink }}">
+  {{ template "_internal/twitter_cards.html" . -}}
 {{- end }}
diff --git a/netlify.toml b/netlify.toml
@@ -1,14 +1,31 @@
 [build]
   publish = "public"
+  # setting baseURL is required for `PAGE.Permalink` to correctly include the full `https://DOMAIN/` prefix
+  # which is required for things like `twitter:image` meta tags to work correctly
   command = "cd themes/docsy && git submodule update -f --init && npm install && cd ../.. && hugo --gc --minify"
 
+[context.deploy-preview]
+  # for deploy previews, the domain will be `https://deploy-preview-PR_NUMBER--competent-brattain-de2d6d.netlify.app/`
+  # which can be read from the `DEPLOY_PRIME_URL` environment variable in Netlify
+  command = "cd themes/docsy && git submodule update -f --init && npm install && cd ../.. && hugo --gc --minify --baseURL $DEPLOY_PRIME_URL"
+
+[context.production]
+  # for production, the domain will be `https://www.kubeflow.org/`
+  command = "cd themes/docsy && git submodule update -f --init && npm install && cd ../.. && hugo --gc --minify --baseURL https://www.kubeflow.org/"
+
 [[context.deploy-preview.plugins]]
 package = "netlify-plugin-checklinks"
 
   [context.deploy-preview.plugins.inputs]
 
-  # You can mark some check as todo, which will execute the check, but allow failures.
-  # todoPatterns is an array of strings you can match against failing reports
+  # If a link contains these patterns it will be ignored.
+  skipPatterns = [
+    # ignore absolute links, which are only found in tags like `<meta property="og:url" content="URL_HERE">`
+    # https://github.com/Munter/netlify-plugin-checklinks/issues/388
+    "competent-brattain-de2d6d.netlify.app",
+  ]
+
+  # If a link contains these patterns it will not fail the build, but will be reported as a TODO in the build log.
   todoPatterns = [
     "public/docs/components/central-dash/",
     "public/docs/components/notebooks/",
@@ -38,14 +55,16 @@ package = "netlify-plugin-checklinks"
   ]
 
 [context.deploy-preview.environment]
+  HUGO_ENV = "development"
   HUGO_VERSION = "0.124.1"
   NODE_VERSION = "18"
 
 [context.production.environment]
-  HUGO_VERSION = "0.124.1"
   HUGO_ENV = "production"
+  HUGO_VERSION = "0.124.1"
   NODE_VERSION = "18"
 
 [context.branch-deploy.environment]
+  HUGO_ENV = "development"
   HUGO_VERSION = "0.124.1"
   NODE_VERSION = "18"