To celebrate Earth Day 2021, until the end of April we'll contribute 50% of your subscription for the planet.

How to use Panelbear with Nuxt.js

Once you have added your website to Panelbear, all that is left to do is integrate our analytics snippet.

It's a small piece of code that runs on your website, and it collects the metrics necessary to show you the insights in the dashboard.

Steps

Installing the analytics script on your Nuxt.js based website is super simple.

  1. Create a file called app.html in your project's root directory.
  2. Paste your Panelbear analytics snippet into the <head> section of the template.

For example:

<!DOCTYPE html>
<html {{ HTML_ATTRS }}>
    <head {{ HEAD_ATTRS }}>
        {{ HEAD }}
        
        Paste your Panelbear script here.
    
    </head>
    <body {{ BODY_ATTRS }}>
        {{ APP }}
    </body>
</html>

That's all you need to add analytics to your Nuxt.js project.

Check your installation

After you have added our analytics script to the HTML of your website, you should be able to see pageviews show up in the dashboard within a minute of the visitors coming into your website.

If you need help, you can reach out to us at [email protected].

Tip: Check out our local development guide for some tips and tricks when testing Panelbear on your machine.