Merge pull request #15 from cpbitmap/addExplicitImageUrl

Add explicit imageUrl and add author to MetaTags
cpbitmap · Dec 2, 2023 · c58262c · c58262c
2 parents 44b53a1 + 078b554
commit c58262c
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 3 deletions.
diff --git a/components/MetaTags/index.tsx b/components/MetaTags/index.tsx
@@ -2,11 +2,20 @@ import React from "react";
 
 type MetaTagsProps = {
   siteUrl: string;
+  // It is safer to have a complete the image URL rather than a relative one
+  imageUrl: string;
   title: string;
   description: string;
+  author: string;
 };
 
-const MetaTags = ({ siteUrl, title, description }: MetaTagsProps) => (
+const MetaTags = ({
+  siteUrl,
+  imageUrl,
+  title,
+  description,
+  author,
+}: MetaTagsProps) => (
   <>
     {/* Social media card tags. Generated with https://metatags.io: */}
     <title>{title}</title>
@@ -18,14 +27,14 @@ const MetaTags = ({ siteUrl, title, description }: MetaTagsProps) => (
     <meta property="og:url" content={siteUrl} />
     <meta property="og:title" content={title} />
     <meta property="og:description" content={description} />
-    <meta property="og:image" content="cpbitmap-social-media-card.png" />
+    <meta property="og:image" content={imageUrl} />
 
     {/* Twitter: */}
     <meta property="twitter:card" content="summary_large_image" />
     <meta property="twitter:url" content={siteUrl} />
     <meta property="twitter:title" content={title} />
     <meta property="twitter:description" content={description} />
-    <meta property="twitter:image" content="cpbitmap-social-media-card.png" />
+    <meta property="twitter:image" content={imageUrl} />
 
     {/* Favicon tags. Generated with https://realfavicongenerator.net: */}
     <link
@@ -53,6 +62,9 @@ const MetaTags = ({ siteUrl, title, description }: MetaTagsProps) => (
     />
     <meta name="msapplication-TileColor" content="#2b5797" />
     <meta name="theme-color" content="#ffffff" />
+
+    {/* Other: */}
+    <meta name="author" content={author}></meta>
   </>
 );
 

diff --git a/pages/_document.tsx b/pages/_document.tsx
@@ -48,8 +48,10 @@ class MyDocument extends Document {
           {/* This is the default <head> for all pages across the website. */}
           <MetaTags
             siteUrl="https://cpbitmap.github.io/"
+            imageUrl="https://cpbitmap.github.io/cpbitmap-social-media-card.png"
             title="CPBitmap Converter"
             description="A free online cpbitmap conversion tool. Convert cpbitmap files to PNG, JPEG, or TIFF."
+            author="Ainsley Rutterford"
           />
         </Head>
         <body>