Documentation

Storefront Konfiguration

Feature Flags

Feature Flags werden über Umgebungsvariablen gesetzt und steuern optionale Funktionen der Storefront.

Variable	Typ	Standard	Beschreibung
`NUXT_PUBLIC_SHOP_BITE_FEATURE_MULTI_CHANNEL`	`boolean`	`false`	Aktiviert den Verkaufskanal-Wechsler im Header. Verwenden Sie dies, wenn Sie mehrere Standorte unter einer Storefront betreiben.
`NUXT_PUBLIC_SHOP_BITE_FEATURE_SECURE_KEY`	`string`	(leer)	Wenn gesetzt, wird die gesamte Storefront hinter diesem Schlüssel gesperrt. Besucher müssen einmalig `?secureKey=<Wert>` in der URL angeben; der Schlüssel wird dann für 30 Tage in einem Cookie gespeichert. Ohne gültigen Cookie werden alle Seiten auf `/maintenance` weitergeleitet. Leer lassen zum Deaktivieren.
`NUXT_PUBLIC_SHOP_BITE_FEATURE_CONTACT_FORM`	`boolean`	`false`	Aktiviert die `/kontakt`-Seite. Bei `false` gibt die Seite einen 404-Fehler zurück.
`NUXT_PUBLIC_SHOP_BITE_MENU_CATEGORY_ID`	`string`	`"main-navigation"`	Die Shopware-Kategorie-ID, die als Wurzel des Navigationsmenüs verwendet wird.

Beispiel .env:

NUXT_PUBLIC_SHOP_BITE_FEATURE_MULTI_CHANNEL=false
NUXT_PUBLIC_SHOP_BITE_FEATURE_SECURE_KEY=
NUXT_PUBLIC_SHOP_BITE_FEATURE_CONTACT_FORM=false
NUXT_PUBLIC_SHOP_BITE_MENU_CATEGORY_ID=main-navigation

Nuxt Config

Some examples how to configure the storefront. Checkout the Nuxt Config for more information.

export default defineNuxtConfig({
    app: {
        head: {
            title: "My Store",
            htmlAttrs: {
                lang: "de",
            },
            meta: [
                {charset: "utf-8"},
                {name: "viewport", content: "width=device-width, initial-scale=1"},
                {name: "description", content: "My Store description"},
                {property: "og:title", content: "My Store"},
                {property: "og:description", content: "My Store description",},
            ],
            link: [{rel: "icon", href: "/favicon.ico"}],
        },
    },
    runtimeConfig: {
        public: {
            site: {
                name: "My Store",
                description: "My Store description",
                countryId: "",
            },
        },
    },
    colorMode: {
        preference: "light",
    },
    pwa: {
        manifest: {
            name: "My Store",
            short_name: "mystore",
            theme_color: "#4d7c0f",
            icons: [
                {
                    src: "log192x192.png",
                    sizes: "192x192",
                    type: "image/png",
                    purpose: "any maskable",
                }
            ],
        },
    },
})