Page Views

About

This component tracks and displays the number of visits to each page. It automatically increments and persists the view count across all visitors using a Supabase database. No need for additional APIs/subscriptions/set up. Just drag and drop and see it in effect.

This component a part of the 400+ components, layouts, templates, UI Kits and code overrides from SegmentUI PRO. Click here to see the full library

Instructions

1. Copy and paste the PageViews component code into your project file

2. Add the component where you want to display the view count

3. Customize the appearance through the properties panel:

   • Set the suffix text

   • Adjust the font settings

   • Change the text color

4. The counter will automatically start tracking views when published

   • Note: In preview mode, you'll see a placeholder "123"

   • The actual count appears only on the published site

How It Works

The component is pre-connected to a public Supabase database that tracks page views per URL automatically. You just need to copy and paste it on your page. The views are tracked based on the URL of your published site.

You can customize through property controls:

1. Suffix: Text that appears after the number (e.g., "views", "visitors")

2. Font: Complete typography control

3. Text Color: Color of the counter text

Note: The component uses a shared public Supabase instance with rate limiting and row-level security in place. While this isn't the most secure approach, it enables drag-and-drop functionality since we're only tracking basic interactions.

Support

For any queries and help setting up the component, contact hello@segmentui.com