{"id":4185,"date":"2020-06-09T00:00:00","date_gmt":"2020-06-09T00:00:00","guid":{"rendered":"https:\/\/rockcontent.com\/br\/2020\/06\/09\/criar-tema-wordpress\/"},"modified":"2025-09-19T11:59:34","modified_gmt":"2025-09-19T14:59:34","slug":"criar-tema-wordpress","status":"publish","type":"post","link":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/","title":{"rendered":"Como criar tema WordPress: confira aqui o passo a passo"},"content":{"rendered":"<p>Criar um tema no <a rel=\"noreferrer noopener\" href=\"https:\/\/pingback.com\/br\/resources\/wordpress\/\" target=\"_blank\">WordPress<\/a> pode ser muito simples, se voc\u00ea conhece alguns conceitos de HTML, <a href=\"https:\/\/pingback.com\/br\/resources\/css\/\">CSS<\/a> e JavaScrip. Apesar disso, alguns iniciantes com a orienta\u00e7\u00e3o correta tamb\u00e9m podem se aventurar. Basta ter um ambiente de desenvolvimento devidamente configurado e o <a rel=\"noreferrer noopener\" href=\"https:\/\/pingback.com\/br\/resources\/como-escolher-um-cms\/\" target=\"_blank\">CMS (Content Management System)<\/a> instalado.<\/p>\n<p>O WordPress \u00e9 um dos sistemas de <a href=\"https:\/\/pingback.com\/br\/resources\/cms\/\" rel=\"noreferrer noopener\" target=\"_blank\">gerenciamento de conte\u00fado<\/a> de c\u00f3digo aberto mais usados em todo o mundo \u2014 cerca de <a href=\"https:\/\/w3techs.com\/technologies\/details\/cm-wordpress\" rel=\"noreferrer noopener\" target=\"_blank\">34,7% dos sites s\u00e3o ambientados<\/a> nele. Tem ferramentas de constru\u00e7\u00e3o de sites e permite adicionar v\u00e1rias funcionalidades, por meio de plugins e outros recursos que <strong>personalizam o layout, aumentam o desempenho e garantem uma experi\u00eancia qualificada<\/strong> para o seu p\u00fablico.<\/p>\n<p>Neste artigo, apresentamos os primeiros passos para criar um tema em WordPress para que voc\u00ea consiga ter um site com aspectos exclusivos. Veja o que vamos ensinar:<\/p>\n<ul class=\"wp-block-list\">\n<li><strong>Quais os requisitos para criar um tema no WordPress?<\/strong><\/li>\n<li><strong>Quais os principais passos para criar o tema na plataforma?<\/strong><\/li>\n<li><strong>Quais ferramentas podem facilitar a cria\u00e7\u00e3o de temas no WordPress?<\/strong><\/li>\n<\/ul>\n<p>Vamos l\u00e1?<\/p>\n<h2 class=\"wp-block-heading\">Quais s\u00e3o os requisitos para criar um tema no WordPress?<\/h2>\n<p>Para criar o tema no WordPress, voc\u00ea deve ter um ambiente de desenvolvimento configurado com Apache, PHP, <a rel=\"noreferrer noopener\" href=\"https:\/\/pingback.com\/br\/resources\/mysql\/\" target=\"_blank\">MySQL<\/a> e WordPress instalados. O download do WordPress \u00e9 feito na <a href=\"https:\/\/wordpress.org\/download\">p\u00e1gina oficial<\/a> \u2014 voc\u00ea deve atualizar as credenciais do banco de dados.<\/p>\n<p>Voc\u00ea tamb\u00e9m precisa conhecer a estrutura do tema. Um tema para WordPress \u00e9 basicamente uma p\u00e1gina normal, criada em <a href=\"https:\/\/pingback.com\/br\/resources\/html\/\">HTML<\/a> e, assim como qualquer outra, \u00e9 formada pelos arquivos:<\/p>\n<ul class=\"wp-block-list\">\n<li><strong>header.php<\/strong>: armazena o c\u00f3digo do cabe\u00e7alho;<\/li>\n<li><strong>footer.php<\/strong>: armazena o c\u00f3digo do rodap\u00e9;<\/li>\n<li><strong>sidebar.php<\/strong>: local onde s\u00e3o configurados os bot\u00f5es adicionados na lateral da p\u00e1gina;<\/li>\n<li><strong>style.css<\/strong>: controla a apresenta\u00e7\u00e3o visual do tema;<\/li>\n<li><strong>index.php<\/strong>: incorpora as configura\u00e7\u00f5es exibidas na p\u00e1gina inicial;<\/li>\n<li><strong>single.php<\/strong>: cont\u00e9m c\u00f3digos que mostram o artigo na sua pr\u00f3pria p\u00e1gina;<\/li>\n<li><strong>page.php<\/strong>: cont\u00e9m c\u00f3digos que mostram o conte\u00fado de uma p\u00e1gina \u00fanica;<\/li>\n<li><strong>archive.php<\/strong>: exibe a listagem de artigos que est\u00e3o no arquivo, as categorias criadas pelo usu\u00e1rio;<\/li>\n<li><strong>functions.php<\/strong>: local onde ficam algumas fun\u00e7\u00f5es que adicionam mais funcionalidades aos temas, como logomarca, menus, cor, thumbnails, scripts e stylesheets;<\/li>\n<li><strong>404.php<\/strong>: <a href=\"https:\/\/pingback.com\/br\/resources\/erro-de-http-wordpress\/\" rel=\"noreferrer noopener\" target=\"_blank\">c\u00f3digo de erro<\/a> que exibe que o arquivo requisitado n\u00e3o foi encontrado.<\/li>\n<\/ul>\n<p>Al\u00e9m disso, voc\u00ea precisar\u00e1 <strong>integrar algumas configura\u00e7\u00f5es do <a href=\"https:\/\/pingback.com\/br\/resources\/bootstrap\/\">Bootstrap<\/a> para customizar o seu <a href=\"https:\/\/pingback.com\/br\/resources\/template\/\">template<\/a><\/strong>. Neste artigo, ensinamos o primeiro passo a passo at\u00e9 essa customiza\u00e7\u00e3o. Veja, a seguir.<\/p>\n<h2 class=\"wp-block-heading\">Quais s\u00e3o os principais passos para criar o tema na plataforma?<\/h2>\n<p>Abaixo, est\u00e3o algumas etapas para voc\u00ea criar o tema para WordPress at\u00e9 que ele possa ser personalizado.<\/p>\n<h3 class=\"wp-block-heading\">Crie uma pasta para armazenar os arquivos que ser\u00e3o adicionados<\/h3>\n<p>Se vamos construir um novo tema, precisamos saber onde os arquivos que o comp\u00f5em ficar\u00e3o em sua instala\u00e7\u00e3o local. Isso \u00e9 bem f\u00e1cil.<\/p>\n<p>Sabemos que uma instala\u00e7\u00e3o do WordPress, normalmente, tem um diret\u00f3rio raiz, tamb\u00e9m chamado wordpress. Nesse diret\u00f3rio, est\u00e3o os arquivos e pastas que mostraremos a seguir.<\/p>\n<h4 class=\"wp-block-heading\">Arquivos<\/h4>\n<ul class=\"wp-block-list\">\n<li>composer.json<\/li>\n<li>index.php<\/li>\n<li>license.txt<\/li>\n<li>readme.html<\/li>\n<li>wp-activate.php<\/li>\n<li>wp-blog-header.php<\/li>\n<li>wp-comments-post.php<\/li>\n<li>wp-config.php<\/li>\n<li>wp-config-sample.php<\/li>\n<li>wp-cron.php<\/li>\n<li>wp-links-opml.php<\/li>\n<li>wp-load.php<\/li>\n<li>wp-login.php<\/li>\n<li>wp-mail.php<\/li>\n<li>wp-settings.php<\/li>\n<li>wp-signup.php<\/li>\n<li>wp-trackback.php<\/li>\n<li>xmlrpc.php<\/li>\n<\/ul>\n<h4 class=\"wp-block-heading\">Pastas<\/h4>\n<ul class=\"wp-block-list\">\n<li>wp-admin<\/li>\n<li>wp-content<\/li>\n<li>wp-includes<\/li>\n<\/ul>\n<p>A pasta que buscamos \u00e9 a wp-content, local <strong>onde ficam armazenados os temas e os plugins<\/strong>. Logo, dentro dela, h\u00e1 uma pasta chamada themes, que deve conter todos os temas do <a href=\"https:\/\/pingback.com\/br\/resources\/como-criar-um-site\/\" rel=\"noreferrer noopener\" target=\"_blank\">seu site WordPress<\/a>, inclusive o que voc\u00ea criar\u00e1, para que o CMS reconhe\u00e7a as novas configura\u00e7\u00f5es.<\/p>\n<figure class=\"wp-block-image\"><img data-opt-id=1735025276  fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/www.wptotal.com\/wp-content\/uploads\/2012\/01\/conteudo-importante.png\" alt=\"criar tema wordpress\"\/><\/figure>\n<p>Na pasta de themes, j\u00e1 est\u00e3o armazenadas outras tr\u00eas pastas nativas, que cont\u00eam tr\u00eas <a href=\"https:\/\/pingback.com\/br\/resources\/illdy-theme\/\" rel=\"noreferrer noopener\" target=\"_blank\">temas<\/a> padr\u00e3o, fornecidos pelo WordPress. Al\u00e9m delas, voc\u00ea deve criar outra pasta, que poder\u00e1 chamar como quiser.<\/p>\n<p>No exemplo abaixo, a pasta se chama customtheme. A partir dessa unidade, o novo tema para WordPress ser\u00e1 criado.<\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img data-opt-id=1377863874  fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/vegibit.com\/wp-content\/uploads\/2017\/06\/wordpress-themes-folder.png\" alt=\"criar tema wordpress\"\/><\/figure>\n<\/div>\n<p><strong>\u00c9 imprescind\u00edvel que seu novo tema esteja dentro da pasta &#8220;themes&#8221;<\/strong>. Dessa forma, \u00e9 poss\u00edvel ativa-lo e us\u00e1-lo online.<\/p>\n<h3 class=\"wp-block-heading\">Crie os arquivos style.css e index.php<\/h3>\n<p>Todo tema para WordPress tem uma s\u00e9rie de <strong>arquivos obrigat\u00f3rios para funcionar corretamente<\/strong>. Na sua nova pasta dentro de Themes, crie dois arquivos:<\/p>\n<ul class=\"wp-block-list\">\n<li><strong>style.css<\/strong>. \u2014 arquivo demonstra\u00e7\u00e3o do WP usado para informar nome do autor, reposit\u00f3rio e vers\u00e3o do tema;<\/li>\n<li><strong>index.php<\/strong>. \u2014 arquivo principal, por meio do qual o WP carrega os posts que ser\u00e3o exibidos na tela. Al\u00e9m disso, ele \u00e9 utilizado pelo wp sempre que falta um arquivo base do WP.<\/li>\n<\/ul>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img data-opt-id=1922624099  fetchpriority=\"high\" decoding=\"async\" src=\"https:\/\/vegibit.com\/wp-content\/uploads\/2017\/06\/indexphp-and-stylecss-files.png\" alt=\"criar tema wordpress\"\/><\/figure>\n<\/div>\n<h4 class=\"wp-block-heading\">style.css<\/h4>\n<p>O style.css \u00e9 um arquivo CSS declarativo e necess\u00e1rio para todos os temas do WordPress. <strong>Controla a apresenta\u00e7\u00e3o (design visual e layout) das p\u00e1ginas do site<\/strong>, ou seja, nesse arquivo, voc\u00ea especificar\u00e1 informa\u00e7\u00f5es sobre o tema: nome do tema, autor, p\u00e1gina do autor e o n\u00famero de vers\u00e3o (nesse caso, em que n\u00e3o foram feitas atualiza\u00e7\u00f5es, e sim uma cria\u00e7\u00e3o de tema do zero, voc\u00ea pode atribuir o n\u00famero 1), por exemplo.<\/p>\n<p>Essas informa\u00e7\u00f5es precisam ser escritas de forma padronizada, para que o WP consiga identific\u00e1-las, assim como especificamos abaixo:<\/p>\n<p><em>\/*<\/em><\/p>\n<p><em>Theme name: nome do tema (na listagem aparecer\u00e1 esse nome);<\/em><\/p>\n<p><em>Theme URI: site que pode ser criado para demonstrar as funcionalidades do tema, pode ainda, conter um formul\u00e1rio para que as pessoas consigam compr\u00e1-lo;<\/em><\/p>\n<p><em>Author: escreva seu nome, para que as pessoas possam contact\u00e1-lo caso tenham interesse no seu tema;<\/em><\/p>\n<p><em>Author URI: se voc\u00ea tiver um site pr\u00f3prio, pode adicion\u00e1-lo nessa linha do c\u00f3digo;<\/em><\/p>\n<p><em>Github Theme URI: \u00e9 interessante adicionar o tema no GitHud para que nesse ambiente colaborativo os usu\u00e1rios possam adicionar novas funcionalidades, sugerir melhorias e tirar d\u00favidas, por exemplo;<\/em><\/p>\n<p><em>Description: adicione informa\u00e7\u00f5es do tema, se ele \u00e9 indicado para um tipo espec\u00edfico de neg\u00f3cio, blog, <\/em><a href=\"https:\/\/pingback.com\/br\/resources\/e-commerce-guia\/\" rel=\"noreferrer noopener\" target=\"_blank\"><em>e-commerce<\/em><\/a><em>, etc.;<\/em><\/p>\n<p><em>Version: 1. 0. 0.;<\/em><\/p>\n<p><em>Text domain: \u00e9 importante para traduzir o tema para outros idiomas.<\/em><\/p>\n<p><em>*\/<\/em><\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img data-opt-id=1538154604  decoding=\"async\" src=\"https:\/\/mlgzkyrbq6eh.i.optimole.com\/cb:AiM1.588\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/pingback.com\/br\/resources\/wp-content\/uploads\/2020\/06\/image-6.png\" alt=\"criar tema wordpress\" class=\"wp-image-51772\"\/><\/figure>\n<\/div>\n<h4 class=\"wp-block-heading\">index.php<\/h4>\n<p>Esse arquivo \u00e9 respons\u00e1vel por<strong> listar todos os <\/strong><a href=\"https:\/\/pingback.com\/br\/resources\/como-criar-um-blog\/\" rel=\"noreferrer noopener\" target=\"_blank\"><strong>posts do blog<\/strong><\/a>. \u00c9 preciso usar fun\u00e7\u00f5es nativas do WP para mostr\u00e1-los na tela. Desenvolvedores est\u00e3o acostumados a conectar bancos de dados e fazer querys para pegar o conte\u00fado e exibi-los, mas, nesse caso, j\u00e1 existem fun\u00e7\u00f5es nativas no WordPress.<\/p>\n<p>Crie o arquivo index.php e escreva na linha de comando qualquer coisa, apenas para conferir se ele aparecer\u00e1 no seu tema ao ativ\u00e1-lo.<\/p>\n<p><strong>&lt;h1&gt;Ol\u00e1 mundo!&lt;\/h1&gt;<\/strong><\/p>\n<p>ou<\/p>\n<p><strong>&lt;h1&gt;Custom Theme!&lt;\/h1&gt; <\/strong>como, no nosso exemplo abaixo:<\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img data-opt-id=627455522  decoding=\"async\" src=\"https:\/\/vegibit.com\/wp-content\/uploads\/2017\/06\/wordpress-custom-theme.png\" alt=\"criar tema wordpress\"\/><\/figure>\n<\/div>\n<h3 class=\"wp-block-heading\">Ative o tema no painel do WordPress<\/h3>\n<p>Acesse o Painel do WordPress, clique em &#8220;Apar\u00eancia&#8221;, depois em &#8220;Temas&#8221;, e verifique se o tema criado estar\u00e1 entre as op\u00e7\u00f5es exibidas.<\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img data-opt-id=974677725  decoding=\"async\" src=\"https:\/\/vegibit.com\/wp-content\/uploads\/2017\/06\/wordpress-appearance-themes-link.png\" alt=\"criar tema wordpress\"\/><\/figure>\n<\/div>\n<p>Clique em &#8220;Detalhes do tema&#8221; para conferir se as informa\u00e7\u00f5es inseridas no arquivo <strong>style.css<\/strong> funcionam corretamente.<\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img data-opt-id=774385372  decoding=\"async\" src=\"https:\/\/vegibit.com\/wp-content\/uploads\/2017\/06\/wordpress-theme-details.png\" alt=\"criar tema wordpress\"\/><\/figure>\n<\/div>\n<p>Clique em &#8220;Ativar&#8221; para que o novo tema seja ativado pelo WP e, em seguida, visite o site para conferir se as configura\u00e7\u00f5es foram implementadas.<\/p>\n<h3 class=\"wp-block-heading\">Altere as configura\u00e7\u00f5es do arquivo index.php<\/h3>\n<p>Volte para a linha de comando do index.php e apague o texto que voc\u00ea escreveu apenas para conferir o funcionamento do seu tema. Agora, voc\u00ea deve escrever uma linha de comando para que o WP busque os posts do banco de dados e envie-os para a p\u00e1gina.<\/p>\n<p>O objetivo \u00e9 resgatar o t\u00edtulo da postagem e seu conte\u00fado para que todos os arquivos sejam visualizados na p\u00e1gina inicial.<\/p>\n<p>O comando &#8220;have_posts&#8221; informa ao WP que ele deve vasculhar o banco de dados em busca dos posts do <a href=\"https:\/\/pingback.com\/br\/resources\/como-criar-um-blog\/\">blog<\/a>. Se houver posts, ele exibir\u00e1 na p\u00e1gina. Se n\u00e3o houver, ele mostra a mensagem que escrevemos no c\u00f3digo para a condi\u00e7\u00e3o negativa de resposta (falso).<\/p>\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img data-opt-id=259442544  decoding=\"async\" src=\"https:\/\/vegibit.com\/wp-content\/uploads\/2017\/06\/example-wordpress-posts-in-database.png\" alt=\"criar tema wordpress\"\/><\/figure>\n<\/div>\n<p>Existe uma fun\u00e7\u00e3o chamada &#8220;the_post&#8221; que deve ser adicionada ao loop whiledo &#8220;have_posts&#8221;, para que o WP exiba aquele arquivo sempre que identificar verdadeiro para a condi\u00e7\u00e3o &#8220;have_posts&#8221;. Por meio desse loop, o WordPress verifica a exist\u00eancia de postagens e as exibe na p\u00e1gina, conforme necess\u00e1rio.<\/p>\n<p>Na pr\u00e1tica, funciona da seguinte forma: se no banco de dados h\u00e1 postagens, todos os comandos dentro do loop ser\u00e3o executados para todos os arquivos de post encontrados e enquanto elas forem encontradas. Caso contr\u00e1rio, o WP informa ao usu\u00e1rio de que n\u00e3o h\u00e1 postagens. Veja o c\u00f3digo abaixo:<\/p>\n<pre class=\"wp-block-code\"><code>&lt;?php\n\n if ( have_posts() ) :\n\n\twhile ( have_posts() ) : the_post(); ?>\n\n         &lt;h2>&lt;a href=\"&lt;?php the_permalink() ?>\">&lt;?php the_title() ?>&lt;\/a>&lt;\/h2>\n\n &lt;?php the_content() ?>\n\n &lt;?php endwhile;\n\n else :\n\n\techo '&lt;p>There are no posts!&lt;\/p>';\n\n endif;\n\n ?><\/code><\/pre>\n<p>Observe que nesse loop s\u00e3o usadas duas fun\u00e7\u00f5es em sua forma mais b\u00e1sica: &#8220;have_posts&#8221; e &#8220;the_post&#8221;. A fun\u00e7\u00e3o &#8220;have_posts&#8221; informa se h\u00e1 alguma postagem no banco de dados para repetir. Essa fun\u00e7\u00e3o retornar\u00e1 verdadeiro ou falso: se retornar verdadeiro, \u00e9 porque h\u00e1 postagens dispon\u00edveis para exibir. Se retornar falso, n\u00e3o haver\u00e1.<\/p>\n<p>J\u00e1 a fun\u00e7\u00e3o, &#8220;the_post&#8221; recupera a postagem mais recente e faz as configura\u00e7\u00f5es necess\u00e1rias para que elas sejam <strong>exibidas de forma <\/strong><a href=\"https:\/\/pingback.com\/br\/resources\/frequencia-de-postagem\/\" rel=\"noreferrer noopener\" target=\"_blank\"><strong>cronol\u00f3gica<\/strong><\/a><strong> na p\u00e1gina do tema<\/strong>. Como isso acontece em um loop, sempre que a fun\u00e7\u00e3o retorna verdadeiro, ou seja, toda vez que houver um novo post, ele ser\u00e1 adicionado automaticamente.<\/p>\n<p>A fun\u00e7\u00e3o &#8220;the_content&#8221; anexa o conte\u00fado ao t\u00edtulo do arquivo inserido na p\u00e1gina. J\u00e1 a fun\u00e7\u00e3o &#8220;the_permalink&#8221; <a href=\"https:\/\/pingback.com\/br\/resources\/link-building\/\" rel=\"noreferrer noopener\" target=\"_blank\">vincula um link<\/a> a cada postagem individual, para que o usu\u00e1rio acesse o conte\u00fado por conta pr\u00f3pria e sem que o texto completo seja exibido na p\u00e1gina inicial.<\/p>\n<p>Caso voc\u00ea queira adicionar um breve resumo embaixo do t\u00edtulo do arquivo, com os 200 primeiros caracteres do conte\u00fado, basta inserir a fun\u00e7\u00e3o &#8220;the_excerpt&#8221; no lugar da fun\u00e7\u00e3o &#8220;the_content&#8221;. Assim, o usu\u00e1rio somente tem acesso ao texto completo ao clicar no link.<\/p>\n<p>Nesse caso, voc\u00ea ter\u00e1 que criar um novo arquivo na pasta do seu tema, similar ao &#8220;index.php&#8221; (inclusive com a mesma linha de c\u00f3digo \u2014 basta copiar e colar o loop do index.php e trocar a fun\u00e7\u00e3o &#8220;the_excerpt&#8221; para &#8220;the_content&#8221; ).<\/p>\n<h3 class=\"wp-block-heading\">Adicione cabe\u00e7alho e rodap\u00e9<\/h3>\n<p>O pr\u00f3ximo passo \u00e9 criar, na mesma pasta do seu tema, onde voc\u00ea adicionou os arquivos style.css e index.php, novos arquivos. Eles s\u00e3o chamados header.php e footer.php.<\/p>\n<figure class=\"wp-block-image\"><img data-opt-id=1456972176  decoding=\"async\" src=\"https:\/\/vegibit.com\/wp-content\/uploads\/2017\/06\/header-and-footer-php-files.png\" alt=\"criar tema wordpress\"\/><\/figure>\n<p>\u00c9 uma boa pr\u00e1tica incluir sempre o wp_head nos seus temas, uma vez que essa \u00e9 uma fun\u00e7\u00e3o especial que finaliza a sa\u00edda na se\u00e7\u00e3o &lt;head&gt; do seu arquivo header.php. Deve ser usado antes da tag de fechamento &lt;\/head&gt;, principalmente para <strong>facilitar a <\/strong><a href=\"https:\/\/pingback.com\/br\/resources\/melhores-plugins-de-wordpress\/\" rel=\"noreferrer noopener\" target=\"_blank\"><strong>adi\u00e7\u00e3o dos plugins ao site<\/strong><\/a>, que podem contar com esse gancho para adicionar estilos, scripts ou meta elementos \u00e0 \u00e1rea &lt;head&gt;.<\/p>\n<h3 class=\"wp-block-heading\">Footer.php<\/h3>\n<p>O footer.php pode fechar as tags usadas nas fun\u00e7\u00f5es, como descrito a seguir:<\/p>\n<figure class=\"wp-block-image\"><img data-opt-id=1485869402  decoding=\"async\" src=\"https:\/\/mlgzkyrbq6eh.i.optimole.com\/cb:AiM1.588\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/pingback.com\/br\/resources\/wp-content\/uploads\/2020\/06\/image-7.png\" alt=\"criar tema wordpress\" class=\"wp-image-51771\"\/><\/figure>\n<h3 class=\"wp-block-heading\">Crie a pasta functions.php<\/h3>\n<p>Nesse ponto, foram adicionadas quatro pastas de arquivos ao tema personalizado: index.php, style.css, header.php e footer.php. O pr\u00f3ximo arquivo que voc\u00ea deve criar se chama functions.php, que <strong>adiciona personalidade ao WordPress<\/strong>, uma vez que a sua linha de comando pode modificar o comportamento padr\u00e3o do CMS. Tem as seguintes caracter\u00edsticas:<\/p>\n<ul class=\"wp-block-list\">\n<li>n\u00e3o requer texto de cabe\u00e7alho exclusivo;<\/li>\n<li>funciona apenas quando est\u00e1 no diret\u00f3rio do tema ativado;<\/li>\n<li>aplica-se apenas ao tema atual;<\/li>\n<\/ul>\n<p>Esse c\u00f3digo incluir\u00e1 ou ativar\u00e1 o stylesheet do seu tema personalizado:<\/p>\n<figure class=\"wp-block-image\"><img data-opt-id=852295484  decoding=\"async\" src=\"https:\/\/mlgzkyrbq6eh.i.optimole.com\/cb:AiM1.588\/w:auto\/h:auto\/q:mauto\/f:best\/https:\/\/pingback.com\/br\/resources\/wp-content\/uploads\/2020\/06\/image-8.png\" alt=\"criar tema wordpress\" class=\"wp-image-51773\"\/><\/figure>\n<h2 class=\"wp-block-heading\">Quais ferramentas podem facilitar a cria\u00e7\u00e3o de temas no WordPress?<\/h2>\n<p>Pronto, seu tema foi criado e funciona corretamente com os links que direcionam o usu\u00e1rio para uma p\u00e1gina exclusiva para cada post. Al\u00e9m disso, voc\u00ea j\u00e1 adicionou o cabe\u00e7alho, o rodap\u00e9 e o stylesheet do seu tema personalizado.<\/p>\n<p>Mas voc\u00ea ainda deve adicionar outros requisitos na sua p\u00e1gina, para que o template tenha caracter\u00edsticas exclusivas. Muitas pessoas acreditam que a funcionalidade do tema \u00e9 exclusivamente est\u00e9tica, mas eles tamb\u00e9m t\u00eam um<strong> enorme impacto na performance de um site<\/strong>.<\/p>\n<p>Para realizar essas personaliza\u00e7\u00f5es, \u00e9 necess\u00e1rio usar hooks \u2014 trechos de c\u00f3digo inseridos em arquivos de modelo (como o index.php ou functions.php), que permitem executar a\u00e7\u00f5es PHP em diferentes \u00e1reas de um site, inserir estilo e exibir outras informa\u00e7\u00f5es.<\/p>\n<p>A maioria dos hooks \u00e9 implementada diretamente no n\u00facleo do WordPress, mas alguns tamb\u00e9m s\u00e3o \u00fateis para desenvolvedores de temas. O hook &#8220;after_setup_theme&#8221;, por exemplo, ativa as imagens destacadas (thumbnails) para cada post, adiciona logomarca para o site e menus no header.php e footer.php. Tamb\u00e9m existem outros hooks, como descrevemos abaixo:<\/p>\n<ul class=\"wp-block-list\">\n<li>wp_head \u2014 adicionado ao elemento &lt;head&gt; no header.php, habilita estilos, scripts e outras informa\u00e7\u00f5es que s\u00e3o executadas assim que o site \u00e9 carregado;<\/li>\n<li>wp_footer \u2014 adicionado ao footer.php logo antes da tag &lt;\/body&gt;, para que sejam inseridas informa\u00e7\u00f5es do <a href=\"https:\/\/pingback.com\/br\/resources\/google-analytics\/\" rel=\"noreferrer noopener\" target=\"_blank\">Google Analytics<\/a>, por exemplo;<\/li>\n<li>wp_meta \u2014 inclu\u00eddo no sidebar.php, para inserir scripts, como nuvem de tags;<\/li>\n<li>comment_form \u2014 inserido ao comments.php antes do &lt;\/div&gt; (tag de fechamento do arquivo) para exibir os coment\u00e1rios da p\u00e1gina.<\/li>\n<\/ul>\n<p>Neste tutorial, voc\u00ea aprendeu o b\u00e1sico sobre como criar tema em WordPress. Como o design do site tamb\u00e9m \u00e9 importante, principalmente para <a href=\"https:\/\/materiais.rockcontent.com\/guia-definitivo-blog-corporativo\" rel=\"noreferrer noopener\" target=\"_blank\">aplica\u00e7\u00f5es corporativas<\/a>, voc\u00ea pode adicionar linhas de c\u00f3digos de templates prontos no Bootstrap, que podem facilitar todo o processo de adi\u00e7\u00e3o de novas caracter\u00edsticas e funcionalidades para sua p\u00e1gina.<\/p>\n<p>Veja como \u00e9 f\u00e1cil <a href=\"https:\/\/pingback.com\/br\/resources\/traduzir-o-tema-do-wordpress\/\" rel=\"noreferrer noopener\" target=\"_blank\">traduzir outros temas para o portugu\u00eas<\/a>, caso voc\u00ea prefira baixar um template pronto para WordPress!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Para criar tema em WordPress, \u00e9 preciso ter um ambiente de desenvolvimento devidamente configurado e o CMS instalado em seu computador. Basta copiar algumas linhas de c\u00f3digos em arquivos criados na pasta Themes do diret\u00f3rio raiz e executar os comandos para ver seu tema b\u00e1sico pronto!<\/p>\n","protected":false},"author":1,"featured_media":32080,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[22],"tags":[],"class_list":["post-4185","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tech"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.3.1 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Como criar tema WordPress: confira aqui o passo a passo<\/title>\n<meta name=\"description\" content=\"Criar um tema no WordPress pode ser uma tarefa dif\u00edcil. Mas com orienta\u00e7\u00e3o, iniciantes tamb\u00e9m podem se aventurar! Confira!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/\" \/>\n<meta property=\"og:locale\" content=\"pt_BR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Como criar tema WordPress: confira aqui o passo a passo\" \/>\n<meta property=\"og:description\" content=\"Criar um tema no WordPress pode ser uma tarefa dif\u00edcil. Mas com orienta\u00e7\u00e3o, iniciantes tamb\u00e9m podem se aventurar! Confira!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"Pingback\" \/>\n<meta property=\"article:published_time\" content=\"2020-06-09T00:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-09-19T14:59:34+00:00\" \/>\n<meta name=\"author\" content=\"Pingback\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@pingbackoficial\" \/>\n<meta name=\"twitter:site\" content=\"@pingbackoficial\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Pingback\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. tempo de leitura\" \/>\n\t<meta name=\"twitter:data2\" content=\"12 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/\",\"url\":\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/\",\"name\":\"Como criar tema WordPress: confira aqui o passo a passo\",\"isPartOf\":{\"@id\":\"https:\/\/pingback.com\/br\/resources\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#primaryimage\"},\"thumbnailUrl\":\"\",\"datePublished\":\"2020-06-09T00:00:00+00:00\",\"dateModified\":\"2025-09-19T14:59:34+00:00\",\"author\":{\"@id\":\"https:\/\/pingback.com\/br\/resources\/#\/schema\/person\/170478128352e2f21e2360c2e4944a66\"},\"description\":\"Criar um tema no WordPress pode ser uma tarefa dif\u00edcil. Mas com orienta\u00e7\u00e3o, iniciantes tamb\u00e9m podem se aventurar! Confira!\",\"breadcrumb\":{\"@id\":\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#breadcrumb\"},\"inLanguage\":\"pt-BR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#primaryimage\",\"url\":\"\",\"contentUrl\":\"\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"In\u00edcio\",\"item\":\"https:\/\/pingback.com\/br\/resources\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Como criar tema WordPress: confira aqui o passo a passo\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/pingback.com\/br\/resources\/#website\",\"url\":\"https:\/\/pingback.com\/br\/resources\/\",\"name\":\"Pingback Blog\",\"description\":\"Marketing for builders\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/pingback.com\/br\/resources\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"pt-BR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/pingback.com\/br\/resources\/#\/schema\/person\/170478128352e2f21e2360c2e4944a66\",\"name\":\"Pingback\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"pt-BR\",\"@id\":\"https:\/\/pingback.com\/br\/resources\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/70cde532238b4f8bf4a6e7e589ff0a259eda38fa966564ca7ed7d23e61c27774?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/70cde532238b4f8bf4a6e7e589ff0a259eda38fa966564ca7ed7d23e61c27774?s=96&d=mm&r=g\",\"caption\":\"Pingback\"},\"description\":\"Pingback: Marketing for builders.\",\"sameAs\":[\"https:\/\/pingback.com\",\"https:\/\/www.instagram.com\/pingbackoficial\/\",\"https:\/\/www.linkedin.com\/company\/pingbackoficial\/\",\"https:\/\/x.com\/pingbackoficial\",\"https:\/\/www.youtube.com\/@pingbackoficial\"],\"url\":\"https:\/\/pingback.com\/br\/resources\/author\/adm1n\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Como criar tema WordPress: confira aqui o passo a passo","description":"Criar um tema no WordPress pode ser uma tarefa dif\u00edcil. Mas com orienta\u00e7\u00e3o, iniciantes tamb\u00e9m podem se aventurar! Confira!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/","og_locale":"pt_BR","og_type":"article","og_title":"Como criar tema WordPress: confira aqui o passo a passo","og_description":"Criar um tema no WordPress pode ser uma tarefa dif\u00edcil. Mas com orienta\u00e7\u00e3o, iniciantes tamb\u00e9m podem se aventurar! Confira!","og_url":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/","og_site_name":"Pingback","article_published_time":"2020-06-09T00:00:00+00:00","article_modified_time":"2025-09-19T14:59:34+00:00","author":"Pingback","twitter_card":"summary_large_image","twitter_creator":"@pingbackoficial","twitter_site":"@pingbackoficial","twitter_misc":{"Escrito por":"Pingback","Est. tempo de leitura":"12 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/","url":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/","name":"Como criar tema WordPress: confira aqui o passo a passo","isPartOf":{"@id":"https:\/\/pingback.com\/br\/resources\/#website"},"primaryImageOfPage":{"@id":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#primaryimage"},"image":{"@id":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#primaryimage"},"thumbnailUrl":"","datePublished":"2020-06-09T00:00:00+00:00","dateModified":"2025-09-19T14:59:34+00:00","author":{"@id":"https:\/\/pingback.com\/br\/resources\/#\/schema\/person\/170478128352e2f21e2360c2e4944a66"},"description":"Criar um tema no WordPress pode ser uma tarefa dif\u00edcil. Mas com orienta\u00e7\u00e3o, iniciantes tamb\u00e9m podem se aventurar! Confira!","breadcrumb":{"@id":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#breadcrumb"},"inLanguage":"pt-BR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/"]}]},{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#primaryimage","url":"","contentUrl":""},{"@type":"BreadcrumbList","@id":"https:\/\/pingback.com\/br\/resources\/criar-tema-wordpress\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"In\u00edcio","item":"https:\/\/pingback.com\/br\/resources\/"},{"@type":"ListItem","position":2,"name":"Como criar tema WordPress: confira aqui o passo a passo"}]},{"@type":"WebSite","@id":"https:\/\/pingback.com\/br\/resources\/#website","url":"https:\/\/pingback.com\/br\/resources\/","name":"Pingback Blog","description":"Marketing for builders","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/pingback.com\/br\/resources\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"pt-BR"},{"@type":"Person","@id":"https:\/\/pingback.com\/br\/resources\/#\/schema\/person\/170478128352e2f21e2360c2e4944a66","name":"Pingback","image":{"@type":"ImageObject","inLanguage":"pt-BR","@id":"https:\/\/pingback.com\/br\/resources\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/70cde532238b4f8bf4a6e7e589ff0a259eda38fa966564ca7ed7d23e61c27774?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/70cde532238b4f8bf4a6e7e589ff0a259eda38fa966564ca7ed7d23e61c27774?s=96&d=mm&r=g","caption":"Pingback"},"description":"Pingback: Marketing for builders.","sameAs":["https:\/\/pingback.com","https:\/\/www.instagram.com\/pingbackoficial\/","https:\/\/www.linkedin.com\/company\/pingbackoficial\/","https:\/\/x.com\/pingbackoficial","https:\/\/www.youtube.com\/@pingbackoficial"],"url":"https:\/\/pingback.com\/br\/resources\/author\/adm1n\/"}]}},"_links":{"self":[{"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/posts\/4185","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/comments?post=4185"}],"version-history":[{"count":1,"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/posts\/4185\/revisions"}],"predecessor-version":[{"id":80425,"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/posts\/4185\/revisions\/80425"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/"}],"wp:attachment":[{"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/media?parent=4185"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/categories?post=4185"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pingback.com\/br\/resources\/wp-json\/wp\/v2\/tags?post=4185"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}