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

# Whitelabel

> Configuring whitelabel parameters

export const LastUpdated = ({date, lang = "en"}) => {
  const translations = {
    en: "Last updated:",
    es: "Última actualización:",
    pt: "Última atualização:",
    fr: "Dernière mise à jour:",
    de: "Zuletzt aktualisiert:"
  };
  const label = translations[lang] || translations.en;
  return <>
<style>{`
.last-updated-component {
display: inline-flex;
align-items: center;
gap: 8px;
padding: 10px 16px;
border-radius: 8px;
margin-top: 12px;
margin-bottom: 16px;
font-size: 14px;
background-color: rgba(0, 0, 0, 0.05);
border: 1px solid rgba(0, 0, 0, 0.12);
color: rgba(0, 0, 0, 0.75);
line-height: 1;
}

        .last-updated-component svg {
          flex-shrink: 0;
          vertical-align: middle;
        }

        .last-updated-component span {
          display: inline-flex !important;
          align-items: center !important;
          line-height: 1 !important;
        }

        [data-theme="dark"] .last-updated-component {
          background-color: #3a3a3a;
          border: 2px solid #888888;
          color: #ffffff;
        }

        [data-theme="dark"] .last-updated-component svg {
          stroke: #ffffff;
        }
      `}</style>
      <div className="last-updated-component">
        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
          <circle cx="12" cy="12" r="10" />
          <polyline points="12 6 12 12 16 14" />
        </svg>
        <span>
          <strong style={{
    fontWeight: 600
  }}>{label}</strong> 
          <time dateTime={date}>{date}</time>
        </span>
      </div>
    </>;
};

<div style={{textAlign: 'justify', marginBottom: '1.5rem'}}>
  Topsort's white-labeling feature lets you customize the vendor dashboard to match your brand, creating a consistent experience for your advertisers.
</div>

## How It Works

<Steps>
  <Step title="Enable White-Labeling">
    <div style={{textAlign: 'justify', marginBottom: '1.5rem'}}>
      Contact your Topsort account manager or support team to enable the feature. The tab “Custom Branding” will be enabled in the admin dashboard.
    </div>
  </Step>

  <Step title="Customize the Dashboard">
    <div style={{textAlign: 'justify', marginBottom: '1.5rem'}}>
      Once enabled, go to the Settings dropdown and select “Custom Branding”. Here, you can upload your logo, adjust colors, and modify other elements to match your brand.
    </div>

    * **Logo:** Upload your company logo. We recommend a size of 500x500px.
    * **Marketplace Name:** Set the name that will appear on the dashboard.
    * **Default Language:** Choose the default language for the dashboard.
    * **Terms and Conditions URL:** Provide a URL to the terms and conditions of your marketplace. This link will be included in the vendor invitation signup flow.
    * **Colors:**
      * **Primary Color:** Used for the navigation bar, icons, lines in graphs, and links.
      * **Secondary Color:** Used for some buttons and switches.

    <br />
  </Step>

  <Step title="Save Changes">
    Click Save to apply your customizations to the vendor dashboard.
  </Step>
</Steps>

## Frequently Asked Questions

<div style={{textAlign: 'justify', marginBottom: '1.5rem'}}>
  1. **How do I revert to the default Topsort branding?**
     * Simply remove your custom branding settings and save.
  2. **Can I customize the dashboard for different vendors?**
     * White-labeling applies globally to all vendors on your platform.
  3. **Is this feature available on all plans?**
     * White-labeling is included with the **Enterprise** plan. If you're on a different plan and want to enable this feature, contact your Topsort account manager or support team.
</div>

***

<LastUpdated date="2025-11-18" />