Skip to content

Create an about page

The about page is a common page that provides information about your ministry or community. This chapter guides you through creating an about page, but the same approach also works for any text-based page.

  1. Create Files: Start by creating a markdown file for each locale. For example, if your site supports English and German, you would create the following files:

    • Directorysrc
      • Directorypages
        • Directoryen
          • about.md
        • Directoryde
          • about.md
  2. Add file content: Use Markdown syntax to write your content. The content of the /en/about.md file could look like this:

    src/pages/en/about.md
    ---
    layout: "lightnet/layouts/MarkdownPage.astro"
    ---
    # About
    Some text about your ministry or community.
    ![Community Picture](../../assets/my-community-picture.jpg)

    Set the layout to lightnet/layouts/MarkdownPage.astro. This makes sure your page includes the header and looks good on all screen sizes. You can also create your own layout if you want to customize the look of the page. Astro takes care of optimizing your images that are referenced in the markdown file.

  3. Add About to the main menu: Add the following code to the astro.config.mjs file:

    astro.config.mjs
    export default defineConfig({
    integrations: [
    lightnet({
    mainMenu: [
    {
    href: "/about",
    label: {
    en: "About",
    },
    },
    ],
    }),
    ],
    });
  4. Translate the menu label directly in config: For each site language, add the translated label to the locale map used in the previous step. For example:

    astro.config.mjs
    label: {
    en: "About",
    de: "Über uns",
    }