From a87df9df2111173fe7e66e8a85ed88b72e2be9d5 Mon Sep 17 00:00:00 2001
From: Sabrina <sf@matterlabs.dev>
Date: Mon, 10 Jun 2024 17:23:07 -0400
Subject: [PATCH] fix: update og-image description for pages (#117)

# Description

The ogImage was set on `app.vue` which overrides all other ogImage
configurations on child pages.
- Removed ogImage config in app.vue and set it up on /content/index.vue
---
 app.vue         | 8 +-------
 pages/index.vue | 8 ++++++++
 2 files changed, 9 insertions(+), 7 deletions(-)

diff --git a/app.vue b/app.vue
index c9edc8f7..b2ab9e71 100644
--- a/app.vue
+++ b/app.vue
@@ -22,7 +22,7 @@ useHead({
 useSeoMeta({
   titleTemplate: `%s - ${seo?.siteName}`,
   ogSiteName: seo?.siteName,
-  ogUrl: 'https://docs.zksync.io/',
+  ogUrl: 'https://docs.zksync.io',
   ogImageAlt: 'Hyperscaling Ethereum with ZK tech.',
   ogDescription:
     'zkSync Docs bring you all information you need about our protocol, APIs, SDKs, ZK Stack, and ZK chains. Start with our guides and tutorials, or go deep into our architecture and protocol specification.',
@@ -36,12 +36,6 @@ useSeoMeta({
   twitterCreator: '@zkSyncDevs',
   twitterImageAlt: 'Hyperscaling Ethereum with ZK tech.',
 });
-
-defineOgImage({
-  component: 'OgImageZK',
-  title: seo?.siteName,
-  description: 'Access detailed guides, references and resources that will help you build with zkSync Era.',
-});
 </script>
 
 <template>
diff --git a/pages/index.vue b/pages/index.vue
index 0b527955..6965f721 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -1,6 +1,8 @@
 <script setup lang="ts">
 const { data: page } = await useAsyncData('index', () => queryContent('/').findOne());
 
+const { seo } = useAppConfig();
+
 useSeoMeta({
   titleTemplate: '',
   title: page.value?.title,
@@ -8,6 +10,12 @@ useSeoMeta({
   description: page.value?.description,
   ogDescription: page.value?.description,
 });
+
+defineOgImage({
+  component: 'OgImageZK',
+  title: seo?.siteName,
+  description: 'Access detailed guides, references and resources that will help you build with zkSync Era.',
+});
 </script>
 
 <template>