Une porte ouverte sur ma vie numérique (et pas que) !!!
[WordPress] Articles relatifs et thumbnails !
Je travail toujours sur l’évolution et les corrections à apporter au thème actuel de ce blog.
Dans ce travail j’ai récemment ajouté une petite fonction qui, au lieu d’afficher une liste d’articles relatifs via un plugin, va afficher des vignettes et ce sans plugin !
![]()
Comme on peut le voir sur l’image ci dessus nous avons donc de belles miniatures d’affichées au dessus du titre du billet.
Pour faire ceci il faut déjà avoir activer la gestion des « post thumbnail » pour son WordPress.
Cela se passe dans le fichier functions.php du thème.
if ( function_exists( 'add_theme_support' ) ) { // Added in 2.9
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 50, 50 ); // Normal post thumbnails
add_image_size( 'thumb620', 620, 9999 ); // Permalink thumbnail size
add_image_size( 'thumb80', 80, 80 ); // Permalink thumbnail size
add_image_size( 'thumb160', 160, 9999 ); // Permalink thumbnail size
}
Ensuite dans la boucle WordPress du template on appelle une image de billet de la manière suivante :
<?php if ( has_post_thumbnail() ): ?>
<? php the_post_thumbnail('thumb160'); ?>
<?php else : ?>
<?php endif; ?>
Ce code affiche l’image de billet si elle a été définie sinon elle affiche une image par défaut.
Pour avoir le résultat présenté dans la capture d’écran il faut donc utiliser le code qui suit dans votre template :
<?php
$tags = wp_get_post_tags($post->ID);
if ($tags) {
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
$args=array(
'tag__in' => $tag_ids,
'post__not_in' => array($post->ID),
'showposts'=> 6, // Number of related posts that will be shown.
'caller_get_posts'=>1
);
$my_query = new wp_query($args);
if( $my_query->have_posts() ) {
while ($my_query->have_posts()) {
$my_query->the_post();?>
<?php
}
}
}
?>
Puis mettre ceci dans son fichier css :
.relative-wp-caption {
width:180px;
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
/* optional rounded corners for browsers that support it */
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
.alignleft {float: left;}
| Cette entrée a été posté par Jérémy Wanderscheid le 11 juin 2010 à 12:41, et placée dans Web, Wordpress. Vous pouvez suivre les réponses à cette entrée via RSS 2.0. Vous pouvez laisser une réponse, ou bien un trackback depuis votre site. |
Additional comments powered by BackType



about 2 months ago
[Wordpress] Articles relatifs et thumbnails ! (garantie sans plugins) http://ping.fm/6z2AX
This comment was originally posted on Twitter
about 2 months ago
[WordPress] Articles relatifs et thumbnails ! http://lu.cx/8crhjB
This comment was originally posted on Twitter
about 1 month ago
pleins de remerciements.