Deixe a página com a cara da sua marca
Escolha cores e fonte da sua página da CodeQR e preencha a aba SEO para o link compartilhado mostrar seu título, sua descrição e sua capa.
A página nasce no azul padrão da CodeQR. A aba Design define as cores e a fonte, e a mudança vale só para aquela página.
Disponibilidade
- Plano: todos.
- Onde: Páginas → sua página → Design.
O que dá para mudar
- Fonte — a fonte de toda a página.
- Principal — Cor de plano de fundo da página, Cor de plano de fundo secundário, Cor do texto e Cor da borda.
- Botões — Cor de fundo e Cor do texto.
- Card — Cor de fundo, Cor do texto e Cor da borda do bloco onde o formulário fica.
Toda cor é um valor hexadecimal; digite sem o #.
Passo a passo
- Abra sua página e clique em Design.
- Troque os valores que quiser. A pré-visualização ao lado acompanha enquanto você digita.
- Clique em Salvar. O aviso diz Data saved successfully.
- Recarregue a página publicada para ver como o visitante vê.
Escolha cores que continuem legíveis
Página aberta por QR Code é lida na rua, com o braço esticado, em celular com metade do brilho. Duas coisas decidem se ela serve:
- Contraste entre texto e fundo. Cinza escuro sobre branco é seguro; cinza claro sobre branco some no sol.
- Botão com cara de botão. Se o fundo do botão for igual ao fundo da página, ninguém acha. Mantenha os dois bem separados.
Pegue as cores da sua marca e confira o resultado num celular de verdade, não na pré-visualização.
Defina o que aparece quando alguém compartilha o link
As cores são a página. A aba SEO é tudo em volta dela: a aba do navegador e o cartão que aparece quando alguém cola o seu endereço no WhatsApp, no Slack ou num post.
Abra sua página e clique em SEO.
- Título — a aba do navegador e a chamada do cartão compartilhado. É o mesmo campo do Nome em Configurações da página: mudar num lugar muda no outro, e é esse nome que o seu aviso de consentimento cita.
- Descrição — a linha embaixo da chamada.
- Imagem de capa — envie uma imagem e a CodeQR redimensiona para 1200 × 627. Deixe vazio e a CodeQR monta um cartão com o seu título e a sua descrição, então o link nunca compartilha uma imagem genérica.
O Social Preview, abaixo dos campos, mostra o resultado. Clique em Salvar e recarregue a página publicada.
Os dois campos de texto têm um botão que escreve por você a partir do que a página já tem.
Verifique se funcionou
Abra o endereço da página no celular, de preferência na rua. Leia o título, ache o botão sem procurar e preencha um campo para confirmar que o texto dentro da caixa é legível sobre o fundo dela.
Mudar o design de uma página não afeta nenhuma outra do workspace — confirme abrindo uma segunda página depois de salvar.
Solução de problemas
A cor não mudou nada
Salve no botão do rodapé do painel e recarregue a página publicada, não o editor. A pré-visualização do editor e a página publicada são desenhadas separadamente.
O formulário está difícil de ler no celular
Aumente o contraste entre a Cor do texto e a Cor de fundo do Card. É contra esses dois que o visitante lê os campos, não contra o fundo da página.
Você quer tirar o selo da CodeQR da página
A linha Feito com CodeQR fica embaixo do formulário, depois do último campo, em toda página e em todo plano. Ela rola junto com a página e não cobre nada, mas não há ajuste que a remova.
Você quer o mesmo visual em todas as páginas
Não existe modelo compartilhado. Cada página carrega as próprias cores, então anote os valores hexadecimais em algum lugar e reaproveite.