Pages

Il y a quelques éléments sur chaque page. Ceux ci incluent la mise en page, le contenu et les options de langue.

La mise en page est le HTML qui entoure le contenu. Elle comprend l'en tête, le pied de page et tout autre élément qui est cohérent sur toutes les pages. Cette mise en page est définie dans une autre page comme une fonction TypeScript.

Le contenu est le HTML qui est unique à chaque page. Nous le définissons comme indiqué ci dessous. Assurez vous d'inclure des appels à i18Next.t comme il se doit pour prendre en charge les traductions.

Les options de langue sont les différentes langues dans lesquelles la page est disponible. Nous les définissons au début. Cela connecte la route et la fonction de page individuelle ensemble. La traduction des URL est gérée à l'intérieur de cela.

TypeScript - pages/ExamplePage.ts

import i18next from "../GlobalSitesCore/i18n";
import { Layout } from "../Layout";
import { RenderProps, renderLanguageFiles } from "../GlobalSitesCore/languages";
import { FileResult } from "../GlobalSitesCore/FileResult";

export async function ExamplePagePages(): Promise<FileResult[]> {
  return renderLanguageFiles({
    subDirectoryInEnglish: undefined,
    fileNameInEnglish: "example-page",
    includeInSitemap: true,
    render: (props) => ExamplePage(props),
  });
}

interface ExamplePageProps extends RenderProps {}

export function ExamplePage(props: ExamplePageProps): string {
  var title = i18next.t(`Example Page`);
  var metaDescription = i18next.t(`This is an example page.`);

  return Layout({
    lang: props.option.code,
    title: title,
    description: metaDescription,
    languageOptions: props.allOptions,
    content: /* HTML */ `
      <h1>${title}</h1>
      <p>${metaDescription}</p>
      <!-- Add more content as needed -->
    `,
  });
}