🟢 1 - Customização do Sistema
- julio.cesar
- Diego Belini
Nesse tutorial DataCake, você confere a documentação completa das customizações visuais disponíveis para seu carrinho do sistema DataCake!
Para customização do sistemas DataCake existem algumas telas especificas para cara vertical. Para customização das telas da esteira de vendas vamos seguis as seguintes atividades:
Subir imagem para servidor DataCake
Copiar URLs da imagens nos campos de logo do core website e do logo da home
Trocar as cores das variáveis primarias e secundarias
Copiar URLs da imagens nos campos de logo do e-mail
1️⃣ Subir para o servidor as logos na tela de MEDIA do DataCake.
IMPORTANTE
imagens deve ser de preferência com fundo transparente em formato png salvo com qualidade para web. Evitar resoluções muito baixas a baixo de 100px tanto na altura quanto na largura ou resoluções muito alta acima de 1024px tanto na altura quanto na largura.
No Painel de controle
Acessar CONTEÚDO > MEDIA/ARQUIVOS clicar em “clique para enviar arquivos”
Escolha o arquivo do logo 1 para fundo escuro 2 para fundo claro como no exemplo a baixo:
2️⃣ Copiar as URLs das imagens no campos de logo em CORE WEB SITE
Após o upload das imagens cada uma delas vai receber dois ícones um para apagar e um que vamos utilizar para fazer a cópia da URL dessa imagem que agora está online. 
Recomendamos abrir em uma nova aba o painel DataCake para facilitar essa configuração
Em uma nova janela vá em SISTEMA > CONFIGS > CORE WEBSITE
Preencha os campos indicados nos prints abaixo. Altere entre as abas da pagina de MEDIA para copiar a url de cada imagem que fez o upload anteriormente.
Após alterações lembre de salvar clicando no botão superior direito ou teclando ctr-l + S
3️⃣ Trocar as cores das variáveis primarias e secundarias
Ainda em CORE WEB SITE logo a baixo temos as variáveis que vão ser usadas para definir as cores do sistema. Necessário utilizar código de cores HEX ou RGB como nos prints a baixo.
Após alterações salvar
Devem ser alterados as duas variáveis com o nome primary assim como as com nome secondary
--primary: #073643 !important;
--c-primary: #073643 !important;--secondary: #b0df01 !important;
--c-secondary: #b0df01 !important;
4️⃣ Copiar URLs da imagens nos campos de logo do e-mail
Assim como copiamos as URLs dos logos para os campos no core web site, também precisamos copiar as urls para um campo de logo de e-mails esse logo será usado nos templates de e-mail do sistema.
Va em SISTEMA > CONFIGS > EMAIL
Basta colar no campo “Logo padrão de email” e salvar
Tutorial em Vídeo da customização visual do sistema.
Link para tutorial detalhado sobre CSS