Imagem da categoria

Veja como adicionar uma imagem para cada categoria e exibi-la quando mostrar uma postagem por exemplo.

Alguns sites podem querem mostrar um ícone ou imagem para ilustrar cada categoria e você pode fazer isso facilmente sem plugins, apenas se utilizando de um pouco de PHP.

Antes de começar

Temos que definir a pasta onde as imagens ou ícones vão ficar, esta pasta deve estar dentro da pasta do seu tema atual. Crie algo como ‘cat-img’.

Crie as imagens, cada uma para cada categoria e atenção para o nome: deve ser o nome simplificado ou nicename da categoria

Nicename ou slug é o nome simplificado sem acentuação e unindo as palavras com hífen. Por exemplo, uma categoria chamada ‘Músicas alemãs’ fica ‘musicas-alemas’.

Mostrar imagem da categoria na barra lateral ou Sidebar

No arquivo sidebar.php , podemos mostrar o nome da categoria atual da postagem sem link e a imagem da categoria:

<h2><?php the_category(', ') ?> </h2>
<img src="<?php bloginfo('template_url'); ?>/cat-img/</code>?php foreach((get_the_category()) as $category) { echo $category->slug . '';} ;?><code>.jpg" alt="imagem" title="<?php echo $category->cat_name . ' '; ?>" "/>

O título da imagem é o nome da categoria e o texto alternativo ‘imagem’.

Mostrar imagem da categoria em Arquivos

No arquivo archive.php você pode inserir o mesmo código só que imediatamente acima da linha:

<?php while (have_posts()) : the_post(); ?>

Mostrar imagem da categoria em postagens

Como em single.php:

 <img src="<?php bloginfo('template_url'); ?>/cat-img/<?php foreach((get_the_category()) as $category) { echo $category->slug . '';} ;?>.jpg" alt="." title="<?php echo $category->cat_name . ' '; ?>" "/>

Link da categoria com imagem

Podemos usar algo parecido com o código acima para criar uma classe ou identificador CSS nomeada com o nicename da categoria.

No arquivo single.php procure por:

<?php the_category(', ') ?>

E substitua por esse ecódigo:

<span class="estilo-<?php foreach((get_the_category()) as $category) { echo $category->slug . ' ';} ;?>"><?php the_category(', ') ?></span>

No arquivo style.css do tema temos que criar classes nomeadas de acordo com cada categoria. Neste exemplo, algo como:

.estilo-flores{
background: url(imagens/flores.jpg) no-repeat left top;
}

No exemplo, usei um prefixo estilo– para melhor organizar as classes.

Conclusão

Estes recursos são muito usados para personalizar postagens dentro de categorias, a única desvantagem é ter que gerar as imagens, criar o código CSS etc. Mesmo que exista plugins para isso, ainda prefiro ver de perto como tudo funciona.

É isso!