feat: add default and support-care social media templates (#359)

src/app/[locale]/layout.tsx

@@ -40,6 +40,7 @@ export async function generateMetadata({
     locale === 'de' ? 'Open Elements – Artikel' : 'Open Elements – Articles';
 
   return {
+    metadataBase: new URL('https://open-elements.com'),
     title: titles[locale as keyof typeof titles] || titles.en,
     description:
       descriptions[locale as keyof typeof descriptions] || descriptions.en,
@@ -75,6 +76,13 @@ export async function generateMetadata({
       ],
       locale: locale === 'de' ? 'de_DE' : 'en_US',
     },
+    twitter: {
+      card: 'summary_large_image',
+      title: titles[locale as keyof typeof titles] || titles.en,
+      description:
+        descriptions[locale as keyof typeof descriptions] || descriptions.en,
+      images: ['/open-graph/open-elements.png'],
+    },
   };
 }
 

src/app/[locale]/posts/layout.tsx

@@ -53,6 +53,13 @@ export async function generateMetadata({
       ],
       locale: locale === 'de' ? 'de_DE' : 'en_US',
     },
+    twitter: {
+      card: 'summary_large_image',
+      title: titles[locale as keyof typeof titles] || titles.en,
+      description:
+        descriptions[locale as keyof typeof descriptions] || descriptions.en,
+      images: ['/open-graph/open-elements.png'],
+    },
   };
 }
 

src/app/[locale]/support-care/layout.tsx

@@ -1,40 +1,69 @@
 import type { Metadata } from 'next';
 
-export const metadata: Metadata = {
-  title: 'Support & Care - Open Elements',
-  description:
-    'Support & Care is a program for the sustainable further development, stabilization and support of open source software (OSS).',
-  keywords: [
-    'Open Source',
-    'Support',
-    'Care',
-    'Java',
-    'Eclipse Temurin',
-    'Apache Maven',
-  ],
-  openGraph: {
-    type: 'website',
-    url: 'https://open-elements.com/support-care',
-    title: 'Support & Care - Open Elements',
+interface LayoutProps {
+  children: React.ReactNode;
+  params: Promise<{ locale: string }>;
+}
+
+export async function generateMetadata({
+  params,
+}: {
+  params: Promise<{ locale: string }>;
+}): Promise<Metadata> {
+  const { locale } = await params;
+
+  const titles = {
+    en: 'Support & Care - Open Elements',
+    de: 'Support & Care - Open Elements',
+  };
+
+  const descriptions = {
+    en: 'Support & Care is a program for the sustainable further development, stabilization and support of open source software (OSS).',
+    de: 'Support & Care ist ein Programm zur nachhaltigen Weiterentwicklung, Stabilisierung und Unterstützung von Open-Source-Software (OSS).',
+  };
+
+  return {
+    title: titles[locale as keyof typeof titles] || titles.en,
     description:
-      'Support & Care is a program for the sustainable further development, stabilization and support of open source software (OSS).',
-    siteName: 'Open Elements',
-    images: [
-      {
-        url: '/open-graph/open-elements.png',
-        width: 1200,
-        height: 630,
-        alt: 'OpenElements Logo',
-      },
+      descriptions[locale as keyof typeof descriptions] || descriptions.en,
+    keywords: [
+      'Open Source',
+      'Support',
+      'Care',
+      'Java',
+      'Eclipse Temurin',
+      'Apache Maven',
     ],
-    locale: 'en_US',
-  },
-};
+    openGraph: {
+      type: 'website',
+      url:
+        locale === 'de'
+          ? 'https://open-elements.com/de/support-care'
+          : 'https://open-elements.com/support-care',
+      title: titles[locale as keyof typeof titles] || titles.en,
+      description:
+        descriptions[locale as keyof typeof descriptions] || descriptions.en,
+      siteName: 'Open Elements',
+      images: [
+        {
+          url: '/open-graph/support-care.png',
+          width: 1200,
+          height: 630,
+          alt: 'Open Elements Support & Care',
+        },
+      ],
+      locale: locale === 'de' ? 'de_DE' : 'en_US',
+    },
+    twitter: {
+      card: 'summary_large_image',
+      title: titles[locale as keyof typeof titles] || titles.en,
+      description:
+        descriptions[locale as keyof typeof descriptions] || descriptions.en,
+      images: ['/open-graph/support-care.png'],
+    },
+  };
+}
 
-export default function SupportCareLayout({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
+export default async function SupportCareLayout({ children }: LayoutProps) {
   return <>{children}</>;
 }

src/app/layout.tsx

@@ -2,6 +2,7 @@ import type { Metadata } from 'next';
 import './globals.css';
 
 export const metadata: Metadata = {
+  metadataBase: new URL('https://open-elements.com'),
   title: 'Open Elements - Open Source made right',
   description:
     'Open Source made right - Open Elements is a modern company with a clear focus on Open Source and Java',
@@ -29,6 +30,13 @@ export const metadata: Metadata = {
     ],
     locale: 'en_US',
   },
+  twitter: {
+    card: 'summary_large_image',
+    title: 'Open Elements - Open Source made right',
+    description:
+      'Open Source made right - Open Elements is a modern company with a clear focus on Open Source and Java',
+    images: ['/open-graph/open-elements.png'],
+  },
 };
 
 export default function RootLayout({

src/components/Footer.tsx

@@ -5,6 +5,7 @@ import { Link } from '@/i18n/routing';
 import Image from 'next/image';
 import { useState } from 'react';
 import mainMenu from '@/data/mainMenu.json';
+import Script from 'next/script';
 
 interface FooterProps {
   locale: string;
@@ -173,7 +174,9 @@ export default function Footer({ locale }: FooterProps) {
         </div>
       </div>
 
-      <script
+      <Script
+        id="iubenda-loader"
+        strategy="afterInteractive"
         dangerouslySetInnerHTML={{
           __html: `
           (function (w,d) {