Adapta a tua conta de white label à imagem corporativa da tua empresa
- Como personalizar a tua conta White Label
- 1. Vai para a secção Branding da tua conta de White Label.
- 2. Configura o aspecto da tua conta usando CSS e JS
- 3. Usa o teu próprio subdomínio de produção
- 4. Usa o teu próprio subdomínio para os usuários extra da conta White Label (opcional)
- 5. Usa o teu próprio domínio para a URL curta do código QR (opcional)
- 6. Utiliza o teu próprio domínio para notificações por e-mail (opcional)
- 7. Definições Regionais - Idiomas Personalizados
Usar o próprio domínio é provavelmente a principal razão pela qual uma empresa opta por uma conta de White Label. No entanto, existem muitas mais funcionalidades poderosas oferecidas neste plano.
Como personalizar a tua conta White Label
1. Vai para a secção Branding da tua conta de White Label.
Primeiro, vai à secção Branding Brandingda tua conta White Label onde todas estas definições podem ser geridas. Podes começar por dar à plataforma o teu próprio nome.
2. Configura o aspecto da tua conta usando CSS e JS
Adiciona o teu logótipo, favicon e usa as tuas próprias cores.
Branding
Cores
3. Usa o teu próprio subdomínio de produção
Podes alterar o subdomínio da tua conta de white label para ser o teu próprio domínio, por exemplo qr.domínio datuaempresa.com. Vê mais informação sobre como configurar o teu próprio domínio.
4. Usa o teu próprio subdomínio para os usuários extra da conta White Label (opcional)
Os usuários adicionais das tuas contas White Label também podem usar o seu próprio subdomínio. Isto pode ser útil para agências que criem contas de usuários para os seus clientes que precisam de correr sob o seu próprio domínio.
5. Usa o teu próprio domínio para a URL curta do código QR (opcional)
Cria códigos QR mais simples e fáceis de ler usando um domínio diferente ou mais curto em vez do teu domínio de produção, por exemplo, qr.vc. Vê mais informação sobre como criar um domínio raiz.
6. Utiliza o teu próprio domínio para notificações por e-mail (opcional)
Podes também usar o teu domínio para enviar notificações por e-mail para scans, formulários, cupões, etc. Isto só se aplica ao domínio principal da conta, usuários adicionais usarão o mesmo domínio que o administrador.
7. Definições Regionais - Idiomas Personalizados
Personaliza a tua plataforma com a tua própria língua personalizada, para além da língua base seleccionada. Traduz blocos de texto específicos para os teus idiomas locais e atribui os pacotes de idiomas personalizados que criaste aos utilizadores da tua escolha.
Configurações Avançadas - CSS Hacks
Personaliza a tua instância de etiqueta branca com o teu próprio código CSS ou JS que será injectado na <head> tag de todas as páginas da tua conta de etiqueta branca. Podes incluir o teu próprio widget de chat e muito mais.
Cores
Usa uma cor personalizada.
body{background-color: #cde;}
Fontes
Usa uma fonte personalizada ou uma do Google Fonts.
@import 'https://fonts.googleapis.com/css?family=Source+Sans+Pro'; body{font-family: 'Source Sans Pro', sans-serif;}
Ícones
Este exemplo substitui o ícone do usuário no menu por uma imagem base64 personalizada.
.admin-user{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAA3NCSVQICAjb4U/gAAAACXBIWXMAAAsTAAALEwEAmpwYAAABvFBMVEUAAACt1q2m17Cn26+q1LKs1ays2ayr1rGp2K+p1q6q2bCfyqap2LCp16+p2K+q2LCp17Co2LCp2K+p16+o2K6q2LCo16+q17Co2K+p17Co1q6q2LCq2K6o2LCq1rCo2K6o2LCq2K6n2K2o2K6q2LCo2K6o1rCq1rCbu6GgzKWm1Kyo1q5gnL5jpMdjpsxkp81lqtFmqcxnpcJnp8Vnp8tnqs5nq85nrdRnrdVoq89orNJpq8trnLRsqb5tq8VtrMVvqchxrb9yp69yrLx2o7V2q654q8N5qqR5r8h5sMt6sbZ7q6R9qr19tbqBsqeCo4eFtKSGr5iIt8qIuauJssKJvrWNtJKPt8WRuJaSwaqXv5yYtZ+Yw6GYw6WZwZ6bxaCbxaGcv6KdyKOexaKfvKWfyqWhzaeiz6yjzKmj0Kqj0Kyj0a6k0Kqlw76l0aqm06ynza6n0ayn1K2n1a2o1a6o1q+p1q+p16+q2LCtyLWuzrSuzrWvyLez0Luz0bu407+508C71sS+2NXB29jD2MvD2svF3c3G39vH3tjH39vJ39LK4tzO5NjQ5d7X6+DX7OPY7OPZ7ePb7+Xc8Oa65Fc8AAAALHRSTlMAGRodHh8iUldZXnBxdHd4e5+kp6ustLW6vN7f5ebw8vP09fX6+/z9/v7+/pMxHZMAAAFbSURBVBgZBcFNThNhAADQ932dtsOktKVpKYaEjTvxECYkGhduMC64AuE4nsGYKGHpwjO4MjEuXCDqYkr5U/o3M0x9LwBa2UbStqwW8xIIoNUbvawaScTZ9K6CANnO6/NJGQZ7m/A+XyCge7z+eg2tp13w9p5IduziGsKw0VxWOElJtB4xhfRFh+3pTcb490PUfcMDFgcdGG6WHPXE1hgbGPeB3l8MGzF7ha2SLqBd4DCLG7C7V1gCygBZTCDsjFbnBXDVgiS24eb7XTv59AB3f/qQRih+LEgnH2fk30YR6mSJnzPYfZYxbt6CVayoJtB/nsFgdA9VXJAXqA4SYHNQYh7nZ/4FPE4B+jNO50k5Vddry30AzUGRTOuG8mK/09/qPgkAivsPl+tElW8jDwA0P+e1gM4Jl2EB4MuvGQHS8REA3uUrBNDoDQ8Bp9PbNQRAI8uStF5V83kN/Afai3sy4mNhxAAAAABJRU5ErkJggg==')}
Se quiseres substituir o CSS dentro do ficheiro (css inlined), terás de usar o comando !important, por exemplo:
body{background-color: #cde !important;}
Logos
Eu quero substituir o logótipo da conta de um dos meus usuários.
Com domínio próprio
Se o teu usuário tem o seu próprio subdomínio, apenas carrega o seu logotipo na biblioteca de mídia da conta do teu cliente e adiciona este snippet à tua secção Personalização > CSS.
body[domain="my-subdomain-com"] .branding-logo a img { content: url(https://my.subdomain.com/l/media?xxxxxxxxxx&fullsize=1); }
Sem domínio próprio
Se o teu usuário não tiver o seu próprio subdomínio, apenas carrega o seu logotipo na biblioteca de mídia da conta do teu cliente e adiciona este snippet à tua secção Personalização > CSS.
Por favor nota que para usuários sem um domínio personalizado não é possível personalizar o logotipo na página de login.
body[domain="username"] .branding-logo a img { content: url(https://your.subdomain.com/l/media?xxxxxxxxxx&fullsize=1); }
Podes encontrar mais recursos CSS em W3 Schools ou no nossa Guia de CSS e HTML.