SEO

alanta · Nov 22, 2020 · bf9705b · bf9705b
1 parent 481e557
commit bf9705b
Show file tree

Hide file tree

Showing 8 changed files with 149 additions and 4 deletions.
diff --git a/Models/ContentTypes/Home.cs b/Models/ContentTypes/Home.cs
@@ -4,7 +4,12 @@
 
 namespace Kentico.Kontent.Statiq.Memoirs.Models
 {
-    public partial class Home
+    public partial class Home : IPageMetadata
     {
+        public string Url { get; } = "/";
+        public string Title { get; } = "Home";
+        public string Body => this.Contact;
+        public IEnumerable<IAsset> Image { get; } = Array.Empty<IAsset>();
+        public IEnumerable<IMultipleChoiceOption> Settings { get; set; } = Array.Empty<IMultipleChoiceOption>();
     }
 }
diff --git a/Models/SocialSharingMetadata.cs b/Models/SocialSharingMetadata.cs
@@ -0,0 +1,41 @@
+using Kentico.Kontent.Delivery.Abstractions;
+using Kentico.Kontent.Statiq.Memoirs.Models;
+using System.Linq;
+
+namespace MemoirsTheme.Models
+{
+    public class SocialSharingMetadata
+    {
+        public SocialSharingMetadata(IPageMetadata site, IPageMetadata page)
+        {
+            Title = page.MetadataOgTitle.Cascade(page.MetadataMetaTitle).Cascade(page.Title);
+            Url = page.Url;
+            TwitterCard = page.MetadataTwitterCard.FirstOrDefault()?.Codename ?? "summary_large_image";
+            Description = page.MetadataOgDescription
+                .Cascade(page.MetadataMetaDescription);
+            Image = page.MetadataOgImage.FirstOrDefault() ?? site?.MetadataOgImage.FirstOrDefault();
+            TwitterSite = page.MetadataTwitterSite
+                .Cascade(site?.MetadataTwitterSite);
+            TwitterCreator = page.MetadataTwitterCreator
+                .Cascade(site?.MetadataTwitterCreator);
+            TwitterImage = page.MetadataTwitterImage.FirstOrDefault() ?? Image;
+        }
+
+        public string Url { get; }
+        public string Title { get; }
+        public string Description { get; }
+        public IAsset Image { get; }
+        public IAsset TwitterImage { get; }
+        public string TwitterCreator { get; }
+        public string TwitterSite { get; }
+        public string TwitterCard { get; set; }
+    }
+
+    public static class MetadataHelpers
+    {
+        public static string Cascade(this string preferred, string fallback)
+        {
+            return string.IsNullOrWhiteSpace(preferred) ? fallback : preferred;
+        }
+    }
+}
diff --git a/Modules/HtmlOptimizer.cs b/Modules/HtmlOptimizer.cs
@@ -45,6 +45,11 @@ public OptimizeHtml WithSettings(Action<HtmlSettings> settings)
 
         protected override async Task<IEnumerable<IDocument>> ExecuteInputAsync(IDocument input, IExecutionContext context)
         {
+            if (!_enabled)
+            {
+                return (input).Yield(); // nothing to do, return original document
+            }
+
             var original = await input.GetContentStringAsync();
             if (string.IsNullOrWhiteSpace(original))
             {

diff --git a/Pipelines/Pages.cs b/Pipelines/Pages.cs
@@ -2,6 +2,7 @@
 using Kentico.Kontent.Delivery.Urls.QueryParameters;
 using Kentico.Kontent.Statiq.Memoirs.Models;
 using Kontent.Statiq;
+using MemoirsTheme.Models;
 using MemoirsTheme.Modules;
 using Statiq.Common;
 using Statiq.Core;
@@ -15,6 +16,7 @@ public class Pages : Pipeline
     {
         public Pages(IDeliveryClient deliveryClient, SiteSettings site)
         {
+            Dependencies.Add(nameof(Seo));
             InputModules = new ModuleList
             {
                 new Kontent<Page>(deliveryClient)
@@ -40,6 +42,14 @@ public Pages(IDeliveryClient deliveryClient, SiteSettings site)
             {
                 new MergeContent(new ReadFiles( KontentConfig.Get<Page,string>( ViewForPage))),
                 new RenderRazor()
+                    .WithViewData( "SEO", Config.FromDocument((doc, ctx) =>
+                    {
+                        var home = ctx.Outputs.FromPipeline(nameof(Seo)).First().AsKontent<Kentico.Kontent.Statiq.Memoirs.Models.Home>();
+                        var post = doc.AsKontent<Page>();
+
+                        return new SocialSharingMetadata(home, post);
+
+                    }) )
                     .WithViewData("Title", KontentConfig.Get<Page,string>( p => p.Title ))
                     .WithViewData("SiteMetadata", site)
                     .WithModel(KontentConfig.As<Page>()),

diff --git a/Pipelines/Posts.cs b/Pipelines/Posts.cs
@@ -2,6 +2,7 @@
 using Kentico.Kontent.Delivery.Urls.QueryParameters;
 using Kentico.Kontent.Statiq.Memoirs.Models;
 using Kontent.Statiq;
+using MemoirsTheme.Models;
 using MemoirsTheme.Modules;
 using Statiq.Common;
 using Statiq.Core;
@@ -15,6 +16,7 @@ public class Posts : Pipeline
     {
         public Posts(IDeliveryClient deliveryClient, SiteSettings site)
         {
+            Dependencies.Add(nameof(Seo));
             InputModules = new ModuleList{
                 new Kontent<Post>(deliveryClient)
                     .OrderBy(Post.PostDateCodename, SortOrder.Descending)
@@ -38,6 +40,14 @@ public Posts(IDeliveryClient deliveryClient, SiteSettings site)
             ProcessModules = new ModuleList {
                 new MergeContent(new ReadFiles(patterns: "Post.cshtml") ),
                 new RenderRazor()
+                    .WithViewData( "SEO", Config.FromDocument((doc, ctx) =>
+                    {
+                        var home = ctx.Outputs.FromPipeline(nameof(Seo)).First().AsKontent<Kentico.Kontent.Statiq.Memoirs.Models.Home>();
+                        var post = doc.AsKontent<Post>();
+
+                        return new SocialSharingMetadata(home, post);
+
+                    }) )
                     .WithViewData("Title", KontentConfig.Get<Post,string>( p => p.Title ))
                     .WithViewData("Author", KontentConfig.Get<Post,Author>( p => p.Author.OfType<Author>().FirstOrDefault() ))
                     .WithViewData("SiteMetadata", site )

diff --git a/Pipelines/Seo.cs b/Pipelines/Seo.cs
@@ -0,0 +1,20 @@
+using Kentico.Kontent.Delivery.Abstractions;
+using Kentico.Kontent.Delivery.Urls.QueryParameters;
+using Kontent.Statiq;
+using Statiq.Common;
+using Statiq.Core;
+
+namespace MemoirsTheme.Pipelines
+{
+    public class Seo : Pipeline
+    {
+        public Seo(IDeliveryClient deliveryClient)
+        {
+            InputModules = new ModuleList
+            {
+                new Kontent<Kentico.Kontent.Statiq.Memoirs.Models.Home>(deliveryClient)
+                    .WithQuery(new LimitParameter(1), new DepthParameter(1))
+            };
+        }
+    }
+}
diff --git a/input/Shared/_SocialSharingMetadata.cshtml b/input/Shared/_SocialSharingMetadata.cshtml
@@ -0,0 +1,45 @@
+@model MemoirsTheme.Models.SocialSharingMetadata
+<meta property="og:type" content="website" />
+<meta property="og:url" content="@Model.Url">
+<meta property="og:title" content="@Model.Title">
+<meta property="og:description" content="@Model.Description">
+<meta name="twitter:card" content="@Model.TwitterCard">
+@if (!string.IsNullOrWhiteSpace(@Model.TwitterCreator))
+{
+    <meta name="twitter:site" content="@Model.TwitterSite"/>
+}
+@if (!string.IsNullOrWhiteSpace(@Model.TwitterCreator))
+{
+    <meta name="twitter:creator" content="@Model.TwitterCreator" />
+}
+
+@if (Model.Image != null)
+{
+    // https://developer.twitter.com/en/docs/tweets/optimize-with-cards/overview/abouts-cards
+    // summary_large_image aspect 2:1, min 300x157 max 4096x4096
+    // summary aspect 1:1, min 144x144 max maximum of 4096x4096 pixels
+
+    var width = 800;
+    var height = 800;
+
+    <meta property="og:image" content="@Model.Image.Url?w=@width&h=@height&fit=crop">
+    <meta property="og:image:alt" content="@Model.Image.Description" />
+    <meta property="og:image:width" content="@width" />
+    <meta property="og:image:height" content="@height" />
+    <meta property="og:image:type" content="@Model.Image.Type" />
+}
+
+@if (Model.TwitterImage != null)
+{
+    // https://ogp.me/
+    // summary_large_image aspect 2:1, min 300x157 max 4096x4096
+    // summary aspect 1:1, min 144x144 max maximum of 4096x4096 pixels
+    var (height, width) = Model.TwitterCard switch
+    {
+        "summary_large_image" => (height: 500, width: 1000),
+        _ => (height: 500, width: 500)
+    };
+
+    <meta name="twitter:image" content="@Model.TwitterImage.Url?w=@width&h=@height&fit=crop">
+    <meta name="twitter:image:alt" content="@Model.TwitterImage.Description" />
+}
diff --git a/input/_Layout.cshtml b/input/_Layout.cshtml
@@ -1,8 +1,10 @@
 @using Kentico.Kontent.Statiq.Memoirs.Models
+@using MemoirsTheme.Models
 @{ var site = ViewBag.SiteMetadata as SiteSettings;
-    var author = ViewBag.Author as Author;
-    var name = author?.Name ?? "John Doe";
-    var isHome = ViewBag.IsHome ?? false; }
+    var isHome = ViewBag.IsHome ?? false;
+    var seo = ViewData["SEO"] as SocialSharingMetadata;
+
+}
 <!DOCTYPE html>
 <html lang="en">
 <head>
@@ -14,6 +16,13 @@
     <title>@ViewBag.Title | @site.Name</title>
 
     @RenderSection("seo", required: false)
+    @if (!IsSectionDefined("seo"))
+    {
+        @if (seo != null)
+        {
+            <partial name="Shared/_SocialSharingMetadata" model="seo"/>
+        }
+    }
 
     <link href="@Html.GetLink("/assets/css/prism.css")" rel="stylesheet">