Eleventy plugin that retrieves analytics from Plausible when building your site.

• Installation
• About
• Usage
• Configuration
  • Plugin options
• Troubleshooting
• Dependencies
• License

npm install @jackdbd/eleventy-plugin-plausible

Note: this library was tested on Node.js >=18. It might work on other Node.js versions though.

This plugin retrieves analytics data from the Plausible API, caches it, then makes it available using an Eleventy global data key of your choice.

Configure this plugin with your Plausible API key and site ID, and then the options for analytics and caching.

import { plausiblePlugin } from '@jackdbd/eleventy-plugin-plausible'

export default function (eleventyConfig) {
  // some eleventy configuration...

  eleventyConfig.addPlugin(plausiblePlugin, {
    apiKey: 'YOUR-API-KEY',
    siteId: 'YOUR-SITE-ID',
    cacheDuration: '30m',
    cacheVerbose: true,
    statsBreakdownPeriod: '7d'
  })

  // some more eleventy configuration...
}

Then use it in your Eleventy config...

eleventyConfig.on('eleventy.after', async () => {
  const breakdown = await eleventyConfig.globalData.plausibleStatsBreakdown()
  console.log('stats breakdown from Plausible', breakdown)
})

...or in your templates (here is an example with nunjucks):

<p>Breakdown from Plausible analytics.</p>
<ul>
{%- for item in plausibleStatsBreakdown -%}
  <li>
    <a href="{{ item.page | url }}">
      {% if item.page %}
        <span>{{ item.page | slugify }}</span> <span>({{ item.visitors }} visitors)</span>
      {% else %}
        Untitled page
      {% endif %}
    </a>
  </li>
{%- endfor -%}
</ul>

This plugin uses the debug library for logging. You can control what's logged using the DEBUG environment variable.

For example, if you set your environment variables in a .envrc file, you can do:

# print all logging statements
export DEBUG=11ty-plugin:*

⚠️ Peer Dependencies

This package defines 2 peer dependencies.

© 2022 - 2024 Giacomo Debidda // MIT License