Solution au problème des URLs dans la fonction Billet suivant/précédent de Dotclear

Voici donc la solution, attention, ce n’est pas très propre, je le rappelle, je ne suis pas développeur :

Il faut reprendre le code que j’avais fourni dans le billet précédent et le modifier ainsi :

  	$strReq = 'SELECT post_id, post_titre, post_dt, post_chapo, post_content, post_titre_url '.
  			'FROM '.$blog->t_post.' '.
  			'WHERE UNIX_TIMESTAMP(post_dt) '.$sign.' \''.$ts.'\' '.
  			$reqPlus.
  			'ORDER BY post_dt '.$blog->con->escapeStr($order).' '.
  			'LIMIT 0,1 '; 	if (($rs = $blog->con->select($strReq)) !== false) {
  		return $rs;
  	}

On a ajouté le SELECT sur post_titre_url, qui manquait cruellement à la fonction.

Ensuite on va créer une variable reprenant cette valeur, comme je suis d’humeur joyeuse, on va l’appeler $youpla et l’on va modifier la partie du script touchant à la variable $url qui fait appel à la variable $titre, en remplaçant la variable $titre par $youpla, ce qui nous donne la chose suivante :

		$id = $rs->f('post_id');
		$titre = $rs->f('post_titre');
		$date = $rs->f('post_dt');
		$ts = strtotime($date);
		$youpla = $rs->f('post_titre_url');
		$url = sprintf($blog->front_url['post'],date('Y',$ts),
		date('m',$ts),date('d',$ts),$id,$blog->str2url($youpla));

Ce qui donne au final le code complet suivant à ajouter dans le fichier prepend.php de votre thème :

  /** * Naviguer d'un billet a l'autre dans la meme categorie
  * @function dcPostNextInCat
  */
  function myGetNextID($ts,$dir=1,$cat=0) {
  	global $blog;
  	$ts = (integer) $ts;
  	$reqPlus = ''; 	if($dir > 0) {
  		$sign = '>';
  		$order = 'ASC';
  	} else {
  		$sign = '<';
  		$order = 'DESC';
  	}
  	if ($blog->pub_mode !== NULL) {
  		$reqPlus .= 'AND post_pub = '.$blog->pub_mode.' ';
  	}
  	if ($blog->lang !== NULL) {
  		$reqPlus .= 'AND post_lang = \''.$blog->con->escapeStr($blog->lang).'\' ';
  	}
  	if ($cat !== 0) {
  	   $reqPlus .= 'AND cat_id = '.$cat.' ';
  	}
  	$strReq = 'SELECT post_id, post_titre, post_dt, post_chapo, post_content, post_titre_url '.
  			'FROM '.$blog->t_post.' '.
  			'WHERE UNIX_TIMESTAMP(post_dt) '.$sign.' \''.$ts.'\' '.
  			$reqPlus.
  			'ORDER BY post_dt '.$blog->con->escapeStr($order).' '.
  			'LIMIT 0,1 '; 	if (($rs = $blog->con->select($strReq)) !== false) {
  		return $rs;
  	} else {
  		$blog->setError('MySQL : '.$blog->con->error(),2000);
  		return false;
  	}
  }
  function dcPostNextInCat($dir,$s='%1$s %2$s %3$s') {
  	global $blog;
  	global $news;
  	$rs = myGetNextID($news->getTS(), $dir, $news->f('cat_id'));
  	if (!$rs->isEmpty())
  	{
		$id = $rs->f('post_id');
		$titre = $rs->f('post_titre');
		$date = $rs->f('post_dt');
		$ts = strtotime($date);
		$youpla = $rs->f('post_titre_url');
		$url = sprintf($blog->front_url['post'],date('Y',$ts),
		date('m',$ts),date('d',$ts),$id,$blog->str2url($youpla));
  		
  		if ($rs->f('post_chapo') != '') {
  			$desc = strip_tags($rs->f('post_chapo'));
  		} else {
  			$desc = util::cutString(strip_tags($rs->f('post_content')),150).'...';
  		}
  		printf($s,$id,$titre,$url,$desc);
  	}
  	else {
  	printf('< h5 >Vous êtes sur le dernier article de la rubrique< /h5 >< p >Le prochain article est, probablement, en cours de rédaction.< /p >< p >Cordialement,< br / >Aymeric Jacquet< /p >');
  	}
  }

