Bom pessoal, estamos chegando a última parte deste tutorial e conforme prometido anteriormente, vou disponibilizar para download o tema que elaboramos durante todo este tempo. Para quem está chegando agora, é bom dar uma olhada nos posts anteriores deste tutorial, parte I, parte II, parte III e parte IV.
Antes de disponibilizar o tema, gostaria de esclarecer para quem acompanhou todo o tutorial, que fiz algumas modificações nos templates e adicionei mais alguns arquivos ao nosso tema, para que o mesmo ficasse completÃssimo.
Os arquivos adicionados foram:
- single.php – arquivo cuja função é exibir um único post. A única diferença para o index.php é a inserção da tag comments_template(), que insere o arquivo comments.php;
- comments.php – tem a função de exibir os comentários e o formulário para comentar no arquivo single.php;
- functions.php – torna o tema compatÃvel com widgets.
Tenho certeza que, quem leu todas as partes do tutorial não terá dificuldades em entender os acréscimos que foram feitos. De qualquer maneira se alguém tiver alguma dúvida basta perguntar. CrÃticas, sugestões e opiniões são muito bem-vindos.
Espero que este tutorial tenha ajudado vocês a elaborar seus próprios temas, pois esse foi meu principal objetivo ao escrevê-lo. Quem quiser informações mais detalhadas sobre como elaborar um tema pode acessar o Wordpress Codex.
- Download do Tema Mighty – 2 colunas, XHTML/CSS válido, compatÃvel com widget e totalmente em português.
[download]










