fix: og:image

gatsby-config.js

@@ -8,7 +8,9 @@ module.exports = {
     title: `Voice Your Stance`,
     description: `The easiest way to find and contact your representatives about the issues that you care about.`,
     author: `@kalm42`,
-    image: `src/images/social-card.png`,
+    url: `https://voiceyourstance.com`,
+    twitterUsername: `@VoiceYourStance`,
+    image: `/social-card.png`,
   },
   plugins: [
     `gatsby-plugin-react-helmet`,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "voiceyourstance.com",
-  "version": "2.1.1",
+  "version": "2.1.2",
   "author": "Kyle Melton <me@kylemelton.dev>",
   "private": true,
   "dependencies": {

src/components/SEO.tsx

@@ -9,6 +9,7 @@ import React from "react"
 import PropTypes from "prop-types"
 import { Helmet } from "react-helmet"
 import { useStaticQuery, graphql } from "gatsby"
+import { useLocation } from "@reach/router"
 
 interface Props {
   description?: string
@@ -19,6 +20,7 @@ interface Props {
 }
 
 function SEO(props: Props) {
+  const { pathname } = useLocation()
   const {
     description = "The easiest way to find and contact your elected representatives.",
     lang = "en",
@@ -34,6 +36,8 @@ function SEO(props: Props) {
             title
             description
             author
+            url
+            twitterUsername
             image
           }
         }
@@ -48,9 +52,13 @@ function SEO(props: Props) {
       name: `description`,
       content: metaDescription,
     },
+    {
+      property: `og:url`,
+      content: `${site.siteMetadata.url}${pathname}`,
+    },
     {
       property: `og:image`,
-      content: site.siteMetadata.image,
+      content: `${site.siteMetadata.url}${site.siteMetadata.image}`,
     },
     {
       property: `og:title`,
@@ -66,11 +74,11 @@ function SEO(props: Props) {
     },
     {
       name: `twitter:card`,
-      content: `summary`,
+      content: `summary_large_image`,
     },
     {
       name: `twitter:creator`,
-      content: site.siteMetadata.author,
+      content: site.siteMetadata.twitterUsername,
     },
     {
       name: `twitter:title`,