N’oubliez pas de personnaliser le texte de remplacement à la fin du code.

Et voila, maintenant nos liens vers les articles précédents et suivants sont bien les liens réels des articles et non plus le titre inséré en lien.

Astuce dotclear 1 : billet suivant – précédent de la catégorie

Code avancé pour gérer les billets suivant/précédents au sein d’une catégorie :

Je me suis basé sur l’astuce suivante fournie dans le site le petit dotclear illustré : Billet précédent, billet suivant du blog/de la catégorie.

Et voici nouveau code que je vous propose pour le fichier prepend.php :

  /** * Naviguer d'un billet a l'autre dans la meme categorie
  * @function dcPostNextInCat
  */
  function myGetNextID($ts,$dir=1,$cat=0) {
  	global $blog;
  	$ts = (integer) $ts;
  	$reqPlus = ''; 	if($dir > 0) {
  		$sign = '>';
  		$order = 'ASC';
  	} else {
  		$sign = '<';
  		$order = 'DESC';
  	}
  	if ($blog->pub_mode !== NULL) {
  		$reqPlus .= 'AND post_pub = '.$blog->pub_mode.' ';
  	}
  	if ($blog->lang !== NULL) {
  		$reqPlus .= 'AND post_lang = \''.$blog->con->escapeStr($blog->lang).'\' ';
  	}
  	if ($cat !== 0) {
  	   $reqPlus .= 'AND cat_id = '.$cat.' ';
  	}
  	$strReq = 'SELECT post_id, post_titre, post_dt, post_chapo, post_content '.
  			'FROM '.$blog->t_post.' '.
  			'WHERE UNIX_TIMESTAMP(post_dt) '.$sign.' \''.$ts.'\' '.
  			$reqPlus.
  			'ORDER BY post_dt '.$blog->con->escapeStr($order).' '.
  			'LIMIT 0,1 '; 	if (($rs = $blog->con->select($strReq)) !== false) {
  		return $rs;
  	} else {
  		$blog->setError('MySQL : '.$blog->con->error(),2000);
  		return false;
  	}
  }
  function dcPostNextInCat($dir,$s='%1$s %2$s %3$s') {
  	global $blog;
  	global $news;
  	$rs = myGetNextID($news->getTS(), $dir, $news->f('cat_id'));
  	if (!$rs->isEmpty())
  	{
  		$id = $rs->f('post_id');
  		$titre = $rs->f('post_titre');
  		$date = $rs->f('post_dt');
  		$ts = strtotime($date);
  		$url = sprintf($blog->front_url['post'],date('Y',$ts),
  		date('m',$ts),date('d',$ts),$id,$blog->str2url($titre));
  		
  		if ($rs->f('post_chapo') != '') {
  			$desc = strip_tags($rs->f('post_chapo'));
  		} else {
  			$desc = util::cutString(strip_tags($rs->f('post_content')),150).'...';
  		}
  		printf($s,$id,$titre,$url,$desc);
  	}
  	else {
  	printf('< h5 >Vous êtes sur le dernier article de la rubrique< /h5 >< p >Le prochain article est, probablement, en cours de rédaction.< /p >< p >Cordialement,< br / >Aymeric Jacquet< /p >');
  	}
  }

A insérer avant le ?> fermant du fichier prepend.php de votre thème.

Important : pour la partie <h5>… en bas du code, il s’agit d’un message personnalisé à afficher si on est sur le dernier article de la catégorie, pensez à créer votre propre texte et si vous utilisez des balises html retirez les espaces après les > et avant les >, ils ne sont là que pour éviter le formatage hrml dans mon bilet dotclear. ;)

Ensuite, dans votre fichier post.php, insérez les lignes suivantes, en fonction de l’endroit ou vous voulez afficher ces éléments :

<div id="avantapres">
<h3>Autres articles de la rubrique : <a href="<?php dcPostCatURL(); ?>/" title="Rubrique <?php dcPostCatTitle(); ?>"><?php dcPostCatTitle(); ?></a></h3>
	<div class="artprecedent">
	<h4>Billet précédent :</h4>
	<?php dcPostNextInCat(-1,'<h5><a href="%3$s">%2$s</a></h5><p>%4$s</p>'); ?>
	</div>
	<div class="artsuivant">
	<h4>Billet suivant :</h4>
	<?php dcPostNextInCat(1,'<h5><a href="%3$s">%2$s</a></h5><p>%4$s</p>'); ?>
	</div>
