Composables
useCraftCurrentSite
Learn how to use the useCraftCurrentSite composable.
This composable offers an easy way to retrieve the current site based on the siteMap defined in nuxt.config.ts. It facilitates multisite support and simplifies querying data from your Craft CMS backend.
Usage
const currentSite = useCraftCurrentSite();
By default it returns the current site based on the path defined in the siteMap property in your nuxt.config.ts. You can change this behavior by changing the
siteDetectionMode to origin. You can read more about that in the install docs.
siteDetectionMode: path
// Url: http://localhost:3000/de/happy-trying
//
// Nuxt Config:
// craftcms: {
// baseUrl: 'https://cms.ddev.site',
// authToken: 'xxxx',
// siteDetectionMode: 'path',
// siteMap: [
// {
// handle: 'en',
// origin: 'http://localhost:3000',
// path: '/',
// },
// {
// handle: 'de',
// origin: 'http://localhost:3000',
// path: '/de',
// }
// ],
// },
const currentSite = useCraftCurrentSite();
// currentSite.value will be:
// {
// handle: 'de',
// origin: 'http://localhost:3000',
// path: '/de',
// }
siteDetectionMode: origin
// Url: https://en-site.ddev.site/happy-trying
//
// Nuxt Config:
// craftcms: {
// baseUrl: 'https://cms.ddev.site',
// authToken: 'xxxx',
// siteDetectionMode: 'origin',
// siteMap: [
// {
// handle: 'en',
// origin: 'https://en-site.ddev.site',
// path: '/',
// },
// {
// handle: 'en',
// origin: 'https://de-site.ddev.site',
// path: '/',
// }
// ],
// },
const currentSite = useCraftCurrentSite();
// currentSite.value will be:
// {
// handle: 'en',
// origin: 'https://en-site.ddev.site',
// path: '/',
// }
Note
To use this composable, you have to define your sites in the siteMap property in the nuxt.config.ts.
No site found
If no current site is available, it will return the first site defined in the siteMap Array.
Type
function useCraftCurrentSite(): CompoutedRef<CraftSite>;
type CraftSite = {
handle: string;
origin: string;
path: string;
id?: number;
label?: string;
lang?: string;
primary?: boolean;
};