Esta é a continuação do primeiro artigo Fazer template no Wordpress #1.

Na primeira parte mostrei os pontos básicos a serem feito para iniciar o template, e fazer o mesmo ser reconhecido pelo Wordpress, criamos ainda o cabeçalho da pagina.

Nesta segunda parte mostrarei como montar o básico do corpo do blog.

De inicio coloquei dentro do index.php por enquanto a verificação se existem posts, e, o laço que os exibe.

O código usado foi esse abaixo:

	<?php if (have_posts()) : ?>
			<?php while (have_posts()) : the_post();
					include (TEMPLATEPATH . '/post.php'); ?>
			<?php $counter++; endwhile; ?>
	<?php else : ?>
		<?php include (TEMPLATEPATH . '/notfound.php'); ?>
	<?php endif; ?>

Esse código acima, verifica se existem posts, caso existem exibe todos respeitando o limite por pagina que você configurou no wordpress.

Dentro do arquivo post.php que ali é incluído eu por enquanto inseri um texto estático, mas vira o código que busca os dados de cada artigo.

Dentro do index.php, inseri ainda a seguinte função do wordpress:

	<?php get_sidebar(); ?>

Ela carrega o arquivo sidebar.php, que é onde devemos inserir o código da barra lateral do blog.

Neste arquivo inseri alguns textos informativos, o feed do blog, e pegamos o histórico e as categorias.

Para pegar o histórico utilizei o seguinte:

	wp_get_archives('arguments');

Essa função busca todos o histórico do blog, e poder trazer a informação sendo personalizado da seguinte forma:

	wp_get_archives('type=monthly');

Exibe o histórico do blog, dividido por mês, sem limites.

	wp_get_archives('type=monthly&limit=12');

Exibe o histórico do blog, dividido por mês, mostrando apenas os últimos 12 meses.

	wp_get_archives('type=daily&limit=7');

Exibe o histórico do blog, dividido por dia, mostrando apenas os últimos 7 dias.

	wp_get_archives('type=postbypost&limit=10&format=custom');

Exibe os últimos 10 posts.

Para montarmos uma lista exibindo esses links que retornam da função do Wordpress, podem montar o html por exemplo assim:

<ul>
<?php wp_get_archives(’type=monthly’); ?>
</ul>
Agora para buscarmos as categorias do blog usamos a seguinte função:

	wp_list_categories('show_count=1');

O código acima mostra todas as categorias exibindo ao lado o total de posts para cada categoria.
Caso não queiram mostrar a contagem de posts basta alterar show_count para ser igual a 0.

Caso queiram ordenar a lista pelo id utilizem o seguinte:

	wp_list_categories('show_count=1&orderby=id');

Para ordenar por nome:

	wp_list_categories('show_count=1&orderby=name');

Caso não insira nada, o padrão é ordenar por ID.

Para mostrar também as categorias sem nenhum post pode utilizar o seguinte:

	wp_list_categories('show_count=1&orderby=name&hide_empty=0');

Por padrão o hide_empty vem habilitado.

Por padrão a funçao wp_list_categories insere o titulo “Categories” acima da lista das categorias.

Como meu titulo eu inseri em separado para montar o layout, não quero que ele seja exibido novamente acima da lista.

Logo meu código final das categorias deixei assim:

	wp_list_categories('sshow_count=1&orderby=name&title_li=');

Caso quisessem ter o titulo acima, mas com um valor diferente de “categories”, poderiam montar assim:

	wp_list_categories('sshow_count=1&orderby=name&title_li=Categorias');

Isso exibira o texto “Categorias” logo acima da lista.

Por enquanto é isso

Para darem uma olhada em como estão ficando os arquivos até agora baixem o arquivo aqui.

Ando sumido porque trabalho também
Mas o blog segue firme e forte.

Antonio, valeu pela indicação, se terminar de montar esse template até o dia 30 de outubro vou inscreve-lo certamente no concurso.

Categories: Wordpress
3 Comentarios »

Bom como pretendo mudar o layout do meu blog, tenho que montar o template para o wordpress.

