Como criar facilmente um tema WordPress personalizado em 5 etapas

Deseja criar um tema WordPress personalizado para o site da sua pequena empresa?

O desenvolvimento de temas do WordPress costumava ser desafiador sem codificar o design do seu tema do zero ou contratar desenvolvedores caros. No entanto, atualmente, estão disponíveis poderosos plugins do WordPress que permitem criar temas visualmente usando a funcionalidade fácil de arrastar e soltar.

Este artigo mostrará como criar um tema WordPress do zero sem tocar em uma única linha de código.

Por que personalizar seu tema WordPress?

A internet está ocupada com milhões de sites competindo pela atenção do seu público-alvo. Uma forma de se destacar e mostrar que você é diferente é personalizar sua casa na web: seu site.

Como muitos proprietários de sites WordPress optam por temas iniciais, personalizar o seu pode ajudar seu site a se destacar de seus concorrentes. Além disso, com um tema WordPress personalizado, é mais fácil mostrar a personalidade da sua marca, adicionar recursos de geração de leads e melhorar a velocidade e o desempenho do seu site.

Como faço para criar um tema WordPress do zero?

A maioria dos temas do WordPress são feitos com linguagens de codificação HTML, CSS, PHP e JavaScript. Aprender esses idiomas leva tempo e treinamento, o que não é realista para muitos proprietários de sites.

Isso significa que uma de suas únicas opções é contratar um desenvolvedor ou agência de desenvolvimento para criar um tema personalizado para você. Consequentemente, o custo de um site WordPress personalizado pode chegar a milhares de dólares.

Outra opção é usar o SeedProd para criar seu próprio tema WordPress personalizado. Este poderoso plugin WordPress vem com uma interface fácil de arrastar e soltar que qualquer pessoa, mesmo iniciantes, pode usar para personalizar todos os aspectos do seu tema WordPress.

Por que você deve usar o SeedProd?

SeedProd é o plugin construtor de sites mais fácil de usar para WordPress.

Inclui amplas opções de personalização e oferece uma ampla variedade de recursos, incluindo:

• Construtor de temas WordPress
• Mais de 170 modelos de página de destino
• Kits de temas WordPress completos
• Construtor de arrastar e soltar
• Integrações de e-mail marketing
• Funcionalidade de importação/exportação
• Gerenciamento de assinantes
• Em breve e modo de manutenção
• e muito mais.

Anteriormente, você só podia usar o SeedProd para criar páginas de destino dentro do seu tema existente. Mas depois de várias atualizações que mudam o jogo, você pode criar temas WordPress inteiros com o mesmo construtor de arrastar e soltar.

Isso significa que você pode personalizar seu site de cima para baixo sem codificação, então vamos descobrir como fazer isso.

Criando um tema WordPress personalizado com SeedProd

Para este tutorial, vamos supor que você já tenha um site WordPress hospedado em um domínio. Caso contrário, você pode seguir este guia passo a passo sobre como criar um site WordPress.

Como o SeedProd substitui seu tema atual do WordPress pelo que você criará do zero, sugerimos usar um ambiente de desenvolvimento. Dessa forma, suas alterações não afetarão seu site ativo até que você esteja pronto para publicá-las.

Os serviços populares de hospedagem do WordPress, como o Bluehost, oferecem ambientes de teste e desenvolvimento com seus pacotes de hospedagem.

Além de criar um ambiente de teste, certifique-se de fazer backup do seu site antes de começar. Isso garantirá que você possa restaurar seu site se algo der errado. Veja este post para os melhores plugins de backup para WordPress.

Depois de preparar o acima, você pode começar a criar seu tema WordPress personalizado seguindo as etapas abaixo.

Etapa 1. Instale e ative o plug-in SeedProd

Para a primeira etapa, você precisa instalar e ativar o plug-in SeedProd em seu site WordPress. Siga este guia detalhado sobre como instalar um plugin do WordPress se precisar de ajuda com esta etapa.

Você precisará escolher a licença SeedProd Pro para desbloquear o recurso Theme Builder. Isso lhe dará uma chave de licença que você pode inserir na página de configurações do plug-in.

Para encontrar sua chave de licença, faça login em sua conta SeedProd, clique na guia Downloads e, em seguida, clique no ícone de cópia para salvar sua chave na área de transferência.

Depois, vá para o administrador do WordPress, navegue até SeedProd » Configurações e cole a chave no campo 'Chave de licença'. Em seguida, clique no botão Verificar chave para salvar suas alterações.

