diff --git a/app.config.ts b/app.config.ts index 48559769..548d4693 100644 --- a/app.config.ts +++ b/app.config.ts @@ -5,6 +5,11 @@ export default defineAppConfig({ description: 'Beautifully designed Nuxt Content template built with shadcn-vue. Customizable. Compatible. Open Source.', ogImage: '/hero.png', ogImageComponent: 'ShadcnDocs', + umami: { + enable: true, + src: 'https://cloud.umami.is/script.js', + dataWebsiteId: 'd793fbf3-461e-4e26-9ec9-4e9141df96ee', + }, }, theme: { customizable: true, diff --git a/composables/useConfig.ts b/composables/useConfig.ts index ea5a0fa6..8ee6c456 100644 --- a/composables/useConfig.ts +++ b/composables/useConfig.ts @@ -6,6 +6,11 @@ const defaultConfig: DefaultConfig = { description: 'Beautifully designed Nuxt Content template built with shadcn-vue. Customizable. Compatible. Open Source.', ogImage: '/hero.png', ogImageComponent: 'ShadcnDocs', + umami: { + enable: false, + src: 'https://cloud.umami.is/script.js', + dataWebsiteId: '', + }, }, theme: { customizable: true, diff --git a/content/3.api/1.configuration/1.shadcn-docs.md b/content/3.api/1.configuration/1.shadcn-docs.md index 2a0059c0..9f7ac682 100644 --- a/content/3.api/1.configuration/1.shadcn-docs.md +++ b/content/3.api/1.configuration/1.shadcn-docs.md @@ -64,6 +64,21 @@ All configurable icons can be set to iconify icons, emojis and urls, using [smar ::field{name="ogImageComponent" type="string" default-value="ShadcnDocs"} The component to use for the dynamic ogImage. Possible values: `ShadcnDocs`, `Nuxt`, `NuxtSeo` or your custom component name. :: + ::field{name="umami" type="object"} + ::collapsible{title="Details"} + ::field-group + ::field{name="enable" type="boolean" default-value="false"} + Whether to turn on the umami integration. + :: + ::field{name="src" type="string" default-value="https://cloud.umami.is/script.js"} + The link src in the tracking code. + :: + ::field{name="dataWebsiteId" type="string"} + The _Website ID_ from umami dashboard. + :: + :: + :: + :: :: ## `theme` diff --git a/content/3.api/1.configuration/5.edit-link.md b/content/3.api/1.configuration/4.edit-link.md similarity index 100% rename from content/3.api/1.configuration/5.edit-link.md rename to content/3.api/1.configuration/4.edit-link.md diff --git a/content/3.api/1.configuration/4.carbon-ads.md b/content/3.api/1.configuration/5.carbon-ads.md similarity index 100% rename from content/3.api/1.configuration/4.carbon-ads.md rename to content/3.api/1.configuration/5.carbon-ads.md diff --git a/content/3.api/1.configuration/6.umami.md b/content/3.api/1.configuration/6.umami.md new file mode 100644 index 00000000..d8d853fd --- /dev/null +++ b/content/3.api/1.configuration/6.umami.md @@ -0,0 +1,41 @@ +--- +title: Umami +icon: lucide:cloud +description: Integration for Umami analytics. +--- + +**shadcn-docs-nuxt** has built-in support for [Umami Analytics](https://umami.is/). Add your Umami `data-website-id` to `app.config.ts`. + +```ts [app.config.ts] +export default defineAppConfig({ + shadcnDocs: { + site: { + umami: { + enable: true, + src: 'https://cloud.umami.is/script.js', + dataWebsiteId: 'your-data-website-id', + }, + }, + }, +}); +``` + +These values are used to add the Umami script to `
`{lang="html"} as shown below. + +```html + +``` + +## Parameters + +::field-group + ::field{name="enable" type="boolean" default-value="false"} + Whether to turn on the umami integration. + :: + ::field{name="src" type="string" default-value="https://cloud.umami.is/script.js"} + The link src in the tracking code. + :: + ::field{name="dataWebsiteId" type="string"} + The _Website ID_ from umami dashboard. + :: +:: diff --git a/plugins/analytics.client.ts b/plugins/analytics.client.ts deleted file mode 100644 index bcca7d42..00000000 --- a/plugins/analytics.client.ts +++ /dev/null @@ -1,10 +0,0 @@ -export default defineNuxtPlugin(() => { - useHead({ - script: [ - { - 'src': 'https://cloud.umami.is/script.js', - 'data-website-id': 'd793fbf3-461e-4e26-9ec9-4e9141df96ee', - }, - ], - }); -}); diff --git a/plugins/umami.client.ts b/plugins/umami.client.ts new file mode 100644 index 00000000..6cf7a66c --- /dev/null +++ b/plugins/umami.client.ts @@ -0,0 +1,15 @@ +export default defineNuxtPlugin(() => { + const { enable, dataWebsiteId, src } = useConfig().value.site.umami; + + if (enable && !import.meta.dev) { + useHead({ + script: [ + { + src, + 'defer': true, + 'data-website-id': dataWebsiteId, + }, + ], + }); + } +}); diff --git a/types/index.d.ts b/types/index.d.ts index ce46b758..0bd1d93b 100644 --- a/types/index.d.ts +++ b/types/index.d.ts @@ -4,6 +4,11 @@ interface DefaultConfig { description: string; ogImage: string; ogImageComponent: string; + umami: { + enable: boolean; + src: string; + dataWebsiteId: string; + }; }; theme: { customizable: boolean;