Felipe Fernandes : 02 setembro 2007 Ã s 10:13 pm
Quando descobri o pBlog já havia começado essa série… Mas assim que der vou dar uma olhada em toda a sequência e procurar segui-la!!!
Boa iniciativa! =)
Abraço
Thiago : 04 setembro 2007 Ã s 11:28 am
Excelente!!!
uma duvida, se eu quiser incluir mais uma ou duas colunas, como eu faço? elas ficariam editaveis pelas widgets?
abs
Érico Oliveira : 04 setembro 2007 às 11:46 am
Thiago,
Para adicionar mais colunas você deverá alterar o código XHTML/CSS do tema. Também é possÃvel ter mais de uma coluna compatÃvel com widgets.
Thiago : 05 setembro 2007 Ã s 5:20 pm
Você poderia disponilibizar esse codigo ou indicar algum site onde posso encontrar???
um abraço
Alex : 11 setembro 2007 Ã s 7:07 pm
mto bom!!
Érico, se qu quero criar um layout como se fosse um jornal, em um jornal obviamente tem várias colunas na primeira página.. imaginamos que eu crie uma categoria para cada coluna e quando eu iria postar para uma certa categoria o post iria automaticamente para aquela coluna e não um post em baixo do outro como é tradicionalemente…
tem como fazer isso???
Érico Oliveira : 11 setembro 2007 às 8:56 pm
Olá Alex,
Tem sim, basta adicionar vários loops dentro do index.php e antes de cada um adicionar a seguinte linha de código < ?php
query_posts('cat=1&showposts=3'); ?>. Neste exemplo o loop irá exibir os últimos três posts da categoria 1. Só isso!
Mais informações em http://codex.wordpress.org/Template_Tags/query_posts
Alex : 12 setembro 2007 Ã s 12:11 am
hummm.. ok..
hehe e como eu sou meio iniciante.. seria mto vc dar um exemplo do que eu colocaria dentro de um loop??
abraços!!
Érico Oliveira : 12 setembro 2007 às 8:45 am
Alex, recomendo você dar uma lida em todo o tutorial, principalmente na parte II, onde explico detalhadamente o funcionamento do loop.
Alex : 12 setembro 2007 Ã s 9:48 am
Bom dia Érico..
agora eu entendi.. então se eu quiser criar duas colunas dentro do conteudo da página eu crio duas div e em cada div coloco dois loop, porque eu quero separar duas categorias para cada coluna.. seria isso né?
vlw.. obrigado pelas dicas.. abraços
Fábio Maia : 12 setembro 2007 às 11:04 am
Olá Érico.
Seu tutorial foi muito bom, acompanhei ele utilizando um template criado por mim e deu certinho. Porém estou com um pequeno problema…
Quando clico para enviar um comentário nada ocorre, ou seja, abre apenas o post sozinho…
O que eu fiz de errado?
Agradeço sua atenção…
Érico Oliveira : 12 setembro 2007 às 11:24 am
Olá Fábio,
Como disse nesta última parte do tutorial, foram adicionados alguns arquivos como o single.php e o comments.php. Provavelmente é o que está faltando no seu tema.
Crie um arquivo chamado single.php baseado no index.php, adicione a linha de código < ?php comments_template() ?> onde você deseja que apareça o formulário de comentários e copie o arquivo comments.php do tema Mighty para o seu tema.
Acho que é isso.
Fábio Maia : 12 setembro 2007 às 2:56 pm
Oi Érico…
Era isso mesmo..
Depois que postei a dúvida fui analisar o código e era isso mesmo…
A preguiça de procurar o erro foi maior…
Hhehehe
Agradeço sua ajuda e parabéns pelo tutorial…
Excelente Tutorial « No Words : 02 novembro 2007 Ã s 8:19 am
[...] 2nd, 2007 Descobri recentemente este tutorial que explica como criar um tema para WordPress baseado em um tema XHTML/CSS. Para quem se interessa [...]
Marcelo Oliveira : 08 novembro 2007 Ã s 6:49 pm
Olá Érico, muito boa essa série de posts, agora tenho uma dúvida cruel: o que eu teria que fazer se quisesse passar a sitebar da direita para a esquerda?
Outra pergunta, a posição da sidebar (à esquerda ou direita) faz alguma diferença no que se refere a SEO?
Valeu pela força e parabens pelo tutorial!
Aroldo : 13 novembro 2007 Ã s 9:53 am
Bom dia Érico.Gostaria de saber se é possÃvel fazer a inserção de um arquivo .swf que extensão do Flash da macromedia e sendo possÃvel, como seria? Desde já te agradeço pela série sobre templates…muito bom mesmo!Abraço!
Érico Oliveira : 13 novembro 2007 às 10:16 am
É possÃvel sim Aroldo, para isso insira o código do Flash dentro do arquivo PHP do seu tema no local desejado, da mesma forma como você faria em um arquivo HTML.
Douglas : 23 janeiro 2008 Ã s 12:28 pm
Olá! Eu consegui montar o site para wordpress, mais quando eu entro para troca o tema, fala que não achou o style.css mas sendo que ele esta lá. O que esta errado? abraços!
Érico Oliveira : 23 janeiro 2008 às 1:26 pm
Douglas, vc adicionou o cabeçalho do Wordpress no arquivo style.css mostrado na parte I deste tutorial?
Douglas : 23 janeiro 2008 Ã s 2:39 pm
Sim, eu o adicionei, tanto que eu baixei o que voce fez e mandei por FTP, deu certo, mais os 2 CSS estao iguaizinhos. No WP Manage themes, lá em baixo, fica escrito assim: Stylesheet is missing, e do lado aonde esta escrito “Name” nao aparece nada. Oque pode esta errado? abraços!
Douglas : 23 janeiro 2008 Ã s 2:42 pm
Problema resolvido, é que o arquivo .css estava styles.css, mas o WP procura somente escrito style.css, sem o S no final. obrigado pela ajuda!
Alexandre Pereira : 14 março 2008 às 3:30 pm
Não pode disponibilizar o seu template para download? Obrigado
Fernando : 26 março 2008 às 3:24 am
tenho duas perguntas na verdade :
1º Como faço para os coments ficarem sempre visÃveis na página, como está na sua agora ? …
2º Como posso adicionar mais uma coluna ao tema ? Especificamente o q eu deveria fazer ? é apenas uma questão de editar os estilos CSS ? ou tem algo mais q eu deva fazer em questão de código ? poderia bolar um “mini-tuto” pra gente, já q não sou o único com essa dúvida ?
obrigado
Érico Oliveira : 26 março 2008 às 8:15 am
Fernando,
1. Adicionar a tag “comments_template()” no arquivo single.php e o arquivo “comments.php”, como explicado no tutorial.
2. Sua dúvida diz respeito a HTML/CSS e a proposta, tanto do blog como deste tutorial, é tratar apenas do WordPress.
Gustavo : 03 abril 2008 Ã s 6:41 pm
Olá, aprendei muito com esse tutorial, valeu!
porem, acabo de termina-lo, e quando testei, a página esta uma baderna rsrsrs você precisou alterar o css original do template base?
abraços!
Siméia Pedroso : 23 abril 2008 às 2:25 pm
Olá Érico, excelente artigo!
mas o download está desativado, assim não sei terminar meu blog pois faltam as páginas ’single.php’, ‘comments.php’ e functions.php…
poderia disponibilizar?…
Obrigada!
Érico Oliveira : 23 abril 2008 às 4:23 pm
Siméia, o problema do link para realizar o download já foi resolvido.
Siméia Pedroso : 23 abril 2008 às 4:53 pm
Valeu, obrigada!
Não sabe fazer? procure um tutorial : Info Dinheiro : 28 abril 2008 às 6:55 pm
[...] Como criar um tema para o WordPress – parte V [...]
Bruno Costa : 09 junho 2008 Ã s 1:19 pm
Rapaz!
Muito bom o tutorial.
Na verdade não cheguei a segui-lo pq me perdia as vezes no nÃvel de entendimento de códigos e tudo mais (entrei muito cru nisso).
Mas gostei da iniciativa e da abertura de horizontes.. rsrsrs. Até então, eu achava que o tema estava praticamente fechado e que teria que montar outro todo novo. Já estou me virando!!!
A minha pergunta é:
Quando terminar o tema, eu teria que ter um host para armazenar os arquivos, correto? Pois o pelo Wordpress só dá pra usar os temas que eles oferecem. (?)
Pq o que eu to usando agora é um tema do W.P. mas que não tem a sidebar nos posts únicos. Eu já vi como que coloca, mas não dá pra mexer nele pelo wordpress “online”, só no “baixado”.
É isso tudo mesmo!? rsrs
Aguardo tua resposta!
Abraço!
Arthur Barros : 18 junho 2008 Ã s 10:20 am
Amigo, foi muito util esse seu tutorial, achava que modificar um tema para WordPress seria um bixo de 7 cabeças, mas no seu tutorial esta tudo muito detalhado e bem comentado, estou boqui-aberto. Parabens e obrigado
Maria Helena : 25 junho 2008 Ã s 12:12 am
a minha dúvida é a mesma que a do bruno acima…como eu faço para colocar isso lá no wordpress, com um dominio de blog simples (blabla.wordpress.com)
Jeferson dos Santos : 25 agosto 2008 Ã s 10:43 am
Olá Erico,
Poderia me ajudar com um probleminha?
As minhas postagens são muito ricas de imagens e para abrir a página principal acaba ficando muito pesado.
Tem como fazer com que ao invés de exibir o texto da postagem propriamente dito, ele exiba o campo “description” e um link do tipo “leia a materia completa”
Outra coisa, tem com eu dizer quantos posts ele vai mostrar na pagina principal por vez? Queria q ele exibisse apenas uns 5 por página.
Abraços e adorei o blog.
doutor house : 07 setembro 2008 Ã s 6:57 pm
ola amigo erico , criei meu blog meu template e talz , mas mesmo assim estou tenado problemas com meu template , oke acontece é que a sidebar está deslocando junto com texto , mas isso acontece soh na index , nas outras paginas não será que pode me ajudar
Gregory : 07 outubro 2008 Ã s 12:23 pm
Amigo, Desculpa aparecer assim do nada nos coments do site
Eu tava aqui pesquisando como criar um template pra WordPress, e achei de cara os 5 tutoriais do Pblog, por sinal ótimos.
Eu queria tirar uma duvida que não achei no “mestre” google, no meu teste de WordPress, http://www.jinno.com.br/blog no slidebar tem “Categories” “Archieves” “Pages” etc.. Gostaria de saber onde eu posso Traduzir esses nomes?
Não consigo achar, fiz varias alterações aqui, procurando, e sempre acaava dando algum erro no site, ou nem alterava nada!
Se não for pedir muito!
Desde já obrigado!
Ronni : 24 novembro 2008 Ã s 7:58 pm
Parabéns pela serie de artigos!
Roberto : 20 março 2009 às 5:35 pm
oooo cara…. parabens pelo tutorial…
ja segui muitos tutoriais sobre como criar templates.. esse é o unico que ta realmente funcionando
parabens mesmo..
cara to com um problema aqui..
quando tem um post e tal… ai tem os comentarios do post….
qdo eu escrevo outro comentario..
ele aparece em cima e aparece tpw… (aguardando aprovaçao..)
até ai blz…
mas o formulario em baixo do nome e do email…. ainda ta o meu nome e o meu email.. mesmo depois de ter clicado submit
nao tem um jeito de limpar automatico? como muitos blogs?
valeu cara
abraçoooooooo
Roberto : 20 março 2009 às 5:38 pm
aaaaaaah ta…
agora que eu vi.. é asism mesmo
foi mal por nao ter percebido =x
cabeça a mil
valeu pelo tutorial
abraçoooooo
Roberto : 24 março 2009 às 2:24 pm
cara… eai tudo joia?
estou fazendo umas alteraçoes aqui no tema, construindo o meu, mas tem alguns elementos do css, que nao funciona cara, eu tento alterar as cores pra localizar cada elemento na pagina, e nao altera cara, isso na pagina de comments, estou alterando o estilo dos comentarios, mas alguns elementos nao funciona, o que pode ser cara?
obrigado pela atençao
abraçoooos
Alexandre Broggio : 04 maio 2009 Ã s 3:23 pm
Obrigado pelo tutorial estou aprendendo a criar themas pro worpress e este tutorial adianto muito
meu aprendizado parabens vlw pelo post ^_^
Como criar um tema para o WordPress - parte V | João Andrade l Web Designer : 15 maio 2009 às 2:59 pm
[...] que foram feitos. De qualquer maneira se alguém tiver alguma dúvida basta perguntar. CrÃticas, sugestões e opiniões são muito [...]