</div>

Pour ma part, j’ai choisi de l’insérer juste avant le <div id= »comments »>.

Attention : ce code est parfaitement adaptable à vos besoins, pour ma part, j’ai privilégié un balisage avancé pour faire un habillage en deux colonnes géré via la feuille de style CSS, au besoin, n’hésitez pas à demander si vous avez des problèmes de mise en forme.

L’habillage CSS correspondant sur l’AJblog est le suivant :

#avantapres {background:#F5F5F5;padding:10px;}
#avantapres h3 {color:#5D5D5D;padding:0 0 5px 0;margin:0 0 5px 0;border-bottom:1px solid #A4A4A4;}
.artsuivant, .artprecedent {width:230px;text-align:justify;font-size:0.9em;}
.artsuivant {float:right;}
.artprecedent {float:left;}

A vous de le personnaliser en fonction de vos besoins.

Pour le rendu, c’est simple, c’est juste en dessous de cet article.

Ps : pour les coins arrondis, je triche, j’utilise jQuery.

Edit : si vous utilisez des urls personnalisées ne correspondant pas forcément au titre du billet, vous trouverez la solution sur ce billet : Solution au problème des URLs dans la fonction Billet suivant/précédent de Dotclear

Faire défiler vos derniers commentaires sous Dotclear ou WordPress avec jQuery – Mise à jour

Suite à une demande d’un lecteur sur le mode de fonctionnement du script de défilements des commentaires je me fend d’un petit billet.

En fait, c’est assez simple, donc on va expliquer ça dans l’ordre.

1 Télécharger la bibliothèque jQuery

Vous la trouverez à cette adresse :

Comme c’est pour utiliser directement en production, préférez la version compressée pour une question de poids. Utilisez le clic droit >> Enregistrer la cible sous et gardez en mémoire l’endroit de votre disque dur ou vous l’avez enregistré.

2 Installer le plugin des derniers commentaires

Pour dotclear c’est le plugin Last Comment de Francois Simond + David Latapie à cette adresse : http://blog.lienweb.fr/plugins-dotclear/plugin-lastcomments-0.9.3.pkg.gz.

C’est l’adresse du fichier auto-installeur, utilisez votre procédure habituelle d’installation, vous trouverez toutes les informations à cette adresse : http://blog.lienweb.fr/2006/03/04/122-plugin-dotclear-lastcomments-derniers-commentaires-0-9-3.

Pour WordPress nous allons nous baser sur le plugin Get Recent Comments de Krischan Jodies que vous trouverez à cette adresse : http://wordpress.org/extend/plugins/get-recent-comments/installation/ (utilisez le bouton download Plugin).

Suivez bien les procédures d’installation des plugins que vous soyez sur Dotclear ou WordPress, vérifiez bien que le plugin est actif et que vos derniers commentaires apparaissent bien là ou vous le voulez, je ne vais pas vous expliquer comment installer un plugin Dotclear ou WordPress aujourd’hui, nous partons du principe que vous savez déjà le faire.

3 télécharger le script qui va nous servir de base pour gérer le défilement

J’utilisais à l’origine un script JQuery appellé Newsticker, mais devant des problèmes de stabilité j’ai décidé d’utiliser un autre script : InnerFade with JQuery

La page explique l’utilisation générale du script, le lien de téléchargement est en bas de page.

Il vous faudra décomposer l’archive et récupérer le fichier jquery.innerfade.js qui s’y trouve. L’archive contient en fait une copie de la page d’explication d’utilisation du script.

J’ai décidé d’utiliser ce script pour des rasions de stabilité et de facilité d’intégration.

Il lui manque la fonctionnalité de stopper l’animation au passage de la souris, mais j’y travaille.

Installer et configurer l’ensemble.

Vous allez copier les fichiers les fichiers jquery-latest.pack.js et jquery.innerfade.js dans le répertoire de votre thème/template dotclear ou WordPress.

Vous éditez le fichier contenant le « head » général de votre thème/template, sout dotclear c’est template.php sous wordpress, normalement, ça doit être header.php.

Ajoutez les lignes suivantes juste avant le </head> :

