diff options
author | Mark Otto <markdotto@gmail.com> | 2022-07-20 22:06:04 +0300 |
---|---|---|
committer | Mark Otto <markdotto@gmail.com> | 2022-07-26 01:09:12 +0300 |
commit | 107ee3c9edeb3b20cfcacc1051b9aebc9a40533e (patch) | |
tree | e8bb8f0f5bcf5243467ef00bbc977f590d3c45fa | |
parent | dc901d25fa663807886a9564765bae0f6fe47f8f (diff) |
Simplify social images and add ability to set per-page images
- Removes the homepage summary layout in favor of the larger image card (makes it more consistent with other pages)
- Reuses new thumbnails for Webpack, Parcel, and Vite guides to add their new social images
-rw-r--r-- | site/content/docs/5.2/getting-started/parcel.md | 1 | ||||
-rw-r--r-- | site/content/docs/5.2/getting-started/vite.md | 1 | ||||
-rw-r--r-- | site/content/docs/5.2/getting-started/webpack.md | 1 | ||||
-rw-r--r-- | site/layouts/partials/social.html | 18 |
4 files changed, 16 insertions, 5 deletions
diff --git a/site/content/docs/5.2/getting-started/parcel.md b/site/content/docs/5.2/getting-started/parcel.md index 674a39837b..d28f92384f 100644 --- a/site/content/docs/5.2/getting-started/parcel.md +++ b/site/content/docs/5.2/getting-started/parcel.md @@ -4,6 +4,7 @@ title: "Bootstrap & Parcel" description: The official guide for how to include and bundle Bootstrap's CSS and JavaScript in your project using Parcel. group: getting-started toc: true +thumbnail: guides/bootstrap-parcel@2x.png --- <img class="mb-4 img-fluid rounded-3" srcset="/docs/{{< param docs_version >}}/assets/img/guides/bootstrap-parcel.png, /docs/{{< param docs_version >}}/assets/img/guides/bootstrap-parcel@2x.png 2x" src="/docs/{{< param docs_version >}}/assets/img/guides/bootstrap-parcel.png" width="2000" height="1000" alt=""> diff --git a/site/content/docs/5.2/getting-started/vite.md b/site/content/docs/5.2/getting-started/vite.md index ca71bbe31d..ee08379a7c 100644 --- a/site/content/docs/5.2/getting-started/vite.md +++ b/site/content/docs/5.2/getting-started/vite.md @@ -4,6 +4,7 @@ title: "Bootstrap & Vite" description: The official guide for how to include and bundle Bootstrap's CSS and JavaScript in your project using Vite. group: getting-started toc: true +thumbnail: guides/bootstrap-vite@2x.png --- <img class="mb-4 img-fluid rounded-3" srcset="/docs/{{< param docs_version >}}/assets/img/guides/bootstrap-vite.png, /docs/{{< param docs_version >}}/assets/img/guides/bootstrap-vite@2x.png 2x" src="/docs/{{< param docs_version >}}/assets/img/guides/bootstrap-vite.png" width="2000" height="1000" alt=""> diff --git a/site/content/docs/5.2/getting-started/webpack.md b/site/content/docs/5.2/getting-started/webpack.md index e314ecf6a2..ca104f98c1 100644 --- a/site/content/docs/5.2/getting-started/webpack.md +++ b/site/content/docs/5.2/getting-started/webpack.md @@ -4,6 +4,7 @@ title: "Bootstrap & Webpack" description: The official guide for how to include and bundle Bootstrap's CSS and JavaScript in your project using Webpack. group: getting-started toc: true +thumbnail: guides/bootstrap-webpack@2x.png --- <img class="mb-4 img-fluid rounded-3" srcset="/docs/{{< param docs_version >}}/assets/img/guides/bootstrap-webpack.png, /docs/{{< param docs_version >}}/assets/img/guides/bootstrap-webpack@2x.png 2x" src="/docs/{{< param docs_version >}}/assets/img/guides/bootstrap-webpack.png" width="2000" height="1000" alt=""> diff --git a/site/layouts/partials/social.html b/site/layouts/partials/social.html index a63f6caee8..db3451bb49 100644 --- a/site/layouts/partials/social.html +++ b/site/layouts/partials/social.html @@ -1,17 +1,25 @@ -{{ "<!-- Twitter -->" | safeHTML }} -<meta name="twitter:card" content="{{ if .IsHome }}summary_large_image{{ else }}summary{{ end }}"> +<meta name="twitter:card" content="summary_large_image"> <meta name="twitter:site" content="@{{ .Site.Params.twitter }}"> <meta name="twitter:creator" content="@{{ .Site.Params.twitter }}"> <meta name="twitter:title" content="{{ .Title | markdownify }}"> <meta name="twitter:description" content="{{ .Page.Params.description | default .Site.Params.description | markdownify }}"> -<meta name="twitter:image" content="{{ if .IsHome }}{{ .Site.Params.social_logo_path | absURL }}{{ else }}{{ .Site.Params.social_image_path | absURL }}{{ end }}"> -{{ "<!-- Facebook -->" | safeHTML }} +{{ if .Page.Params.thumbnail }} +<meta name="twitter:image" content="/docs/{{ .Site.Params.docs_version }}/assets/img/{{ .Page.Params.thumbnail }}"> +{{ else }} +<meta name="twitter:image" content="{{ .Site.Params.social_image_path | absURL }}"> +{{ end }} + <meta property="og:url" content="{{ .Permalink }}"> <meta property="og:title" content="{{ .Title | markdownify }}"> <meta property="og:description" content="{{ .Page.Params.description | default .Site.Params.description | markdownify }}"> <meta property="og:type" content="{{ if .IsPage }}article{{ else }}website{{ end }}"> -<meta property="og:image" content="{{ .Site.Params.social_image_path | absURL }}"> <meta property="og:image:type" content="image/png"> <meta property="og:image:width" content="1000"> <meta property="og:image:height" content="500"> + +{{ if .Page.Params.thumbnail }} +<meta property="og:image" content="/docs/{{ .Site.Params.docs_version }}/assets/img/{{ .Page.Params.thumbnail }}"> +{{ else }} +<meta property="og:image" content="{{ .Site.Params.social_image_path | absURL }}"> +{{ end }} |