Vanilla JS
Content analytics for static sites, any framework, or no framework
The vanilla adapter is a tiny, framework-free entrypoint. Drop it into any HTML page, static site, or non-React framework.
CDN (no install)
<script type="module">
import { init, track } from 'https://esm.sh/@better-i18n/content/adapters/vanilla'
init({
projectId: 'your-org/your-project',
apiKey: 'bi_pub_xxxxx',
})
track('content.view', {
entryId: 'post-123',
contentModel: 'blog',
entrySlug: 'hello-world',
language: 'en',
})
</script>After init(), you can also call window.betterContent.track(...) from anywhere on the page.
npm (bundled)
npm install @better-i18n/contentbun add @better-i18n/contentpnpm add @better-i18n/contentyarn add @better-i18n/contentimport { init, track } from '@better-i18n/content/adapters/vanilla'
init({
projectId: process.env.BETTER_I18N_PROJECT_ID!,
apiKey: process.env.BETTER_I18N_KEY!,
})
// Call track() from anywhere
track('content.view', {
entryId: post.id,
language: 'en',
})Astro
In Astro, the adapter goes in a client-side <script>:
---
const { post } = Astro.props
---
<script define:vars={{ post }}>
import { init, track } from 'https://esm.sh/@better-i18n/content/adapters/vanilla'
init({
projectId: import.meta.env.PUBLIC_BETTER_I18N_PROJECT_ID,
apiKey: import.meta.env.PUBLIC_BETTER_I18N_KEY,
})
track('content.view', {
entryId: post.id,
contentModel: 'blog',
entrySlug: post.slug,
language: post.locale,
})
</script>