Que tal personalizar o tema Live WordPress em tempo real? Bem, CSSHero é um Plugin para fazer alterações de maneira fácil

O WordPress é uma estrutura CMS, cheia de personalização e fornece várias APIs e ganchos que qualquer desenvolvedor pode usar para modificar temas e plugins. Essa é a razão pela qual atualmente temos a opção de escolher plugins entre milhares de plugins disponíveis no repositório oficial do WordPress.

Neste post vamos discutir o novo plugin CSSHero com todos os detalhes. Mas antes de começarmos, vamos nos concentrar these questions .

• Como make live changes no seu site WordPress?
• Mudanças de tema em tempo real?
• Existe alguma maneira fácil de saber o número de propriedades CSS para o tema WordPress?
• Edite seu blog WordPress com visualizações em tempo real
• Personalizando temas do WordPress antes de serem lançados

Se você tem alguma das perguntas acima, então você está no lugar certo.

Se você quiser fazer alterações ao vivo sozinho, without any help do plug-in, precisará conhecer quase ~300 of CSS properties antes. É meio impossível modificá-los para ver mudanças reais no modo de tema ao vivo. O customizer do WordPress permite que você modifique algumas das propriedades, mas não todas, e esse é um problema real que temos.

Eu diria que temos DUAS opções:

Opção-1) Realizar alterações CSS manualmente

• Abra seu blog no Chrome / Mozilla
• Clique com o botão direito do mouse em elementos CSS, como cabeçalho, postagem, imagem etc.
• Clique em Inspect para ver as propriedades CSS
• Faça alterações para ver o efeito
• Quando estiver bem - Vá para o arquivo style.css do tema e salve as alterações
• Repita o processo várias vezes

Opção-2) Use plugin com funcionalidade integrada, no nosso caso é CSSHero

• Realize alterações no live site com o editor
• Ver resultado ao vivo
• Clique Save button e done

CSSHero em colaboração com Crunchify, distribuindo 10 free Licenses para leitores do Crunchify. Preencher este formulário do google para ter seu nome listado. - Sorteio ENCERRADO

Vamos instalar o CSSHero e realizar alterações ao vivo do tema WordPress

NOTE : Confira o vídeo completo na parte inferior deste post.

Passo 1

Por que CSSHero? CSSHero é um plugin premium do WordPress. A licença básica começa com $29/site . Eu diria – se você é iniciante ou profissional, vale a pena tentar. Ele vem com 30 days garantia de devolução do dinheiro.

Use o código CRUNCHIFY para obter 34% off nos planos Starter, Personal e 40% off no plano Pro.

Registre sua licença e baixe a versão mais recente do CSSHero plugin do seu painel: http://www.csshero.org/

Passo 2

• Instale-o no painel de administração do WordPress e ative-o
• Na ativação, ele solicitará a Key
• Basta clicar em Get my Key Now! botão e ele abrirá uma página com a chave de licença
• Clique em Get License e está tudo pronto

Ponto-1) Vamos começar na funcionalidade

• Agora vá para a home page do seu blog e você verá o botão animado CSSHero no canto top right .
• Clique nele e o plugin carregará control panel que funciona com o seu tema

Dê uma olhada no gif abaixo com todas CSSHero options :

Point-2) Opção CSSHero Theme Editor

A ideia para o theme editor é mudar todo theme's style com um editor visual simples. Com a ajuda do editor de temas CSSHero você pode mudar

• Texto do cabeçalho
• Fonte
• fronteira
• estilos, etc

O mesmo se aplica a

• conteúdo do corpo
• post de entrada
• valores meta
• valores de cabeçalho
• rodapé
• barra lateral, etc. Dê uma olhada abaixo GIF.

Point-3) Opções de layout de dispositivo úteis com um único clique

Como você vê na imagem abaixo, o editor de temas nos dá a opção de verificar o número de diferentes Layouts de celular, iPhone, iPad do seu tema com apenas o mouse e um clique.

Ponto-4) Como desfazer suas alterações recentes?

O usuário tem a opção de desfazer todas as alterações recentes usando o módulo de Change history de alterações simples. Aposto que nenhum dos desenvolvedores faz tudo certo na primeira tentativa, pelo menos eu :). Isso é muito útil para mim.

CSSHero também fornece um módulo muito útil que mostra all of your save changes . Você pode voltar na timeline do tempo e reverter para a versão anterior. Não é uma ferramenta útil? Eu usei essa ferramenta até agora várias vezes e adorando.

Ponto-5) Configurações e Opções de Ferramentas

Preset Settings e Tools Options .

Dê uma olhada no vídeo detalhado que capturamos, que mostra todas as funcionalidades do CSSHero WordPress Custom CSS Editor.

Vídeo detalhado do Youtube:

Agora que você viu todas as funcionalidades, é hora de fazer as perguntas abaixo :).

Ponto-6) Este plugin funciona com o meu tema?

De acordo com as informações do site oficial do CSSHero, o plugin funciona abaixo de todas as estruturas de temas do WordPress.

• Estrutura de Gênesis
• Gerar Imprensa
• Camadas WP
• Tema Ultimato
• Total
• Antecipado
• WP Bootstrap
• Temático
• Obrigatório+Fundação
• Ómega
• DMS de linhas de página

Se o seu tema isn't compatible com CSSHero, no worries . Ele mostrará uma opção para ativar o Rocket mode .

Message : o suporte nativo para este tema não está presente. Quer experimentar a detecção automática do modo Rocket? Basta enable it e tentar modificar CSS again e você deverá ver as mesmas opções que viu no vídeo acima.

Ponto-7) E quanto ao suporte e documentação do plug-in?

Alguns dos plugins populares do WordPress, como Gravity Forms, WooCommerce, Contact Form7, WP Pools e outros são compatíveis com a estrutura CSSHero.

Isso significa que o CSSHero não funciona apenas com theme customization , mas também com plugin layout customization .

Por último, mas não menos importante, no site oficial, há vários artigos detalhados de tips and tricks disponíveis para você ler.

Only Cons que eu poderia pensar é se familiarizar com todas as funcionalidades. Pode levar algum tempo para você começar e se tornar profissional. Quando você estiver familiarizado com o CSSHero, tenho certeza que será very handy solution para todos os blogueiros do WordPress.

Entre em contato conosco se você tiver um produto, plugin, tema, etc. que você acha que deseja promover.

Aqui estão as ofertas exclusivas do Crunchify para CSSHero:

Olá leitores do Crunchify –

Temos o prazer de anunciar up-to 40% off no plugin de personalização CSSHero WordPress Theme.

Por favor, dê uma olhada nas etapas abaixo

Passo 1

• Acesse o site CSSHero: https://www.csshero.org/
• Clique no link Pricing Plans

Passo 2

• Clique no botão I have a coupon code

Etapa 3

• Digite o código do cupom: CRUNCHIFY

Passo 4

• Clique no botão Resgatar para obter 34% off no plano inicial e pessoal
• Ganhe 40% off no plano Pro

Lista de todas as ofertas: https://crunchify.com/deals/