Agora, vá para a página SeedProd » Theme Builder , onde o SeedProd exibirá os diferentes elementos do seu tema.

Existem 2 maneiras diferentes de criar um tema WordPress personalizado com o SeedProd. Você pode criar cada parte do seu tema do zero ou usar um modelo pré-fabricado e personalizar cada parte para atender às necessidades do seu site.

Cada tema do WordPress consiste em várias partes chamadas de arquivos de modelo, incluindo:

• Cabeçalho
• Rodapé
• Postagem única
• Página Única
• Arquivo ou página do blog
• Procurar Resultados
• Parte global

Isso pode ser bastante avassalador se for a primeira vez que você cria um tema do zero. Por isso, recomendamos começar com um modelo de tema pré-fabricado.

O SeedProd possui vários modelos de temas responsivos que configuram sua estrutura de temas com um único clique. Ele gera cada arquivo de modelo automaticamente, mas também permite editar cada arquivo com suas próprias personalizações.

Para o restante deste guia, usaremos um modelo de tema para mostrar cada etapa do processo de personalização porque é a abordagem mais amigável para iniciantes para criar um tema personalizado.

Etapa 2. Escolha um modelo de tema do WordPress

Para visualizar todos os modelos de temas do SeedProd, clique no botão Temas .

Uma janela será aberta mostrando temas para diferentes tipos de sites, incluindo portfólios, viagens, lojas WooCommerce, imóveis, eventos e muito mais.

Usaremos o tema inicial para este tutorial, então passe o mouse sobre a imagem do tema e clique no ícone de marca de seleção laranja.

Assim que você clicar para importar o modelo de tema, o SeedProd irá gerar as partes do tema automaticamente.

Se você não precisar de uma parte de tema específica, desative-a clicando no botão de alternância sob o título Publicado para a posição 'Não'.

Você também pode alterar as condições de cada parte clicando no link 'Editar condições'.

Isso abrirá uma janela onde você pode escolher o nome da peça, tipo, prioridade e onde a peça deve aparecer em seu site.

Em muitos casos, você não precisará alterar essas configurações e pode ir direto para a personalização da aparência de cada parte.

Etapa 3. Personalize as partes do seu tema

Agora que as partes essenciais do seu tema estão configuradas, você pode personalizar seus designs para que tenham a aparência desejada. Para editar um arquivo de modelo, passe o cursor sobre ele e clique no link 'Editar design'.

Personalizaremos as partes de cabeçalho, rodapé, página inicial e blog para este guia. A personalização das outras partes do tema segue os mesmos princípios.

Personalizando o cabeçalho e rodapé do WordPress

Para personalizar seu cabeçalho, mova o cursor sobre o modelo de cabeçalho e clique em Editar design .

Na tela a seguir, você verá a interface do construtor de temas do SeedProd. Você pode apontar e clicar em qualquer lugar na visualização ao vivo para ver as configurações de cada elemento no painel esquerdo.

Vamos começar clicando no logotipo padrão do SeedProd para abrir as configurações do bloco de imagem. No painel de configurações de conteúdo, você pode clicar no ícone da lixeira para excluir a imagem padrão e fazer upload de um novo logotipo do seu computador ou da biblioteca de mídia do WordPress.

No mesmo painel, você pode alterar o tamanho da imagem, o alinhamento e dar ao seu logotipo um link personalizado. Por exemplo, você pode redirecionar os visitantes que clicam em seu logotipo para sua página inicial.

Você também pode alterar a cor de fundo do cabeçalho clicando no ícone de configurações de linha. A partir daí, você pode adicionar uma imagem de plano de fundo, cor ou gradiente de plano de fundo personalizado.

Em seguida, clique no bloco de menu em sua visualização ao vivo para personalizar seu menu de navegação. O SeedProd usa o bloco Nav Menu para esta seção por padrão, que possui 2 opções de menu diferentes:

• Simples: adicione links de menu individualmente na interface do construtor
• Menu WordPress : use o menu nativo do WordPress para mostrar sua navegação

Depois de escolher o tipo de menu, você pode clicar na guia Avançado e alterar as cores do link do menu, a tipografia, os estilos e muito mais.

Quando estiver satisfeito com o design do seu cabeçalho, clique no botão Salvar no canto superior direito e clique no ícone 'X' para sair do construtor de temas.

Agora, você pode seguir as mesmas etapas para personalizar seu rodapé do WordPress e, quando terminar, poderá editar sua página inicial.

