Sesame Labs Docs
  • πŸ‘‹Welcome to Sesame Labs
  • Getting Started
    • ✨Set up your Community Hub
      • ⚑Create your first quest
      • πŸ€–Configure Community Hub Discord Bot
      • πŸ€‘Set up your Rewards Store
      • 🌟Deploy Sesame Widget
    • πŸ“½οΈGetting started videos
    • πŸ₯³Best practices to get started
    • ⁉️FAQ
  • Use Cases
    • Use Cases
      • πŸ™ŒBoost community activity
      • πŸ—ΊοΈLearning journeys
      • 🏒Vertical-specific use cases
  • Product Guides
    • ☸️Community Hub
      • ⚑Quests
        • Mini-quests
        • Event-based quest
        • Referral quests
        • Groups
        • Actions
        • Quizzes
      • πŸ…Rewards
      • πŸ€‘Rewards store
      • πŸ†Leaderboard
      • 🌟Sesame Labs Widget
        • ⏫Install and configure Widget
      • πŸ€–Discord bot
    • 🧠AI CoPilot
    • πŸ™ŠAdmin & Moderation
      • πŸ’»Roles
      • πŸ‘Participants
      • πŸ”ŽContent moderation
      • ⚠️Fraud detection
      • πŸ“ˆAnalytics
    • 🎨White-label Options
      • 🌎Custom domain
      • πŸ–ΌοΈiframe
      • πŸ› οΈAdvanced branding tools
      • πŸ†”Single Sign On (SSO) Setup
    • πŸ”—Integrations
      • πŸ‘•Printful
        • Setup
        • Working with Printful items
      • πŸ€–Discord bot
      • πŸ“ΆAPI
        • ☸️Community Hub API
        • ⏫Widget API
  • About
    • Sesame Labs brand assets
    • Contact us
Powered by GitBook
On this page
  1. Product Guides
  2. White-label Options

iframe

Achieve the highest level of brand integration with a Community Hub that looks native to your website & dApp.

PreviousCustom domainNextAdvanced branding tools

Last updated 1 year ago

The iframe can be customized by passing in a configuration JSON object to the name attribute. Here are a list of possible configuration flags / keys

We are actively working on customization. More customization keys will be available soon, but don't hesitate to reach out if you want something specific!

  • hideLogo - boolean - default false - true if you want to hide the top left logo, false o.w.

  • overrideWidth - number, px - default 1160 - overrides the content width of the page

    • This does not affect smaller breakpoints

  • leftNavBar - boolean - default false - true if you want the nav bar links to be left aligned, false o.w.

    • This is usually used with alignedNavBar: true

    • This is usually used with hideLogo: true as the logo has position absolute

  • alignedNavBar - boolean - default false - true if you want the nav bar to be aligned with the quest cards, false o.w.

Example:

<iframe src=".." name='{"hideLogo": true, "overrideWidth": 1360, "leftNavBar": true, "alignedNavBar": true}"></iframe>

🎨
πŸ–ΌοΈ
Shows logo by default
Hides logo
Overrides the width of the main content block
leftNavBar toggled to true with hideLogo
default behavior of leftNavBar with hideLogo
alignedNavBar set to true
alignedNavBar defaults to false
hideLogo, overrideWidth, leftNavBar, alignedNavBar