Pour Dotclear :

<script type="text/javascript" src="<?php dcInfo('theme'); ?>/jquery-latest.pack.js"></script>
<script type="text/javascript" src="<?php dcInfo('theme'); ?>/jquery.innerfade.js"></script>

Pour WordPress :

<script type="text/javascript" src="<?php bloginfo(template_url) ?>/jquery-latest.pack.js"></script>
<script type="text/javascript" src="<?php bloginfo(template_url) ?>/jquery.innerfade.js"></script>

Attention : plusieurs personnes ayant essayé ce Tutoriel ont eu des problème avec ces lignes donc je vous donne les versions exactes pour Dotclear 1.2.x et WordPress à partir de la 1.5.

Ensuite, une petite feinte, allez sur votre blog en ligne ou les plugins de derniers commentaires est en fonctionnement et vérifiez le code html généré par ces commentaires.

Sous dotclear vous devriez avoir (a peu de près) le code généré suivant :

<div id="lastcomments">
<h2>Derniers commentaires</h2>
<ul>
<li>blabla 1</li>
<li>blabla 2</li>
<li>blabla 3</li>
...
</ul>

</div>

Sous wordpress :

<ul>
<li>blabla 1</li>
<li>blabla 2</li>
<li>blabla 3</li>
...
</ul>

Pour dotclear :

Il va falloir modifier le code à inclure dans notre template.php de la façon suivante :

Voici le code proposé par défaut :

<div id="lastcomments">
	<h2>Derniers Commentaires</h2>
	<?php $lastcomments->commentList(); ?>
</div>

Il faut le modifier pour avoir ça :

<div>
	<h2>Derniers Commentaires</h2>
	<?php $lastcomments->commentList(); ?>
</div>

Vous pouvez même supprimer le <div></div> si vous n’en avez pas l’utilité.

Ensuite, c’est un peu plus compliqué, mais à peine.

Si vous avez installé le plugin via une archive d’installation automatique (en passant par le backoffice -> outils -> Gestionnaire des plugins), vous n’avez pas les fichiers gérant le plugin lastcomments sur votre pc, il vous faut donc les télécharger.

Utilisez votre logiciel FTP et téléchargez le dossier suivant dans votre répertoire dotclear en ligne : /ecrire/tools/lastcomments.

Une fois le dossier téléchargé sur votre ordinateur, éditez le fichier functions.php avec votre éditeur de texte préféré.

A la ligne 158 (normalement) modifiez le code suivant :

echo '<ul>';

de cette façon :

echo '<ul id="lastcom">';

Enregistrez et republiez le fichier dans le répertoire /ecrire/tools/lastcomments sur votre serveur.

Normalement, tout devrait fonctionner. ;)

Pour WordPress :

L’identifiant « lastcom » de la liste non ordonnée étant important nous allons éditer le code que nous avons ajouté à notre template wordpress pour l’y intégrer.

Vous devez avoir quelque chose comme ça :

<?php if (function_exists('get_recent_comments')) { ?>
<h2><?php _e('Derniers commentaires:'); ?></h2>
<ul>
<?php get_recent_comments(); ?>
</ul>
<?php } ?>

Nous ajoutons l’identifiant et nous avons alors ça :

<?php if (function_exists('get_recent_comments')) { ?>
<h2><?php _e('Derniers commentaires:'); ?></h2>
<ul id="lastcom">
<?php get_recent_comments(); ?>
</ul>
<?php } ?>

Il nous reste le plus dur pour la fin, vous vous en doutez.

Pour finir donc :

Insérez dans le head de votre page ou template la ligne suivante, juste avant le </head> :

<script type= »text/javascript »> $(document).ready( function(){
$(‘#lastcom’).innerfade({ speed: ‘slow’, timeout: 6000, type: ‘sequence’, containerheight: ‘150px’ });
} ); </script>

Et c’est tout. ;)

Pour le reste il vous faudra travailler sur la partie CSS pour que l’ensemble se marie avec le design de votre site.

Vous pouvez changer la vitesse de rotation (le timeout:) la hauteur etc.. reportez vous sur la page de présentation du script pour plus de réglages.

Et n’oubliez pas de faire de l’habillage de #lascom dans votre feuille de style.

Il ne vous reste plus qu’à publier l’ensemble sur votre serveur.