Na Parte 1 começamos a criar o tema, e agora nós vamos começar a criar o HTML da home do novo tema do meu blog. :)
Por enquanto não tenho nenhum layout à seguir, então vou tentar criar o “HTML ideal” com o máximo de semântica possível e vamos ver o que vai sair disso…
Passo 3 - Estrutura inicial de uma página HTML5
Pra começar, abrimos o index.php
que até então está vazio e adicionamos a estrutura básica do HTML5:
Como vocês podem ver, não há nada demais aí.. vamos começar a usar algumas funções do WordPress pra facilitar a nossa vida.
Passo 4 - Funções básicas de tema no WordPress
Agora iremos usar as seguintes funções:
- language_attributes() - Exibe os atributos de idioma para o elemento html
- bloginfo() - Exibe informações sobre o blog, como título, descrição, url e etc.
Aplicando essas funções ao nosso index.php
, vamos ficar com o seguinte:
Aproveitei pra usar a função bloginfo() pra pegar a url completa do tema e inserir o nosso estilo.css (que eu ainda nem criei, mas isso não é um problema)…
Caso você use a bloginfo() sem passar nenhum parâmetro, ela irá retornar o título do blog, que é que fizemos dentro da tag title.
Como resultado, acessando o blog teremos o seguinte código fonte:
Passo 5 - Feed RSS e Atom
Já que estamos criando um tema para blog, nada melhor do que aproveitar que estamos editando o elemento head e adicionar os links dos mesmos:
Finalizando
Espero que tenham gostado… no próximo artigo iremos começar a montar o HTML do topo e do conteúdo da página, onde iremos listar os posts. :)
Gostou? Então comente! Caso contrário eu posso ficar desmotivado e a terceira parte não vai sair…