# Flutter web analytics installation - Docs

1.  1

    ## Install the package

    Required

    Add the PostHog Flutter SDK to your `pubspec.yaml`:

    pubspec.yaml

    PostHog AI

    ```yaml
    posthog_flutter: ^5.0.0
    ```

2.  2

    ## Platform setup

    Required

    ## Tab

    Add these values to your `AndroidManifest.xml`:

    android/app/src/main/AndroidManifest.xml

    PostHog AI

    ```xml
    <application>
      <activity>
        [...]
      </activity>
      <meta-data android:name="com.posthog.posthog.API_KEY" android:value="<ph_project_token>" />
      <meta-data android:name="com.posthog.posthog.POSTHOG_HOST" android:value="https://us.i.posthog.com" />
      <meta-data android:name="com.posthog.posthog.TRACK_APPLICATION_LIFECYCLE_EVENTS" android:value="true" />
      <meta-data android:name="com.posthog.posthog.DEBUG" android:value="true" />
    </application>
    ```

    Update the minimum Android SDK version to **21** in `android/app/build.gradle`:

    android/app/build.gradle

    PostHog AI

    ```groovy
    defaultConfig {
      minSdkVersion 21
      // rest of your config
    }
    ```

    ## Tab

    Add these values to your `Info.plist`:

    ios/Runner/Info.plist

    PostHog AI

    ```xml
    <dict>
      [...]
      <key>com.posthog.posthog.API_KEY</key>
      <string><ph_project_token></string>
      <key>com.posthog.posthog.POSTHOG_HOST</key>
      <string>https://us.i.posthog.com</string>
      <key>com.posthog.posthog.CAPTURE_APPLICATION_LIFECYCLE_EVENTS</key>
      <true/>
      <key>com.posthog.posthog.DEBUG</key>
      <true/>
    </dict>
    ```

    Update the minimum platform version to iOS 13.0 in your `Podfile`:

    Podfile

    PostHog AI

    ```ruby
    platform :ios, '13.0'
    # rest of your config
    ```

    ## Tab

    Add these values in `index.html`:

    web/index.html

    PostHog AI

    ```html
    <!DOCTYPE html>
    <html>
      <head>
        ...
        <script>
          !function(t,e){var o,n,p,r;e.__SV||(window.posthog=e,e._i=[],e.init=function(i,s,a){function g(t,e){var o=e.split(".");2==o.length&&(t=t[o[0]],e=o[1]),t[e]=function(){t.push([e].concat(Array.prototype.slice.call(arguments,0)))}}(p=t.createElement("script")).type="text/javascript",p.async=!0,p.src=s.api_host.replace(".i.posthog.com","-assets.i.posthog.com")+"/static/array.js",(r=t.getElementsByTagName("script")[0]).parentNode.insertBefore(p,r);var u=e;for(void 0!==a?u=e[a]=[]:a="posthog",u.people=u.people||[],u.toString=function(t){var e="posthog";return"posthog"!==a&&(e+="."+a),t||(e+=" (stub)"),e},u.people.toString=function(){return u.toString(1)+".people (stub)"},o="init capture register register_once register_for_session unregister opt_out_capturing has_opted_out_capturing opt_in_capturing reset isFeatureEnabled getFeatureFlag getFeatureFlagPayload reloadFeatureFlags group identify setPersonProperties setPersonPropertiesForFlags resetPersonPropertiesForFlags setGroupPropertiesForFlags resetGroupPropertiesForFlags resetGroups onFeatureFlags addFeatureFlagsHandler onSessionId getSurveys getActiveMatchingSurveys renderSurvey canRenderSurvey getNextSurveyStep".split(" "),n=0;n<o.length;n++)g(u,o[n]);e._i.push([i,s,a])},e.__SV=1)}(document,window.posthog||[]);
          posthog.init('<ph_project_token>', {
              api_host: 'https://us.i.posthog.com',
              defaults: '2026-01-30',
          })
        </script>
      </head>
      <body>
        ...
      </body>
    </html>
    ```

3.  3

    ## Track screen views

    Recommended

    Despite the name, the web analytics dashboard can be used to track screen views in mobile apps, too. Open your app and view some screens to generate some events.

    To automatically capture screen views, you can use the `PostHogObserver` with your navigation:

    Dart

    PostHog AI

    ```dart
    import 'package:posthog_flutter/posthog_flutter.dart';
    MaterialApp(
        navigatorObservers: [
            PosthogObserver(),
        ],
        // rest of your app
    )
    ```

4.  4

    ## Next steps

    Recommended

    After installing PostHog and ensuring [autocapture](/docs/data/autocapture.md) is enabled, head to your [web analytics dashboard](/docs/web-analytics/dashboard.md) to see your data. And then check out our [getting started](/docs/web-analytics/getting-started.md) guide.

    > **PostHog tip:** Web analytics works with [anonymous events](/docs/data/anonymous-vs-identified-events.md). This means if you are primarily using PostHog for web analytics, it can be significantly cheaper for you.

### Community questions

Ask a question

### Was this page useful?

HelpfulCould be better