diff --git a/app/[locale]/[slug]/opengraph-image.tsx b/app/[locale]/[slug]/opengraph-image.tsx
index 2fe4d8f98..ac7d5580c 100644
--- a/app/[locale]/[slug]/opengraph-image.tsx
+++ b/app/[locale]/[slug]/opengraph-image.tsx
@@ -1,7 +1,7 @@
import { ImageResponse } from 'next/og';
import { getPageBySlug } from '@/lib/pages';
import { OGImageTemplate } from '@/components/OGImageTemplate';
-import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper';
+import { getOgFonts, getOgBackground, getOgLogo, OG_IMAGE_SIZE } from '@/lib/og-helper';
export const size = OG_IMAGE_SIZE;
export const contentType = 'image/png';
@@ -20,12 +20,16 @@ export default async function Image({
}
const fonts = await getOgFonts();
+ const bg = getOgBackground();
+ const logo = getOgLogo();
return new ImageResponse(
,
{
...OG_IMAGE_SIZE,
diff --git a/app/[locale]/blog/[slug]/opengraph-image.tsx b/app/[locale]/blog/[slug]/opengraph-image.tsx
index b6d3c6707..c6f64de38 100644
--- a/app/[locale]/blog/[slug]/opengraph-image.tsx
+++ b/app/[locale]/blog/[slug]/opengraph-image.tsx
@@ -1,7 +1,7 @@
import { ImageResponse } from 'next/og';
import { getPostBySlug } from '@/lib/blog';
import { OGImageTemplate } from '@/components/OGImageTemplate';
-import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper';
+import { getOgFonts, getOgBackground, getOgLogo, OG_IMAGE_SIZE } from '@/lib/og-helper';
import { SITE_URL } from '@/lib/schema';
export const size = OG_IMAGE_SIZE;
@@ -52,13 +52,16 @@ export default async function Image({
if (featuredImage) {
base64Image = await fetchImageAsBase64(featuredImage);
}
+ const bg = getOgBackground();
+ const logo = getOgLogo();
return new ImageResponse(
,
{
...OG_IMAGE_SIZE,
diff --git a/app/[locale]/blog/opengraph-image.tsx b/app/[locale]/blog/opengraph-image.tsx
index 3848a8858..4b13d6970 100644
--- a/app/[locale]/blog/opengraph-image.tsx
+++ b/app/[locale]/blog/opengraph-image.tsx
@@ -1,7 +1,7 @@
import { ImageResponse } from 'next/og';
import { getTranslations } from 'next-intl/server';
import { OGImageTemplate } from '@/components/OGImageTemplate';
-import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper';
+import { getOgFonts, getOgBackground, getOgLogo, OG_IMAGE_SIZE } from '@/lib/og-helper';
export const size = OG_IMAGE_SIZE;
export const contentType = 'image/png';
@@ -11,9 +11,17 @@ export default async function Image({ params }: { params: Promise<{ locale: stri
const { locale } = await params;
const t = await getTranslations({ locale, namespace: 'Blog.meta' });
const fonts = await getOgFonts();
+ const bg = getOgBackground();
+ const logo = getOgLogo();
return new ImageResponse(
- ,
+ ,
{
...OG_IMAGE_SIZE,
fonts,
diff --git a/app/[locale]/contact/opengraph-image.tsx b/app/[locale]/contact/opengraph-image.tsx
index bd909b59e..c05fa6d92 100644
--- a/app/[locale]/contact/opengraph-image.tsx
+++ b/app/[locale]/contact/opengraph-image.tsx
@@ -1,7 +1,7 @@
import { ImageResponse } from 'next/og';
import { getTranslations } from 'next-intl/server';
import { OGImageTemplate } from '@/components/OGImageTemplate';
-import { getOgFonts, OG_IMAGE_SIZE } from '@/lib/og-helper';
+import { getOgFonts, getOgBackground, getOgLogo, OG_IMAGE_SIZE } from '@/lib/og-helper';
export const size = OG_IMAGE_SIZE;
export const contentType = 'image/png';
@@ -11,12 +11,22 @@ export default async function Image({ params }: { params: Promise<{ locale: stri
const { locale } = await params;
const t = await getTranslations({ locale, namespace: 'Contact' });
const fonts = await getOgFonts();
+ const bg = getOgBackground();
+ const logo = getOgLogo();
- const title = t('meta.title') || t('title');
- const description = t('meta.description') || t('subtitle');
+ let title = t('meta.title') || t('title');
+ if (title.startsWith('E-TIB GmbH | ')) {
+ title = title.substring('E-TIB GmbH | '.length);
+ }
return new ImageResponse(
- ,
+ ,
{
...OG_IMAGE_SIZE,
fonts,
diff --git a/app/[locale]/opengraph-image.tsx b/app/[locale]/opengraph-image.tsx
index 790136f76..ae2d52168 100644
--- a/app/[locale]/opengraph-image.tsx
+++ b/app/[locale]/opengraph-image.tsx
@@ -11,13 +11,9 @@ export default async function Image({ params }: { params: Promise<{ locale: stri
const { locale } = await params;
const t = await getTranslations({ locale, namespace: 'Index.meta' });
- let title = t('title');
- if (title.startsWith('E-TIB GmbH | ')) {
- title = title.substring('E-TIB GmbH | '.length);
- }
- let description = t('description');
- if (description.length > 160) {
- description = description.substring(0, 160) + '...';
+ let pageTitle = t('title');
+ if (pageTitle.startsWith('E-TIB GmbH | ')) {
+ pageTitle = pageTitle.substring('E-TIB GmbH | '.length);
}
const fonts = await getOgFonts();
@@ -26,8 +22,8 @@ export default async function Image({ params }: { params: Promise<{ locale: stri
return new ImageResponse(
35 ? '64px' : '76px',
+ fontSize: '72px',
fontWeight: 700,
color: 'white',
lineHeight: '1.1',
maxWidth: '900px',
- marginBottom: '32px',
+ marginBottom: '24px',
display: 'flex',
letterSpacing: '-0.02em',
}}
@@ -137,11 +137,14 @@ export function OGImageTemplate({
{description && (