Custom Post Type “Offre Spéciale” Avec Pods (3/*)

Voila, j’ai créé un contenu de base pour mon site slovenie-tourisme.com

Voici des copies d’écran (car il va beaucoup évolué..):

Homepage

slovenie-tourisme-homepageL’article ce trouve à gauche, au milieu je voudrais mettre les destinations (pas possible avec ce template, il faudra modifier cela). On remarque la page « offres spéciales » dans le menu en haut.[clear]

Page « offres spéciales »

slovenie-tourisme-offresJ’ai simplement créé une page avec un shortcode. Pour ajouter un shortcode a votre page, il suffit de cliquer sur le petit icone à cote de « Ajouter un média », une popup apparait avec un formulaire comme ici .[clear]

Page « Ljubljana »

slovenie-tourisme-ljubljanaJ’ai ajouté un shortcode, mais cette fois j’ai indiqué la destination « Ljubljana » , ici.
[clear]

Article « Visitez Ljubljana »

slovenie-tourisme-visite-ljuJ’ai exactement la même chose que pour la page.[clear]

 

 

 

Pour le deuxième colonne, je voudrais lister mes destinations, malheureusement, après investigation dans le code du template, il ne s’agit pas d’un widget (pourtant ça y ressemble), mais simplement une liste aléatoire de 10 articles (je n’en comprend pas vraiment l’utilité ??). Je vais devoir changer cela.

Widgetiser un template WordPress

Le plus simple est (sur Chrome) de pointer cette colonne, et faire « Procéder à l’inspection de l’élément« , on repère le code de ce morceau, et après on le recherche dans le code du template.

 

On trouve le code de cette colonne, que l’on va modifier en widget. Cela signifie que l’on va modifier notre thème (Je vous conseille d’utiliser un thème enfant … même si je ne vais pas le faire ici 😉

le code qui gère cette colonne est :

<?php $posts = get_posts('orderby=rand&numberposts=10'); foreach($posts as $post) { ?>
						<div class="post addon-post">
							<a href="<?php the_permalink() ?>" title="<?php the_title(); ?>" rel="nofollow" id="featured-thumbnail">
								<?php if ( has_post_thumbnail() ) { ?> 
									<?php echo '<div class="featured-thumbnail">'; the_post_thumbnail('featured',array('title' => '')); echo '</div>'; ?>
								<?php } ?>
							</a>
							<div class="addon-post-content">	
								<h2 class="title addon-title">
									<a href="<?php the_permalink() ?>" title="<?php the_title(); ?>" rel="bookmark"><?php the_title(); ?></a>
								</h2>
								<div class="addon-post-info"><span class="theauthor"><span class="icon-user"></span><?php global $post; $author_id=$post->post_author; ?><a href="<?php echo get_author_posts_url($author_id); ?>"><?php the_author_meta( 'nickname', $author_id ); ?></a></span></div>
							</div>
						</div>
					<?php } ?>

on va le mettre de coté (il nous servira pour notre template Pods), et le remplacer par une widget.

<?php if ( !function_exists( 'dynamic_sidebar' ) || !dynamic_sidebar('colonne') ) ?>

Il faut bien sur déclarer cette widget dans notre fichier functions.php .Le mieux est de rechercher la fonction register_sidebar et placer notre code au même endroit.

on obtient le code

if ( function_exists('register_sidebar') ) {
register_sidebar(array(
        'name' => 'Sidebar',
	'before_widget' => '<div class="widget_sidebar">',
        'after_widget' => '</div>',
        'before_title' => '<h3>',
        'after_title' => '</h3>',
      ));
register_sidebar(array(
        'name' => 'colonne',
	'before_widget' => '',
        'after_widget' => '',
        'before_title' => '',
        'after_title' => '',
      ));	  
	}

J’ai supprimé tous les paramètres de base d’une widget, car ils sont inutiles.

On vérifie que tout est ok:

 

Maintenant, on va pouvoir afficher nos Pods destination, et c’est la qu’intervient la puissance de Pods, cela se fait très simplement, aussi facilement qu’un shortcode dans une page/article !

Pods dispose de ses propres widgets, il suffit de choisir : Pods – List items

slovenie-pods-list-items2

 

On obtient ceci :

slovenie-colonne-sans-template

 

Voila, nous avons fini, il reste à mettre en forme, car pour l’instant ce n’est pas très joli… Ce sera l’objet du prochain tutoriel…

 

Laisser un commentaire