Criar um tema para crianças no WordPress Tutorial passo a passo

ela e rapidamente testar o tema, você não precisa de uma conexão com a internet o tempo todo. Com seu site WordPress local, você pode cometer erros sem afetar seu site ao vivo, e é uma maneira muito mais rápida e melhor.
Existem muitas maneiras de instalar o WordPress localmente no Windows, MAC ou Linux. Leia este tutorial para saber como instalar o WordPress em um computador local com a pilha WordPress Bitnami. Já publicamos um tutorial passo a passo para iniciantes. Como instalar o WordPress no servidor WAMP no Windows 8 Como instalar o WordPress no Windows 8 usando o Bitnami Stack como criar um tema filho no guia passo a passo do WordPress? Para cada tema filho no WordPress, dois arquivos são necessários. funções. Estilo php. css No ficheiro de estilo. css, podemos adicionar informações sobre nosso tema filho, por exemplo, nome do tema, descrição do tema, nome do autor, detalhes do tema pai, tags, etc.
Também precisamos de um ficheiro de funções. php para gravar a folha de estilo de tema pai e filho. Com o ficheiro de funções. php podemos adicionar novas funções, registrar novos menus de navegação, áreas de widget, etc Então vamos começar a criar o primeiro tema para a criança. Neste tema filho, não vamos adicionar novas zonas de widget, menus de navegação, etc. Vamos usar o tema filho para fazer algumas alterações CSS simples, vamos substituir os estilos CSS padrão. Você pode usar qualquer tema WordPress como tema pai, para este tutorial, vou criar um tema filho para TwentySixteen tema. Crie uma nova pasta e salve-a como twentysixteen-child ou você pode nomeá-la o que quiser, por exemplo, design.
Crie dois novos arquivos e salve-os como arquivos de funções. php e estilo. CSS na nossa pasta temática infantil. O nome da pasta dos meus filhos é designbomb. Agora adicione as seguintes informações ao arquivo de estilo. css do tema da criança e salve o arquivo. \/* Nome do tema: Design Child Descrição: Um tema infantil simples para blog de design. Autor: Tahir Taous Versão: 0.1 Modelo: twentysixteen *\/ Acu
m conectar ao painel do WordPress. Vá para Layout > Temas > Adicionar Novo e carregue este novo tema filho. Você verá um novo tema sem nenhuma captura de tela. Coloque o mouse sobre o tema e clique no botão Detalhes do tema.
Você verá os seguintes detalhes para o novo tema para a criança.

Detalhes do tema para crianças no painel do WordPress Na captura de tela acima, você pode ver todas as informações básicas sobre o tema do nosso filho. O nome do nosso tema para a criança, que é o autor deste tema, a descrição do tema da criança, e você também pode ver Este é um tema infantil de Twenty Dezesseis. mensagem. Adicionamos Template: vinte e dezesseis ao arquivo de estilo. CSS dos trabalhos de casa dos nossos filhos. Esta linha diz ao WordPress que vinte e dezesseis é o tema pai. Se você usar qualquer outro tema, substitua TwentySixteen pelo nome do tema pai.
Agora ative o novo tema para a criança e recarregue a primeira página. Você deve ver todo o conteúdo sem nenhum estilo. Não te preocupes, é normal. Isso ocorre porque não incluímos o arquivo de estilo. css do tema pai e filho Depois de ativar um novo tema secundário vá para Aparência > Editor e selecione o arquivo de funções. php (Funções do tema), adicione o seguinte código ao arquivo de funções. php e clique no botão Atualizar arquivo para salvar as alterações. Editor, seleccione o ficheiro de estilo. Shh. Vamos adicionar novos estilos. Adicione o seguinte estilo ao arquivo de estilo. css do tema da criança e salvar o arquivo. . Navegação principal. current-menu-item > a, . Navegação principal. current-menu-ancestor > a {font-weight: 700; background: bege; border-radius: 5px; color: #D2691E; box-shadow: 2px 1px 8px #815317; } recarregar o front-end do seu site e abra qualquer página. Alteramos os estilos padrão para o item de menu atual. Veja a imagem abaixo.

Estilo do item actual no menu com o tema filho Para o item actual por mim

Leave a Reply

Your email address will not be published. Required fields are marked *