diff --git a/src/components/custom/_dhero-2.js b/src/components/custom/_dhero-2.js
index 3903e09e9cd..49c1f5077ee 100644
--- a/src/components/custom/_dhero-2.js
+++ b/src/components/custom/_dhero-2.js
@@ -197,10 +197,10 @@ const query = graphql`
             ...fadeIn
         }
         deriv_x: file(relativePath: { eq: "deriv-x/hero-laptop.png" }) {
-            ...heroImage
+            ...bannerImage
         }
         deriv_x_mobile: file(relativePath: { eq: "deriv-x/hero-laptop-mobile.png" }) {
-            ...heroImage
+            ...bannerImage
         }
     }
 `
diff --git a/src/components/graphql/fragments.js b/src/components/graphql/fragments.js
index e8fc3c31b65..e3993f1dc97 100644
--- a/src/components/graphql/fragments.js
+++ b/src/components/graphql/fragments.js
@@ -12,6 +12,14 @@ export const heroImage = graphql`
     }
 `
 
+export const bannerImage = graphql`
+    fragment bannerImage on File {
+        childImageSharp {
+            gatsbyImageData(formats: [AUTO, AVIF, WEBP], layout: CONSTRAINED, placeholder: NONE)
+        }
+    }
+`
+
 export const fadeIn = graphql`
     fragment fadeIn on File {
         childImageSharp {
diff --git a/src/pages/landing/ebooks/forex.js b/src/pages/landing/ebooks/forex.js
index 1da45cce695..0ceeb914e05 100644
--- a/src/pages/landing/ebooks/forex.js
+++ b/src/pages/landing/ebooks/forex.js
@@ -31,10 +31,10 @@ const topicsCovered = [
 const query = graphql`
     query {
         forex_ebook_img: file(relativePath: { eq: "ebooks/forex-ebook.png" }) {
-            ...heroImage
+            ...bannerImage
         }
         forex_ebook_inside: file(relativePath: { eq: "ebooks/forex-ebook-inside.png" }) {
-            ...heroImage
+            ...bannerImage
         }
     }
 `
diff --git a/src/pages/landing/ebooks/stocks.js b/src/pages/landing/ebooks/stocks.js
index 243608d728e..0d6c8eb1abf 100644
--- a/src/pages/landing/ebooks/stocks.js
+++ b/src/pages/landing/ebooks/stocks.js
@@ -19,10 +19,10 @@ const topicsCovered = [
 const query = graphql`
     query {
         stocks_ebook_img: file(relativePath: { eq: "ebooks/stocks-ebook.png" }) {
-            ...heroImage
+            ...bannerImage
         }
         stocks_ebook_inside: file(relativePath: { eq: "ebooks/stocks-ebook-inside.png" }) {
-            ...fadeIn
+            ...bannerImage
         }
     }
 `