Os temas do WordPress oferecem muita flexibilidade. Você pode fazer alterações de estilo e layout no seu navegador da Web – nenhum conhecimento de codificação é necessário. Eles também podem incluir extras como padrões de bloco e variações de estilo.
Variações de estilo Dê a você uma vantagem no design. Eles nos permitem criar várias combinações de cores e tipografia. Eles também abrigam estilos de blocos personalizados definidos no editor do site. Qualquer coisa em um arquivo tema.json também pode ser incluído em uma variação de estilo.
Isso é útil para profissionais da Web e usuários. Escolha a variação que atenda às suas necessidades e comece a criar seu site.
Criar uma variação de estilo de tema de bloco personalizado é mais fácil do que você pensa. Todo o processo ocorre no editor do site do WordPress. Uma variação simples pode ser construída em minutos.
Então, acompanhe enquanto construímos uma variação de estilo! Mostraremos como apontar e clicar em seu caminho para um design personalizado.
Requisitos de projeto de variação de estilo
Os requisitos para a construção de uma variação de estilo personalizado são mínimos. Você precisará:
Não recomendamos o uso de um site de produção para este processo. Uma instalação de encenação ou WordPress local é o caminho mais seguro.
Vamos construir uma variação de estilo
Agora, é hora de começar a construir! Faça login no seu site WordPress e siga as etapas abaixo.
Etapa 1: Abra o editor do site WordPress
Primeiro, navegue para Aparência> Editor no administrador do WordPress para abrir o Editor de site. Em seguida, clique no Estilos Link na barra lateral esquerda.
O painel Styles inclui links para TipografiaAssim, CoresAssim, FundoAssim, Sombrase Layout. Você também encontrará um Navegue estilos Link que exibe variações de estilo disponíveis para o tema.
Finalmente, o Blocos O link permite que você personalize estilos de bloco individuais em todo o site.
Etapa 2: Altere os estilos do seu tema
Esta etapa tem tudo a ver com preferência pessoal. Trabalhe no painel Styles e comece a fazer alterações.
Cor e tipografia são as mudanças mais óbvias, mas você pode levar as coisas adiante. Por exemplo, você pode alterar a largura e o espaçamento do layout. Além disso, cada bloco incluído no wordpress pode ser personalizado. Adicione margens, preenchimento, bordas ou CSS personalizados.
Cobrimos o básico em nossa variação, incluindo:
- Criou uma paleta de cores personalizada;
- Instalado novas fontes do Google Fontes;
- Adicionado espaçamento personalizado para os blocos de grupo e parágrafo;
- Mudou a aparência do bloco de botões;
O resultado é uma aparência terrosa que visa a simplicidade. Mas você pode fazer o quanto quiser. Lembre -se de salvar suas alterações quando for feito.
Etapa 3: Salve sua variação de estilo
Nossa próxima tarefa envolve salvar nossa variação de estilo personalizada. Essa funcionalidade faz parte do plug -in Create Block Theme.
O recurso está localizado dentro do editor do site. Veja como encontrá -lo:
- Enquanto estiver no editor do site, clique em Painel direitodestacado em verde abaixo:
- Clique no Ícone da chave inglesa no canto superior direito da tela e selecione Crie variação do tema:
- Nomeie a variação e garantir o Salvar fontes a caixa é verificada. Vamos chamar a nossa de “linda terra”.
- Clique no Crie variação do tema botão para salvar as configurações.
Uma vez salvo, a nova variação é adicionada à lista no Navegue estilos Área do editor de temas. Passando sobre a variação revela seu nome.
Como usar sua variação de estilo em outro site
As variações de estilo são portáteis e podem ser usadas em vários sites. O processo envolve copiar o arquivo JSON gerado e adicioná -lo ao site desejado.
- Localize o arquivo JSON da variação do estilo em
/wp-content/your-theme/styles/
Substituiryour-theme
com o nome do tema que você está usando (o nosso étwentytwentyfive
).Para referência, nosso arquivo json é chamado
beautiful-earth.json
- Copie o arquivo JSON da sua variação de estilo.
- No seu novo site, cole o arquivo em
/wp-content/your-theme/styles/
– Pode ser necessário fazer upload do arquivo via SFTP ou o gerenciador de arquivos do seu host. - Agora você poderá escolher a variação de estilo no editor do site.
Sobre fontes personalizadas
Anteriormente, mencionamos a capacidade de adicionar fontes personalizadas a uma variação de estilo. Requer algumas etapas extras para funcionar ao mover sua variação para um novo site.
- Localize as fontes personalizadas em que você adicionou
/wp-content/themes/your-theme/assets/fonts/
- Copie a respectiva pasta de cada fonte.
- Cole as pastas de fonte no mesmo diretório do seu novo site. Mais uma vez, pode ser necessário enviá -los.
Dê um olhar personalizado ao seu bloco
As variações de estilo são uma maneira conveniente de adicionar personalidade ao tema do seu bloco. Você pode construí -los para atender aos requisitos do seu projeto.
Eles também atuam como ponto de partida para os designers. Você pode continuar adicionando estilos personalizados após a aplicação de uma variação. As alterações que você faz serão salvas no banco de dados do site.
Há também uma opção para redefinir os estilos para os padrões da variação. Isso facilita a experiência sem perder os elementos -chave do seu design.
A melhor parte é que as variações de estilo não requerem experiência em codificação. Isso coloca o design personalizado ao alcance de todos.
Principal