# Onsite: what it does and where to start

Onsite grows your O&O, the sites and apps you own and operate, with all of your video: your library, creator and member posts, shoppable videos, and live shows. Every video is placed by page context and ranked for each viewer. The result is longer sessions, more return visits, and higher lifetime value.

Every Onsite experience starts with a placement: a named spot on one of your page types, such as a homepage, an article, or a product page. The placement renders a player. [Maya](https://begenuin.com/developers/browse-by-products/supervised-intelligence/supervised-intelligence-what-it-does-and-where-to-start#maya-genuin-s-orchestrator), Genuin's orchestrator, chooses its videos for each viewer from the page's context and what that viewer watched before.

You don't set up each capability from scratch. [Octo](https://begenuin.com/developers/get-started/any-business/octo-operates-your-brand-control-center-octo-proposes-you-approve), Genuin's Supervised Intelligence interface in Brand Control Center (BCC), proposes it when it finds a fit on your sites and apps. For example, when the crawl of your site finds a product catalog, Octo proposes a [Shoppable Carousel](https://begenuin.com/developers/browse-by-products/onsite/shoppable-carousel-placement) on your product pages, filled in from your catalog and brand kit. Nothing goes live until you approve it. Read [Onsite: contextual placements across homepage, category, and product pages](https://begenuin.com/developers/get-started/any-business/onsite-contextual-placements-across-homepage-category-and-product-pages) first for the full model.

![Diagram: how Onsite works, in four steps with a loop. All of your video, meaning your library, creator and member posts, shoppable videos, and live shows, is what Maya chooses from. 1, Placement: a named spot on one of your page types, such as a homepage, an article, or a product page. 2, Player: the placement renders a player, which shows Shorts, Shoppable, Community, or Live. 3, Maya, Genuin’s orchestrator, chooses the videos for each viewer, from the page’s context and what that viewer watched before. 4, Your O&O grows: longer sessions, more return visits, and higher lifetime value. A loop runs from the last step back to the first: what a viewer watches shapes the next placement they see. Underneath: Octo, Genuin’s Supervised Intelligence interface in BCC, proposes each capability when it finds a fit on your sites and apps, and nothing goes live until you approve it.](https://cdn.sanity.io/images/lnrtvsvr/development/10af553014566ece10da1f54d0fd8735b6aa6718-720x511.svg)
*A placement renders a player, Maya picks the videos for each viewer, and what they watch shapes the next placement.*

## Get started

1. [Register your placements on the Hierarchical Grid](https://begenuin.com/developers/get-started/any-business/register-placements). The Hierarchical Grid is the single tree of your network, properties, page types, and placements; every page type gets one address there that inventory, layout, and reporting share.
2. [Pick your first player experience](https://begenuin.com/developers/get-started/any-business/pick-player-experience). Assign Shorts, Shoppable, Community, or Live to each placement and preview it with your brand kit. The Choose a player section below shows which player renders each.
3. [Add a Genuin placement to your website](https://begenuin.com/developers/developer-resources/sdk/how-do-you-configure-the-genuin-web-sdk-placement-on-your-website). Render the placement with Web SDK so each page gets the videos its context calls for.

## Choose a player

An experience is what the viewer gets: Shorts, Shoppable, Community, or Live. A player is how a placement renders it on the page. Most players render one of the four experiences, as the diagram below shows. The Audio + Video Dynamic Player and the Keywords Player are formats of their own, for audio episodes and for video matched to a page's text. A placement can allow several experiences, and Maya picks between them for each viewer. [Player experiences](https://begenuin.com/developers/get-started/any-business/player-experiences-shorts-shoppable-community-and-live) explains how.

**Pick an experience to see which players render it**

- **Shorts**: Two players render Shorts: a vertical swipe feed, and a horizontal player with a playlist rail.
  - Allows: Shorts
  - Players that render it:
    - [Vertical Video Player](https://begenuin.com/developers/browse-by-products/onsite/vertical-video-player-placement): A 9:16 swipe feed ranked for the page and the viewer; Fits article and episode pages, homepages, app feeds
    - [Horizontal Video Player](https://begenuin.com/developers/browse-by-products/onsite/horizontal-video-player-placement): A 16:9 player with a playlist rail; Fits long-form embeds and desktop article bodies; Also help centers and demo pages
  - Before it goes live: Placement on the Hierarchical Grid, Brand kit for the preview, SDK on your site or app
  - A placement can allow several experiences; Maya picks between them for each viewer.
- **Shoppable**: Two players render Shoppable: the Shoppable Carousel, and the horizontal player with a playlist rail.
  - Allows: Shoppable
  - Players that render it:
    - [Shoppable Carousel](https://begenuin.com/developers/browse-by-products/onsite/shoppable-carousel-placement): Videos that carry products with a price; A buy or add-to-cart action; Fits product detail, category, and post-purchase pages
    - [Horizontal Video Player](https://begenuin.com/developers/browse-by-products/onsite/horizontal-video-player-placement): A 16:9 player with a playlist rail; Fits long-form embeds and desktop article bodies; Also help centers and demo pages
  - Before it goes live: Placement on the Hierarchical Grid, Brand kit for the preview, SDK on your site or app
  - A placement can allow several experiences; Maya picks between them for each viewer.
- **Community**: The Community Wall renders creator and member posts, group by group.
  - Allows: Community
  - Players that render it:
    - [Community Wall](https://begenuin.com/developers/browse-by-products/onsite/community-wall-placement): Creator and member posts by group; Replies, pinned posts, and Quests; Fits member and fan areas and support communities; Also app home feeds
  - Before it goes live: Placement on the Hierarchical Grid, Brand kit for the preview, SDK on your site or app
  - A placement can allow several experiences; Maya picks between them for each viewer.
- **Live**: Live & Q&A renders scheduled live sessions, with questions, polls, and replay.
  - Allows: Live
  - Players that render it:
    - [Live & Q&A](https://begenuin.com/developers/browse-by-products/onsite/live-q-a-placement): Scheduled live sessions; Questions, polls, and replay; Fits product drops, AMAs, events, and recurring shows
  - Before it goes live: Placement on the Hierarchical Grid, Brand kit for the preview, SDK on your site or app
  - A placement can allow several experiences; Maya picks between them for each viewer.
- **Own formats**: Two players are formats of their own: one for audio episodes, one for video matched to a page’s text.
  - Allows: Audio episodes, Video matched to page text
  - Players that render it:
    - [Audio + Video Dynamic Player](https://begenuin.com/developers/browse-by-products/onsite/audio-video-dynamic-player): Podcast or audio episodes with generated visuals; Switches by sound state; Fits episode pages and in-app listening; Also pages viewed with sound off
    - [Keywords Player](https://begenuin.com/developers/browse-by-products/onsite/keywords-player): Video anchored to the term or paragraph it matches; One tag for the whole site; Fits large content sites and help centers
  - Before it goes live: Placement on the Hierarchical Grid, Brand kit for the preview, SDK on your site or app
  - These two aren’t one of the four experiences; each is its own format.

## Keep viewers in session

- [Sticky Mini-Player](https://begenuin.com/developers/browse-by-products/onsite/sticky-mini-player): docks to a corner and keeps playing while the viewer scrolls or moves between pages.
- [Contextual Continuity](https://begenuin.com/developers/browse-by-products/onsite/contextual-continuity): what a viewer watched on one page shapes the next placement they see.
- [Unified identity](https://begenuin.com/developers/get-started/any-business/unified-identity-auto-login-sso-and-the-id-graph): auto login and SSO tie one viewer's activity across your properties to a profile you control.

## Personalize and measure

- [Personalization and relevance](https://begenuin.com/developers/get-started/any-business/personalization-and-relevance-how-maya-ranks-every-feed): how Maya ranks every feed, and which parameters you control.
- [Placement Experiments and Holdouts](https://begenuin.com/developers/browse-by-products/onsite/placement-experiments-and-holdouts): A/B tests and standing holdouts on each placement, so every change reads as lift.
- [Measure engagement](https://begenuin.com/developers/get-started/any-business/measure-engagement-watch-time-lift-and-cohorts): per-minute watch time per user, lift against a holdout, and cohorts.

Everything you grow onsite becomes addressable, attributable inventory you can extend through [Offsite](https://begenuin.com/developers/browse-by-products/offsite/offsite-what-it-does-and-where-to-start), with [margin reporting](https://begenuin.com/developers/get-started/any-business/margin-reporting-revenue-per-impression-and-net-margin-on-ad-spend) by placement.

## Build it

The SDKs render placements and sign members in today: [Web](https://begenuin.com/developers/developer-resources/sdk/how-do-you-embed-and-configure-the-genuin-web-sdk-on-your-website), [iOS](https://begenuin.com/developers/developer-resources/sdk/developer/genuin-sdk/native-compatibility/ios/how-to-integrate-and-power-your-brand-community-in-ios-apps), [Android](https://begenuin.com/developers/developer-resources/sdk/how-to-integrate-and-power-your-brand-community-in-android-apps), [React Native](https://begenuin.com/developers/developer-resources/sdk/how-do-you-integrate-the-genuin-react-native-sdk-into-your-application), and [Flutter](https://begenuin.com/developers/developer-resources/sdk/how-do-you-integrate-the-genuin-flutter-sdk-into-your-application). [Deliver contextual feeds with page, user, and location context](https://begenuin.com/developers/developer-resources/sdk/contextual-embeds-how-they-work-and-how-to-configure-them) shows what to pass so the feed matches the page. [Customize the Genuin video player](https://begenuin.com/developers/browse-by-products/control/how-does-a-brand-customize-the-genuin-video-player-controls) covers sizes, layouts, and the profile menu.

The placement calls in the [Business Account API](https://begenuin.com/developers/get-started/any-business/business-account-api-provisioning-oauth-and-the-resource-map) are proposed, not live. [Live API today and the Business Account API roadmap](https://begenuin.com/developers/developer-resources/guides/live-api-today-and-the-business-account-api-roadmap) maps what you can call now to what's planned.

## Questions people ask

- [How do I pass page context so the feed matches the page?](https://begenuin.com/developers/get-started/any-business/developers-engineering-questions-and-answers#how-do-i-pass-page-context-so-the-feed-matches-the-page) Asked by developers and engineering.
- [Which video experience belongs on which page?](https://begenuin.com/developers/get-started/any-business/marketers-growth-questions-and-answers#which-video-experience-belongs-on-which-page) Asked by marketers and growth teams.
- [How do I personalize the feed and how much control do I have?](https://begenuin.com/developers/get-started/any-business/marketers-growth-questions-and-answers#how-do-i-personalize-the-feed-and-how-much-control-do-i-have) Asked by marketers and growth teams.
