> For the complete documentation index, see [llms.txt](https://docs.iheartjane.com/partner-success/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.iheartjane.com/partner-success/ecommerce-premium/jane-premium-onboarding-guide-vercel.md).

# Jane Premium Onboarding Guide Vercel

Welcome to your Premium onboarding checklist! This guide will walk you through each step you’ll take in order to seamlessly integrate Jane Premium on your existing e-commerce site.

Before beginning with Premium setup, please connect with your Partner Success Manager for a few initial steps.

This guide assumes you’ll be using our Vercel solution (looking for our standard guide? You can find it here 👉[Standard Premium Onboarding Guide](https://docs.iheartjane.com/partner-success/ecommerce-premium/jane-premium-onboarding-guide-cloudflare)

## Setting up the reverse proxy

Jane Premium requires a reverse proxy in front of your site to intercept requests for your menu page and redirect them to our servers. Luckily, using Vercel’s built in middleware functionality and our pre-built npm package, this is very simple to implement in just a few simple steps👇

### Create an environment variable to store your menu token

#### Copy your menu token

Your Partner Success Manager should have provided you access to our [business admin portal](https://business.iheartjane.com/premium) so that you can manage your Premium menu settings. Once you login, you should see a “Premium” tab at the top of the page. Once you navigate there, you should see your menu url and a token listed below it. Click the ***Copy token*** button so you can paste it in the next step.

<figure><img src="/files/hw6RiRPv3Wd91kC9Z86n" alt=""><figcaption></figcaption></figure>

#### Add the environment variable

Now that you have the token that connects your site to your specific menu configuration, navigate to the settings tab of your site in Vercel. You should see an Environment Variables option on the left side of the menu, open that and add a new variable with the key `JANE_MENU_PROXY_TOKEN`. Paste the previously copied menu token into the *Value* field and click save!

<figure><img src="/files/NIantPKLao9BZj7iQERj" alt=""><figcaption></figcaption></figure>

### Create a middleware / proxy file

In your Vercel site repository, add a file at the top level called `middleware.ts` (or `proxy.ts` if you’re using Next.js v16+, for more context [see this article](https://nextjs.org/docs/messages/middleware-to-proxy)). If you already have a middleware / proxy file continue to the steps below and add our code into the pre-existing file.

<figure><img src="/files/wu3Rle9RIKHrB7q5qLJq" alt=""><figcaption></figcaption></figure>

### Install the Premium Vercel menu proxy package

Install our [menu proxy npm package](https://www.npmjs.com/package/@iheartjane/vercel-menu-proxy) so that you can import our logic into the middleware file

```jsx
npm install @iheartjane/vercel-menu-proxy
```

### Implement the reverse proxy function

Copy and paste the code snippet below, updating the value of `MENU_PATH_HERE` to be whichever page you want the menu to display on (i.e. `shop`).

```jsx
import { janeMenuProxy } from '@iheartjane/vercel-menu-proxy';

export const config = {
  matcher: ['MENU_PATH_HERE/:path*'],
};

export default janeMenuProxy({
  menuToken: process.env.JANE_MENU_PROXY_TOKEN,
});
```

Save the file and deploy your application. Congratulations your menu page is now live! 🎉Continue on for specific instructions on SEO and deeplinking to specific stores 👉

## Ensure your menu is accessible to crawlers

In order keep the SEO up to date for your menu pages, we generate a menu specific sitemap that updates everyday with the latest product information. That sitemap isn’t automatically visible to crawlers until you make a small update to your robots.txt file 👇

### Update your robots.txt file to include the menu sitemap

Append the menu sitemap reference to the bottom of your robots.txt file, it will look like this: (**Note: replace `yourdomain.com` with your actual site and `shop` with the same menu path you used for the reverse proxy**).

```jsx
Sitemap: <https://yourdomain.com/shop/sitemap.xml>
```

If you don’t have a robots.txt file yet, create one (usually should live inside the app folder in your repo). The end result should look something like this:

<figure><img src="/files/WUXBqEdg3YCjSgDHnKAA" alt=""><figcaption></figcaption></figure>

## **Linking to your menu page**

Once the menu is live you’ll want to direct users to your shopping pages. Simply redirect all of the links, buttons, etc. that direct users to your menu on your site to your new premium menu link (i.e. [*yourdomain.com/menu*](http://yourdomain.com/menu)) or follow the guide below on how to link to specific stores!

### **Link to Specific Stores**

You can copy the link to a specific store in Jane’s Business Dashboard under **My stores**.

<figure><img src="/files/4YeXSa3kZra7vKjGRkQM" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/LRv5hKKg9YRLJp9zwcXQ" alt=""><figcaption></figcaption></figure>

#### **Adding Store URL Parameter**

Alternatively, you can append `?storeid=<store ID number>` to any category page (e.g. Deals, Flower, Shop all, etc.) or PDP and it will also link to a specific store

Example:

**Adding Fulfillment Specific Parameter**

You can append `?reservation-mode=delivery` to the link you want to open to delivery.

**Adding Location Selector Parameter**

You can append `?select-store=true` to the link if you would like the location selector to pop out right away

### [Customize your Menu](https://docs.iheartjane.com/partner-success/ecommerce-premium/premium-menu-settings) <a href="#customize-your-menu" id="customize-your-menu"></a>

*Now that you have your Premium menu rendering on a page, let’s customize your menu!*

### [Setting up SSO](https://docs.iheartjane.com/partner-success/ecommerce-premium/ecommerce-premium-setup/sso-for-ecommerce-premium) <a href="#setting-up-sso" id="setting-up-sso"></a>

Want users to be able to sign in with SSO? Follow our simple guide and get started!

### [GTM & Analytics](https://docs.iheartjane.com/partner-success/ecommerce-premium/ecommerce-premium-setup/premium-analytics) <a href="#gtm-and-analytics" id="gtm-and-analytics"></a>