Para poder explicar alguma coisa sobre como funciona esse processo de montar um template, o básico do que eu fizer vou passar pra vocês, principalmente esse comecinho.

Vamos começar então, criei um blog de teste no seguinte endereço:

http://www.fazedordesite.com/novo

Todos os temas instalados no wordpress do seu blog estarão no seguinte local:

/wp-content/themes/nomedotema

Crie uma pasta dentro desta pasta themes, é onde ficara o seu tema.

De inicio é importante que você salve uma imagem do seu layout que foi desenhado no photoshop ou qualquer outro programa de edição de imagens, no formato PNG, com o nome screenshot.png.
Esta imagem deve ter 300px de largura por 225 px de altura, ela será exibida naquela lista onde escolhemos qual tema usar.

Se você não desenhou seu layout antes, pare de ler aqui, você tem muito que aprender ainda antes de pensar em fazer qualquer coisa, sugiro que acompanhe o Profissão Fazedor de Site.

O próximo passo é criar um arquivo chamado style.css, no inicio deste arquivo você deve inserir informações sobre o tema, podem seguir este exemplo:

/*

Theme Name: FS Dark Blue

Theme URI: http://fazedordesite.com

Description: Fazedor de Site Theme

Version: 1.0

Author: Rodrigo Fante

Author URI: http://fazedordesite.com

This theme was designed and built by Rodrigo Fante,

whose blog you will find at http://fazedordesite.com/blog

The CSS, XHTML and design is released under GPL:

http://www.opensource.org/licenses/gpl-license.php

*/

Atenção pois é importante que estas linhas estejam comentadas com o /* antes e o */ depois das informações.

Agora como em qualquer site, precisamos de um index.php, ainda, usaremos um arquivo com nome de sidebar.php, e outro com nome de footer.php, e por fim header.php, estes nomes são usados normalmente como padrão, pois existem funções dentro do WP que os chamam automaticamente.

Dentro do index.php a primeira coisa que deve conter é a seguinte linha de código:

 <?php get_header(); ?>

A função get_header, pega automaticamente o cabeçalho do HTML contido dentro do arquivo header.php. Neste arquivo normalmente eu coloco o doctype, os metatags, inclusão do CSS, javascript, tags de cabeçalho como <title>, com a ultima linha sempre com </head>.

Para facilitar nosso trabalho o WP tem algumas funçoezinhas bastante úteis.

No titulo por exemplo você pode inserir o seguinte código:

 <title>

	 <?php bloginfo('name'); ?>

	 <?php if ( is_single() ) { ?> » Blog Archive <?php } ?>

	 <?php wp_title(); ?>

 </title>

Essa seqüência de funções dentro do title, vai mostrar o nome do blog na barra de titulo, se estiver na pagina inicial, mostrara a descrição do blog inserida no menu option do WP, e se estiver dentro de algum artigo especifico, após o nome mostrara o título do artigo, otimizando seu blog assim para os motores de busca.

Para pegar por exemplo o css padrão do blog, aquele mesmo que você inseriu as informações sobre o blog, basta usar a seguinte linha:

 <?php bloginfo('stylesheet_url'); ?>

Atenção, ainda dentro do header.php, antes de fechar a tag </head>, insira o seguinte código:

 <?php wp_head(); ?>

Ela é necessária para alguns plugins do WP.

Meu Javascript eu colocarei dentro de uma pasta chamada js, dentro do diretório do tema.

Para cada script inserido dentro do header.php usarei a seguinte linha de código:

 <script type="text/javascript"

 src="<?php bloginfo('template_directory'); ?>/js/nome_do_script.js">

 </script>

A função bloginfo(’template_directory’), retorna o diretório onde esta o tema usado.

A esse altura o WP já deve reconhecer seu tema na listagem no Administrador, e já permite que o ative.

Embora ainda não mostre nada.

Por enquanto é isso, o básico pra montar uma estrutura que o WP reconhece.

Mas vem mais por ai, no final, deixarei o template que vou usar no blog disponível para download.

Categories: Wordpress
8 Comentarios »