intégrer les gravatars avec le nouveau thème 5.1.7 : ajustements CSS

antistress

Bonsoir,

Mon précédent thème était dérivé du 4.3 officiel et je viens de basculer sur le nouveau 5.1.7

Dans le fichier commentaires.php de mon thème on m'avait dit d'ajouter après

<div id="<?php $plxShow->comId(); ?>" class="comment">
			<blockquote>

les lignes suivantes pour gérer les gravatars :

<?php if($plxShow->plxMotor->plxRecord_coms->f('type')=='admin') : # si commentaire de type admin ?>
                        <p><img class="gravatar" src="http://www.gravatar.com/avatar.php?gravatar_id=<?php echo md5(strtolower('mon_mél_complet')) ?>&amp;default=http://www.gravatar.com/avatar/3b3be63a4c2a439b013787725dfce802.jpg&amp;size=32" alt="Avatar Gravatar" /></p>
                    <?php else: # si commentaire d'un visiteur ?>
                        <p><img class="gravatar" src="http://www.gravatar.com/avatar.php?gravatar_id=<?php echo md5( strtolower($plxShow->plxMotor->plxRecord_coms->f('mail')) ) ?>&amp;default=lien_vers_mon_icône_par_défaut.png&amp;size=32" alt="Avatar Gravatar" /></p>
                    <?php endif; ?>

À l'époque le fichier style.css ne prévoyait rien et j'avais ajouté simplement un style "gravatar" ainsi :

.gravatar { float:right; }

J'ai repéré dans le dossier themes le fichier style.css indique aujourd'hui

.comment {
	padding-left: 60px;
	margin: 0 0 30px 0;
	background-image: url(img/user.png);
	background-repeat: no-repeat;
}

Comment puis-je remplacer user.png par le gravatar dans le nouveau thème ?

Car actuellement les gravatar s'ajoutent au user.png, cf par exemple : http://libre-ouvert.toile-libre.org/index.php?article65/mes-parents-sous-debian-7-0-wheezy-regler-le-bogue-de-l-ajout-d-imprimante#comments (je ne voudrais garder que la figure de droite, mais en l'affichant à la place de celle de gauche - je ne sais pas d'où vient celle du milieu)

Merci d'avance !

PS : par ailleurs les commentaires "admin" ne semblent plus différenciés avec le nouveau thème (avant ils avaient un couleur spécifique)

Jos

Je n'ai pas la réponse complète, mais en gros, l'image "user" qui apparaît n'est pas implanté en HTML, mais en CSS à l'aide d'un background-image. La class .comment représente le commentaire, et il a un padding-left de 60px pour laisser apparaître le background-image "user". Pour mettre ta fonction, je pense qu'il faut effacer tous le bloc, et le refaire.

Hamtaro

Effectivement, le background qui affiche l'avatar est dans le ficihier css (pas très jojo ça).
Pour faire propre, il te faut donc supprimer ce background dans le css et insérer le bloc de code dans le code de ta boucle de commentaire.

J'en profite pour signaler que j'avais sorti un plugin à l'époque...

http://forum.pluxml.org/viewtopic.php?id=2937

bankai

Le plugin Gravatar fonctionne très bien sur la version 5.1.7, je l'utilise moi même.

antistress

Merci à tous

J'avais consulté le wiki et n'avais rien vu sur un éventuel plugin gravatar.

Merci Hamtaro pour ton travail. J'ia viré l'ancien code que j'utilisais, ai dézippé ton plugin et ai suivi l'aide et l'ai configuré mais rien ne s'affiche encore.

dans le style.css je dois supprimer tout ça :

.comment {
padding-left: 60px;
margin: 0 0 30px 0;
background-image: url(img/user.png);
background-repeat: no-repeat;
}

?

PS : D'ailleurs Hamtaro je ne suis pas sûr que le plugin marche sur ton site (tu l'utilises ?) car je ne vois que des silhouettes identiques, comme sur mon blogue (image user.png du style.css)

Jos

Pour l'image en background en css, je l'ai fait ainsi parce que cette image n'apporte rien au contenu et au référencement, et qu'il est ensuite plus facile de la modifier en css. Dans ce cas de figure, pour des images pas très lourdes, il est préférable, à mon sens, de la placer en css.

Haruka

antistress a écrit:

J'avais consulté le wiki et n'avais rien vu sur un éventuel plugin gravatar.

Pour info, le plugin est répertorié sur cette page : http://wiki.pluxml.org/index.php?page=Plugins+non+officiels

Jos

Il s'appel hamGravatar (je n'ai pas testé).

antistress

ça y est j'ai vu mon erreur j'avais copié le code dans le thème mobile au lien du desktop :-/

Pour ne pas cumuler l'imagette hard-codée (img/user.png) avec le gravatar, j'ai supprimé « class="comment" » de mon fichier commentaires.php.

Mais ce que j'aimerais c'est que le gravatar prenne la place de l'image hard-codée, c'est à dire en bordure gauche du commentaire.

J'ai vu dans le code que le code gravatar répondait à la classe "avatar" et comprends que celle-ci reste à créer.

Je ne m'y connais pas en css mais j'ai noté que la classe "comment" de l'image hard-codée utilise la propriété background-image qui requiert de spécifier l'url de l'image : comment faire dans le cas de l'image renvoyée par gravatar ?

Merci d'avance !

k610i

Bonjour Antistress,


J'utilise le plugin HamGravatar sans soucis.
Je ne comprends pas ton soucis, ton site semble bien prendre en compte le Gravatar.

antistress

Oui, ça marche, merci

Par défaut le thème affiche une silhouette anonyme sur le côté gauche du commentaire, comme tu peux le voir ici http://www.customtaro.fr/blog/article747/mon-avis-et-test-du-clavier-logitech-k760-pour-mac#comments

Sur mon blogue mes gravatars apparaissent au dessus des commentaires.

Je voudrais qu'ils apparaissent sur le côté gauche du commentaire, comme la silhouette anonyme par défaut du thème.

Mais je ne sais pas quelle règle CSS appliquer, je n'y connais pas grand chose :-/

k610i

Il faut jouer avec le positionnement.

=> Sur Chrome, fais un clic droit sur le gravatar de ton lien, va sur "Inspecter l'élément" et analyse sa façon de faire.


Ou apprends à te service du positionnement en CSS > Cours là dessus

antistress

J'ai repéré le code par défaut (cf #5 http://forum.pluxml.org/viewtopic.php?pid=29854#p29854 ) mais je ne sais pas comment l'adapter au plugin, et j'espérais un petit conseil plutôt que de démarrer l'apprentissage du css depuis zéro juste pour ça étant donné que mon temps disponible est pour le moment hélas limité... une bonne âme ?