Personalizando sua página inicial do WordPress

A página inicial do seu site é a primeira página do seu site e normalmente inclui elementos essenciais que definem o seu negócio. Por exemplo, detalhes sobre quem você é, o que você faz, avaliações e depoimentos e informações de contato.

O modelo que estamos usando inclui as seguintes seções da página inicial:

• Herói
• Características
• Depoimentos
• Perguntas frequentes

Você pode alterar todos os aspectos desta página, incluindo layout, imagens, conteúdo, botões e muito mais. Dê uma olhada neste exemplo rápido para ver como é fácil editar diferentes partes da sua página inicial:

Você pode usar os blocos e seções do lado esquerdo para editar sua página inicial até ficar satisfeito com a aparência de tudo. Por exemplo, você pode adicionar classificações por estrelas, mapas do Google, formulários de pesquisa e muitos outros elementos do site.

Também é importante verificar a versão móvel da sua página inicial.

Se a versão móvel do seu site não parecer correta, você poderá continuar editando-a até que fique perfeita.

Quando estiver satisfeito com o design da sua página inicial, salve suas alterações e retorne ao painel do construtor de temas SeedProd.

Estilizando sua página de blog personalizada

A próxima parte do tema que personalizaremos é a página do blog. No painel do construtor de temas, procure o título Blog, Índice, Arquivos, Pesquisar e clique no link Editar design .

Nesta página, você pode adicionar, remover e mover diferentes elementos, como o conteúdo da postagem do blog, a imagem em destaque, o trecho e a biografia do autor.

Por padrão, este modelo usa o bloco Posts para mostrar uma lista de postagens recentes do blog, então clique nele para mostrar as diferentes configurações que você pode configurar.

No painel de configurações de postagens, você pode escolher o tipo de postagem do blog para exibir e mostrar ou ocultar informações como paginação, meta, detalhes do autor, contagem de comentários e muito mais.

Depois de personalizar a página do seu blog, clique no botão Salvar e retorne ao painel do construtor de temas.

Definindo suas configurações globais

A última parte do modelo que veremos controla as configurações globais de estilo para os botões, cores, tipografia e layout do seu tema. Procure a parte Global CSS e clique no link Editar design para abrir as configurações.

Você pode expandir cada guia nesta tela e personalizar as diferentes configurações.

Por exemplo, você pode abrir a guia Botão e personalizar o estilo padrão de cada botão em seu site.

Além disso, você pode alterar as fontes, layout, plano de fundo e adicionar CSS personalizado ao seu tema WordPress. Cada alteração que você faz é aplicada em todo o seu site automaticamente.

Lembre-se de clicar no botão Salvar para salvar suas alterações antes de prosseguir.

Etapa 4. Conecte seu serviço de marketing por e-mail

Se você usou o formulário de inscrição ou o bloco de formulário de contato no design do seu tema, precisará de uma maneira de adicionar novos contatos à sua lista de e-mail. Felizmente, o SeedProd se integra diretamente aos serviços populares de marketing por e-mail para facilitar isso.

Você pode encontrar as integrações de e-mail do SeedProd clicando na guia Conectar ao editar qualquer design. A partir daí, você pode encontrar seu serviço de marketing por e-mail e seguir as instruções na tela para se conectar.

Além de se integrar diretamente aos serviços de e-mail, o SeedProd pode armazenar contatos em seu painel de assinantes integrado. Isso é útil se você está começando a construir sua lista de e-mail e ainda não escolheu um provedor.

Etapa 5. Publique seu tema WordPress personalizado

Agora que você personalizou seu tema WordPress personalizado, é hora de torná-lo ativo em seu site. Para fazer isso, vá para o painel do construtor de temas e gire a alternância ao lado do tema Ativar SeedProd para a posição 'Ligado'.

Depois, você pode acessar o front-end do seu site e ver seu novo tema WordPress personalizado.

Aí está!

Esperamos que este post tenha ajudado você a aprender como criar um tema WordPress do zero sem codificação.

Você sabia que o SeedProd também inclui um bloco RafflePress? Adicionar brindes do RafflePress em qualquer lugar em seu design de tema personalizado torna super fácil aumentar o tráfego, leads e seguidores de mídia social.

Pronto para mergulhar?

Comece com o SeedProd aqui e obtenha sua cópia do RafflePress aqui.

Se você gostou deste artigo, assine nosso canal do YouTube para tutoriais em vídeo do RafflePress. Você também pode nos encontrar no Twitter e no Facebook.