From d19b220ebc3edf8ca7c8410731c2dd3aba1c7e75 Mon Sep 17 00:00:00 2001 From: Nick Date: Tue, 31 Jan 2023 12:01:52 +0900 Subject: [PATCH] Added a site fallback image option to appsettings If this option is set it will fallback to this image after checking the fallback image fields. In the backoffice it will show if it is using an image from a fallback image field or if it is using the site fallback image. --- .../Config/MetaMomentumConfig.cs | 3 ++ MetaMomentum.Core/Constants.cs | 3 +- .../Controllers/SettingsController.cs | 32 +++++++++++++++++++ MetaMomentum.Core/Models/MetaValues.cs | 7 +++- .../MetaMomentumValueConverter.cs | 3 +- .../MetaMomentum/editorView.controller.js | 16 ++++++++-- .../App_Plugins/MetaMomentum/editorView.html | 12 +++++-- .../MetaMomentum/RenderMetaTags.cshtml | 13 ++++++-- 8 files changed, 79 insertions(+), 10 deletions(-) create mode 100644 MetaMomentum.Core/Controllers/SettingsController.cs diff --git a/MetaMomentum.Core/Config/MetaMomentumConfig.cs b/MetaMomentum.Core/Config/MetaMomentumConfig.cs index cecdbda..b43b976 100644 --- a/MetaMomentum.Core/Config/MetaMomentumConfig.cs +++ b/MetaMomentum.Core/Config/MetaMomentumConfig.cs @@ -10,6 +10,7 @@ public class MetaMomentumConfig { public string OGSiteName { get; set; } = null; public string TwitterName { get; set; } = null; public string FacebookAppId { get; set; } = null; + public string FallbackImageUrl { get; set; } //public string CanonicalDomain { get; set; } = null; #if NET5_0_OR_GREATER @@ -23,6 +24,7 @@ internal MetaMomentumConfig(IConfiguration configuration) { OGSiteName = configSection?.OGSiteName; TwitterName = configSection?.TwitterName; FacebookAppId = configSection?.FacebookAppId; + FallbackImageUrl = configSection?.FallbackImageUrl; //CanonicalDomain = ValidateCanonicalDomain(configSection?.CanonicalDomain); } } @@ -31,6 +33,7 @@ public MetaMomentumConfig() { OGSiteName = ConfigurationManager.AppSettings[$"{Constants.Configuration.SectionName}.{Constants.Configuration.OGSiteName}"]; TwitterName = ConfigurationManager.AppSettings[$"{Constants.Configuration.SectionName}.{Constants.Configuration.TwitterName}"]; FacebookAppId = ConfigurationManager.AppSettings[$"{Constants.Configuration.SectionName}.{Constants.Configuration.FacebookId}"]; + FallbackImageUrl = ConfigurationManager.AppSettings[$"{Constants.Configuration.SectionName}.{Constants.Configuration.FallbackImageUrl}"]; //CanonicalDomain = MetaMomentumConfig.ValidateCanonicalDomain(ConfigurationManager.AppSettings[$"{Constants.Configuration.SectionName}.{Constants.Configuration.CanonicalDomain}"]); } #endif diff --git a/MetaMomentum.Core/Constants.cs b/MetaMomentum.Core/Constants.cs index 272cfb1..dc550f6 100644 --- a/MetaMomentum.Core/Constants.cs +++ b/MetaMomentum.Core/Constants.cs @@ -6,7 +6,8 @@ internal static class Configuration { internal const string OGSiteName = "OGSiteName"; internal const string TwitterName = "TwitterName"; internal const string FacebookId = "FacebookId"; - internal const string CanonicalDomain = "CanonicalDomain"; + internal const string FallbackImageUrl = "FallbackImageUrl"; + //internal const string CanonicalDomain = "CanonicalDomain"; } } } diff --git a/MetaMomentum.Core/Controllers/SettingsController.cs b/MetaMomentum.Core/Controllers/SettingsController.cs new file mode 100644 index 0000000..422b7c8 --- /dev/null +++ b/MetaMomentum.Core/Controllers/SettingsController.cs @@ -0,0 +1,32 @@ + +using MetaMomentum.Config; + + +#if NET5_0_OR_GREATER +using Umbraco.Cms.Web.Common.Controllers; +using Microsoft.AspNetCore.Mvc; +using Umbraco.Cms.Web.Common.Attributes; +#else +using Umbraco.Web.WebApi; +using Umbraco.Web.Mvc; +using System.Web.Http; +#endif + + +namespace MetaMomentum.Controllers { + + [PluginController("MetaMomentum")] + public class SettingsController: UmbracoApiController { + + private readonly MetaMomentumConfig _metaMomentumConfig; + + public SettingsController(MetaMomentumConfig metaMomentumConfig) { + _metaMomentumConfig = metaMomentumConfig; + } + + [HttpGet] + public string FallbackImage() { + return _metaMomentumConfig.FallbackImageUrl; + } + } +} diff --git a/MetaMomentum.Core/Models/MetaValues.cs b/MetaMomentum.Core/Models/MetaValues.cs index 46e8f5e..2b9ce8d 100644 --- a/MetaMomentum.Core/Models/MetaValues.cs +++ b/MetaMomentum.Core/Models/MetaValues.cs @@ -27,10 +27,15 @@ public class MetaValues { public string TwitterName { get; set; } /// - /// This value can be set in the Web.Config under AppSettings.json under `MetaMomentum.TwitterName`. Make sure that you include the @ symbol + /// This value can be set in the Web.Config under AppSettings.json under `MetaMomentum.FacebookAppId`. Make sure that you include the @ symbol /// public string FacebookAppId { get; set; } + /// + /// This value can be set in the Web.Config under AppSettings.json under `MetaMomentum.FallbackImageUrl`. Make sure that you include the @ symbol + /// + public string FallbackImageUrl { get; set; } + [Obsolete("Please use ShareImageUrl instead")] public IPublishedContent ShareImage { get; set; } diff --git a/MetaMomentum.Core/ValueConverters/MetaMomentumValueConverter.cs b/MetaMomentum.Core/ValueConverters/MetaMomentumValueConverter.cs index 108316d..144315b 100644 --- a/MetaMomentum.Core/ValueConverters/MetaMomentumValueConverter.cs +++ b/MetaMomentum.Core/ValueConverters/MetaMomentumValueConverter.cs @@ -171,7 +171,8 @@ private MetaValues MapToMetaValue(object source, bool preview, IPublishedPropert NoIndex = md.NoIndex, OGSiteName = _metaMomentumConfig.OGSiteName, TwitterName = _metaMomentumConfig.TwitterName, - FacebookAppId = _metaMomentumConfig.FacebookAppId + FacebookAppId = _metaMomentumConfig.FacebookAppId, + FallbackImageUrl = _metaMomentumConfig?.FallbackImageUrl }; return retVal; diff --git a/MetaMomentum/App_Plugins/MetaMomentum/editorView.controller.js b/MetaMomentum/App_Plugins/MetaMomentum/editorView.controller.js index 71473e6..7012bb0 100644 --- a/MetaMomentum/App_Plugins/MetaMomentum/editorView.controller.js +++ b/MetaMomentum/App_Plugins/MetaMomentum/editorView.controller.js @@ -1,6 +1,6 @@ angular.module("umbraco") .controller("DM.MetaMomentum", - function ($scope, $filter, editorState, contentEditingHelper, editorService, mediaHelper, entityResource, $interval) { + function ($scope, $filter, $http, editorState, contentEditingHelper, editorService, mediaHelper, entityResource, $interval) { var shareImgUpdateInterval; $scope.sharePreviewType = null; @@ -215,7 +215,6 @@ angular.module("umbraco") $scope.updateShareImage = function () { $scope.model.value.shareImage = null; - //check if there is one already set. if ($scope.model.value.share.imageUrl != null) { $scope.model.value.shareImageUrl = $scope.model.value.share.imageUrl; @@ -281,13 +280,24 @@ angular.module("umbraco") $scope.model.value.shareImage = null; //Share image is not rellevant, so reset to null; } - return $scope.model.value.shareImageUrl; + console.log($scope.model) + if ($scope.model.value.shareImageUrl != null) { + return $scope.model.value.shareImageUrl; + } } //break rootLoop; } } } } + + if (!$scope.siteFallbackImage) { + $http.get('/Umbraco/MetaMomentum/Settings/FallbackImage').then(function successCallback(response) { + $scope.siteFallbackImage = response.data; + }, function errorCallback(response) { + console.log(`Error getting site fallback image: ${response}`) + }); + } //If we got this far, then we havent found an image diff --git a/MetaMomentum/App_Plugins/MetaMomentum/editorView.html b/MetaMomentum/App_Plugins/MetaMomentum/editorView.html index 55b8440..e5ba9aa 100644 --- a/MetaMomentum/App_Plugins/MetaMomentum/editorView.html +++ b/MetaMomentum/App_Plugins/MetaMomentum/editorView.html @@ -93,6 +93,7 @@ {{(showEditSocial)? "Hide Preview" : "Edit Preview"}} + @@ -120,18 +121,21 @@ - + Edit -
+ Fallback Image Field + Site Fallback Image +
{{searchHost}} @@ -150,6 +154,8 @@ +
@@ -172,6 +178,8 @@ +
diff --git a/MetaMomentum/Views/Partials/MetaMomentum/RenderMetaTags.cshtml b/MetaMomentum/Views/Partials/MetaMomentum/RenderMetaTags.cshtml index cedcda3..8c07ca1 100644 --- a/MetaMomentum/Views/Partials/MetaMomentum/RenderMetaTags.cshtml +++ b/MetaMomentum/Views/Partials/MetaMomentum/RenderMetaTags.cshtml @@ -28,9 +28,18 @@ @*Twitter Card ratio is 2:1 https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/summary-card-with-large-image *@ @**@ - - + +} +else if (!string.IsNullOrEmpty(Model.FallbackImageUrl)) +{ + @* Meta(FB) require images at least 1200x630 https://developers.facebook.com/docs/sharing/webmasters/images/ *@ + + + + @*Twitter Card ratio is 2:1 https://developer.twitter.com/en/docs/twitter-for-websites/cards/overview/summary-card-with-large-image *@ + @**@ + } @if (Model.NoIndex)