diff --git a/website/app/services/head-data.js b/website/app/services/head-data.js
index f450f047707..11acb5f98bb 100644
--- a/website/app/services/head-data.js
+++ b/website/app/services/head-data.js
@@ -18,8 +18,9 @@ export default class CustomHeadDataService extends HeadDataService {
   }
 
   get imgSrc() {
-    return this.currentRouteMeta?.frontmatter?.previewImage
+    const previewImage = this.currentRouteMeta?.frontmatter?.previewImage
       ? this.currentRouteMeta.frontmatter.previewImage
-      : config['ember-meta'].imgSrc;
+      : 'assets/logos/share-card.jpg';
+    return `${config['ember-meta'].url}/${previewImage}`;
   }
 }
diff --git a/website/app/templates/head.hbs b/website/app/templates/head.hbs
index 9f006a11835..c883fad92bf 100644
--- a/website/app/templates/head.hbs
+++ b/website/app/templates/head.hbs
@@ -38,16 +38,22 @@ We've made some small customizations to simplify this compared to the default te
   <meta property="og:description" content={{this.model.description}} />
 {{/if}}
 
-<meta property="og:image" content="https://helios.hashicorp.design/assets/logos/share-card.jpg" />
+{{#if this.model.imgSrc}}
+  <meta property="og:image" content={{this.model.imgSrc}} />
+{{/if}}
 
 {{! END OPENGRAPH }}
 
 {{! BEGIN TWITTER }}
 
 <meta name="twitter:card" content="summary_large_image" />
+
 {{! template-lint-disable no-forbidden-elements no-potential-path-strings }}
 <meta name="twitter:site" content="@HashiCorp" />
-<meta name="twitter:image" content="https://helios.hashicorp.design/assets/logos/share-card.jpg" />
+
+{{#if this.model.imgSrc}}
+  <meta name="twitter:image" content={{this.model.imgSrc}} />
+{{/if}}
 
 {{#if this.model.title}}
   <meta name="twitter:title" content={{this.model.title}} />