> ## Documentation Index
> Fetch the complete documentation index at: https://docs.onsleek.ai/llms.txt
> Use this file to discover all available pages before exploring further.

# Page classification

> Specific integration instructions to enable page classification.

Sleek’s Web Extension SDK automatically classifies the pages your users are visiting. To
setup this experience for your users, you'll need to provide Sleek with the
pages that you want to classify. This documentation will guide you through the integration process.

<Warning>
  This document assumes that you have already integrated the Sleek web extension SDK into your
  extension. If you haven't, please refer to the [Web Extension SDK integration
  guide](/web-ext-sdk-reference/introduction).
</Warning>

## Enable page classification

After Sleek Web Extension is installed and setup in your extension, you are ready to enable
page classification.

### Automatically classify pages

To automatically classify pages, set `featureControls.emitPageClassification` to
`true` in the web extension SDK's options during initialization.

```javascript theme={null}
import { initializeWebExtSdk } from "@sleek/web-ext-sdk";

// In your background script constructor or setup.
initializeWebExtSdk(process.env.YOUR_SLEEK_CLIENT_API_KEY_HERE, {
  // Your options here.
  featureControls: {
    emitPageClassification: true,
  },
});
```

Now that you have enabled page classification, Sleek will automatically classify
the pages your users are visiting. You can subscribe to the `PAGE_CLASSIFIED`
event to be notified when a page has been classified.

**Register for page classification events**

Sleek's web extension SDK automatically emits events when pages are classified. Subscribe to
the `PAGE_CLASSIFIED` event to be notified when a page has been classified.

For example, you might want to show different UI based on what type of page the
user is viewing. To do so, you can follow a pattern like:

```typescript theme={null}
import { getWebExtSdk } from "@sleek/web-ext-sdk";
import { SdkEventType } from "@sleek/sdk";

getWebExtSdk().registerEventListener((event, { tabId }) => {
  // `event` is typed, so is the data of the event `event.data` based on the type of the event.
  switch (event.type) {
    case SdkEventType.PAGE_CLASSIFIED:
      // Do something with the page classification.
      console.log(event.data.classification);
      if (event.data.classification === "product") {
        // Show product detail page UI.
      } else if (event.data.classification === "cart") {
        // Show cart page UI.
      }
      break;
  }
});
```

### Manually classify pages

In addition to automatic emission of page class, you can manually classify a
page by calling the `classifyPage` method.

```javascript theme={null}
import { getWebExtSdk } from "@sleek/web-ext-sdk";

getWebExtSdk().onTab(tabId).classifyPage(); // Returns Promise<PageClassification>.
```

## Available page classifications

The web extension SDK can classify pages into the following categories:

* `cart` - A shopping cart page
* `checkout` - A checkout page
* `checkoutComplete` - A completed checkout page
* `collection` - A category/collection page listing products
* `customersAccount` - A customer account page
* `customersAuthentication` - A login or registration page
* `customersOrders` - A customer orders history page
* `home` - A website's homepage
* `product` - A product detail page
* `search` - A search results page
* `other` - An e-commerce page that doesn't fit other categories
* `nonShopping` - A page that is not shopping related

**What's next:**

Now that you have enabled page classification in your extension, you can check out the TypeDoc for specific event types and methods on the web extension SDK.

<Card title="View TypeDoc" icon="terminal" href="/web-ext-sdk-reference/type-doc">
  Browse the reference TypeDoc for the web extension SDK.
</Card>