Page views are the first metric everyone looks at, but staring at raw event logs tells you nothing. PostHog automatically captures page view events, but you need to know how to visualize, filter, and break them down by page, user segment, or time period. We'll show you how to build a page view insight in under 5 minutes.

Enable Page View Tracking

PostHog's JavaScript SDK automatically captures page views, but you need to make sure it's initialized with the right settings.

Install and Initialize PostHog SDK

Add the PostHog SDK to your app. Install it via npm and initialize it at your app's entry point. Set capture_pageview: true and autocapture: true so PostHog automatically tracks $pageview events as users navigate between pages.

javascript

import posthog from 'posthog-js';

posthog.init('phc_your_api_key', {
  api_host: 'https://us.posthog.com',
  autocapture: true,
  capture_pageview: true
});

// Page views now captured automatically as users navigate

PostHog SDK initialization with automatic page view capture enabled

Verify Page Views in Live Events

Open your PostHog dashboard and go to Data Management > Live events. Navigate a page in your app (reload, click a link) and confirm you see $pageview events flowing in with properties like $pathname and $current_url populated.

javascript

// In PostHog UI, verify events:
// 1. Go to Data Management > Live events
// 2. Filter for event name = '$pageview'
// 3. Check that $pathname and $current_url are populated

// You can also manually capture if needed:
posthog.capture('$pageview', {
  $current_url: window.location.href,
  $pathname: window.location.pathname
});

Checking page view events flow in PostHog Live View

Watch out: If capture_pageview: true is missing from your config, automatic page views won't be captured. Check your initialization code first.

Create a Page Views Insight

Once events are flowing, create an Insight to visualize page view trends and behavior patterns.

Create a Trends Insight

Go to Insights > Create new insight and select Trends. Trends show event frequency over time, which is perfect for tracking page view volume. Set the event to $pageview and choose your date range (Last 7 days, Last 30 days, etc.).

javascript

// In PostHog UI:
// 1. Click Insights
// 2. Click Create new insight
// 3. Select Trends visualization
// 4. Set Event = '$pageview'
// 5. Choose date range (e.g., Last 30 days)
// 6. Click Save

const response = await fetch('https://us.posthog.com/api/projects/YOUR_PROJECT_ID/insights/', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer YOUR_API_KEY',
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    name: 'Page Views Trend',
    query: {
      kind: 'TrendsQuery',
      series: [{ event: '$pageview' }],
      dateRange: { date_from: '-30d' }
    }
  })
});

Creating a Trends insight for page views via UI or API

Break Down by Page

Add a breakdown to see page views per URL. Click Group by and select $pathname. This creates separate lines for each page, showing which pages drive the most traffic. Use $pathname instead of $current_url to ignore query parameters and group similar pages together.

javascript

// In the Trends insight:
// Event: $pageview
// Group by: $pathname

// Result: Each page path gets its own line showing traffic over time
// Example output:
// /blog/seo-guide: 1,240 page views
// /pricing: 890 page views
// /docs: 520 page views

// Avoid grouping by $current_url if you have query parameters:
// /page?utm_source=email generates a separate line from /page?utm_source=direct

Group by pathname to compare traffic across pages

Filter by User Segment (Optional)

To compare page views between segments, add filters. For example, create separate series to show page views for new vs. returning users. Click Add filter and select $is_returning_user = true for one series, then add another series with $is_returning_user = false.

javascript

// Compare page views by user segment:
// Series 1: Event = $pageview, Filter: $is_returning_user = true
// Series 2: Event = $pageview, Filter: $is_returning_user = false

// Alternative: filter by browser, country, or custom user properties
// Filter: browser = Chrome
// Filter: $geoip_country_code = US
// Filter: custom_property_name = value

Comparing page views across user segments

Tip: Use $pathname to group pages, not $current_url. Query parameters create separate lines for the same page, cluttering your chart.

Save to Dashboard and Share

Once you've built your insight, pin it to a dashboard for easy team access and real-time monitoring.

Save Insight to Dashboard

Click Save on your insight, give it a clear name (e.g., "Page Views by Section - Last 30 Days"), and select Add to dashboard. Choose an existing dashboard or create a new one for page view monitoring. Dashboards auto-refresh every 60 seconds.

javascript

// In PostHog UI:
// 1. Click Save (top right)
// 2. Enter name: 'Page Views by Section'
// 3. Check 'Add to dashboard'
// 4. Select dashboard or create new
// 5. Click Save

// Dashboards auto-refresh; no manual refresh needed
// Share dashboard link with team for real-time visibility

Saving an insight to a dashboard for team access

Export Data or Use the API

For automation or syncing to your data warehouse, use PostHog's REST API. Query the insights endpoint with your insight ID to get JSON results. Useful for building custom reports, alerts, or integrations with BI tools.

javascript

// Fetch insight results via PostHog API
const insightId = 'YOUR_INSIGHT_ID';
const response = await fetch(
  `https://us.posthog.com/api/projects/YOUR_PROJECT_ID/insights/${insightId}/`,
  {
    headers: {
      'Authorization': 'Bearer YOUR_PERSONAL_API_KEY'
    }
  }
);

const data = await response.json();
console.log(data.result); // Array of results with counts and dates

// Example result:
// [{ date: '2024-03-26', count: 1240 }, { date: '2024-03-25', count: 1180 }]

Fetching page view insight data via PostHog REST API for automation

Tip: Create a dedicated Monitoring Dashboard with multiple insights — page views, bounce rate, time on page, and top paths. This gives your team a complete picture of user engagement at a glance.

Common Pitfalls

Forgetting to set capture_pageview: true in SDK init — page views won't be captured automatically
Grouping by $current_url instead of $pathname — query parameters create duplicate lines instead of aggregating pages
Not filtering by segment — comparing total page views without breaking down by user type, traffic source, or device masks actionable patterns
Using different date ranges on different dashboards — insights on the same dashboard must share the same time filter or comparisons become meaningless

Wrapping Up

You now have page view data flowing into PostHog and can visualize traffic trends by page, user segment, and time period. PostHog's automatic $pageview capture removes the need for manual tracking. Share your dashboards with your team to keep everyone aligned on traffic patterns. If you want to track page views automatically across tools and sync insights to your data warehouse, Product Analyst can help.

How to Visualize Page Views in PostHog

Enable Page View Tracking

Install and Initialize PostHog SDK

Verify Page Views in Live Events

Create a Page Views Insight

Create a Trends Insight

Break Down by Page

Filter by User Segment (Optional)

Save to Dashboard and Share

Save Insight to Dashboard

Export Data or Use the API

Common Pitfalls

Wrapping Up