Blz Matheus, tá feito. Mas o código que coloquei no css preciso tirar? ou deixa lá?
Sim, permanece. É um conjunto, primeiro você importa a fonte e depois você dá o comando para colocar a fonte onde desejar, no seu caso, em toda loja, conforme fez. Está certinho agora.
@Matheus, essa orientação sobre a configuração das fontes permanece válida na V2? Acessei o Github e não encontrei a pasta @custom-html
@Carlos Carlos, vc conseguiu o link lá no google fonts? dá pra fazer direto no cms… layout, inserir código, html antes da head…
@Rogerio valeu mesmo cara! O link eu consegui, só precisava saber como aplicar! Ficou muito prático!
@Matheus, @leonardo coloquei a fonte como o @Rogerio indicou, mas ela não funcionou em toda a loja.
- Páginas criadas estão com a fonte padrão do template;
- Produtos com descrição mais longa também, já outros a fonte alterou;
- Na página do produto o nome foi alteado para a fonte instalada, mas abaixo dele não (Código, valores, qtd em estoque)
Valeu!!!
@Carlos mas vc colocou um código também no css? Se não acho que não funciona mesmo, algo assim:
body {
font-family: sua fonte !important;
}
Não tem mais a pasta @custom-html
porque na v2 facilitamos a edição direto do HTML (EJS) padrão mesmo, além de possibilitarmos a inserção de HTML no CMS como o @Rogerio sugeriu
A sugestão do @Rogerio foi perfeita, o !important
vai resolver o problema e aplicar a fonte em toda a loja.
Mas na verdade na sua edição temos um errinho de sintaxe @Carlos , o correto seria:
body {
font-family: 'Ubuntu', sans-serif !important;
}
Note que eu removi um
;
que você tinha mantido após osans-serif
.
Você inseriu o código direto no GitHub (o que é até melhor), mas também funcionaria se inserido no CMS em Layout > Inserir código > CSS customizado.
Valeu @leonardo, já ia pedir ajuda pra vc! Pq tava vendo que dava erro na hora do update.
Errando e aprendendo…kkkkk
Mais uma curiosidade (good practice), como vocês já estão editando direto no GitHub () outra forma de fazer esta mesma alteração é setando uma variável SCSS, neste caso em específico bastaria adicionar o trecho abaixo logo no início do arquivo template/scss/_variables.scss
:
$font-family-sans-serif: "Ubuntu", sans-serif;
Neste caso não precisaria do
!important
Fui proativo haha
Muito! Mas isso que é bom! Passando informações importantes para agregar conhecimento para todos! Parabéns!!!
@leonardo a alteração de fonte não rolou não…
Inclusive tirei a linha do _styles.scss e fiz como você tinha indicado e coloquei no _variabless.scss mas na loja não teve mudanças… Aonde será que fiz besteira?
Os pontos que ainda ficaram com outra fonte é por causa do tema escolhido.
O mais notório está em parágrafos eu acho, neste caso o tema definiu o uso de fonte serif (Ubuntu é sans-serif), pra continuar usando o tema mas reverter isto você tem que adicionar o seguinte em custom-css/_styles.scss
:
p {
font-family: $font-family-sans-serif;
}
Ou uma bala de canhão em CSS mesmo, que poderia ser inserido no CMS também:
body, p, .btn {
font-family: 'Ubuntu', sans-serif !important;
}
Olá. Gostei dessa bateria e até implementei, mas a minha dúvida é: esse css customizado com a fonte escolhida não vai afetar a versão mobile, não é mesmo?
Uma outra questão: é possível usar a customização com mais de uma fonte diferente da fonte padrão do template, em seções específicas da loja?
Boa tarde, que bom que serviu para você de conteúdo @construindoosom. É possível importar sim outras fontes para serem utilizadas no site, mas não é recomendável. O Google mesmo sugere apenas 1, quando você coloca duas, ele já fala que pode ficar pesado.
Tudo pela leveza, irmão. E sobre a versão mobile, não altera a fonte após a customização do css feita?