[Plugin] SocialButtons (facebook, twitter, google+, linkedin)

2»

Réponses

  • websyyswebsyys Member
    Salut, le code que j'ai mis plus haut sert à ajouter les metas spécifiques pour facebook. Il faut mettre autre chose que "<?php $plxShow->meta('description') ?>" sinon y a un bug.
    En fait, je suis sur ton site et ça fonctionne très bien, aussi bien sur facebook que google+, donc ca doit venir de ton navigateur.
  • HarukaHaruka PluXml Project Manager
    Bonjour,

    Ça fonctionne ! Je ne sais pas pourquoi, mais je n'ai plus aucun problème. Probablement le cache sur mon serveur... je ne sais pas.
    Désolé l'erreur était bien de mon coté ;-)

    Pour info, ça fonctionne sans le code à ajouter dans <head>...</head>.
  • PPmarcelPPmarcel Member
    J'ai exactement le même problème, à savoir que le titre et la description de l'article se résument à l'URL.
    Ça ne m'a pas l'air d'être une question de cache, mais de paramétrage quelque part (un champ laissé vide ou une réécriture d'URL foireuse).
    Warning There was an error rendering this rich post.
  • PPmarcelPPmarcel Member
    Si tu veux tester, voici le site en question : http://blog.maoli.fr/
    PPmarcel a écrit:
    ...ou une réécriture d'URL foireuse).
    Je précise : foireuse de mon côté hein. :)
    Warning There was an error rendering this rich post.
  • websyyswebsyys Member
    octobre 2013 modifié
    P3ter a écrit:
    Ça fonctionne !

    Merci pour ton retour ;)

    @ PPmarcel : ça fonctionne bien de mon coté :)
  • aruhunoaruhuno Member
    octobre 2013 modifié
    Bonjour,

    Tout d'abord, merci pour ton travail. J'ai une petite suggestion à te faire : 
    [== PHP ==]
<div class="social">
	<ul>
		<li><a href="<?php echo $plxShow->artUrl() ?>#comments" class="comment">&nbsp;</a></li>
		<li><a href="https://plus.google.com/share?url=<?php $plxShow->artUrl(); ?>&hl=fr" class="gplus">&nbsp;</a></li>
		<li><a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo $plxShow->artUrl() ?>&t=<?php $plxShow->artTitle() ?>" class="facebook">&nbsp;</a></li>
		<li><a href="https://twitter.com/share?url=<?php $plxShow->artUrl(); ?>&text=<?php $plxShow->artTitle(); ?>" class="twitter">&nbsp;</a></li>
		<li><a href="https://www.linkedin.com/shareArticle?mini=true&url=<?php $plxShow->artUrl(); ?>&title=<?php $plxShow->artTitle(); ?>" class="linkedin">&nbsp;</a></li>
	</ul>
</div>

    En utilisant des listes déroulantes et des "class" plutôt que des liens brutes et des images, tu permets la surcharge d'un CSS. Du coup on peut changer les images comme on le souhaite, mais également gérer l'affichage.

    Exemple de CSS que tu pourrais utilisé avec le morceaux de code ci-dessus : 
    [== CSS ==]
.social a {
	padding-left: 3px;
	text-align: left;
	float: left;
	font-size: 12px;
}

.social img {
	margin: 0;
	padding-top: 3px;
	float: left;
}

.social ul {
	margin: -2px 0;
	float: left;
}

.social li {
	display: inline-block;
	margin: 0px;
}

.social li a {
	display: block;
	width: 25px;
	height: 25px;
	text-indent: -9999px;
}

.social li .comment {
	background: url('icon_comment.png') no-repeat;
	background-size: 25px 25px;
}

.social li .comment:hover {
	background: url('icon_comment-hover.png') no-repeat;
	background-size: 25px 25px;
}

.social li a.gplus {
	background: url('icon_gplus.png') no-repeat;
	background-size: 25px 25px;
}

.social li a.gplus:hover {
	background: url('icon_gplus-hover.png') no-repeat;
	background-size: 25px 25px;
}

.social li a.facebook {
	background: url('icon_facebook.png') no-repeat;
	background-size: 25px 25px;
}

.social li a.facebook:hover {
	background: url('icon_facebook-hover.png') no-repeat;
	background-size: 25px 25px;
}

.social li a.twitter {
	background: url('icon_twitter.png') no-repeat;
	background-size: 25px 25px;
}

.social li a.twitter:hover {
	background: url('icon_twitter-hover.png') no-repeat;
	background-size: 25px 25px;
}

.social li a.linkedin {
	background: url('icon_linkedin.png') no-repeat;
	background-size: 25px 25px;
}

.social li a.linkedin:hover {
	background: url('icon_linkedin-hover.png') no-repeat;
	background-size: 25px 25px;
}

    Le mieux encore est d'avoir une seule et même image contenant toutes les icônes des RS et de faire des décallages en CSS permettant l'affichage d'un seul icône.
  • websyyswebsyys Member
    Bonjour aruhuno, et merci pour ta contribution.
    Ton astuce est intéressante; j'ai lu quelques articles qui préconisent cette méthode.
    Mais... je n'ai pas utilisé le sprite-css pour que l'on puisse facilement changer les images ;)
  • websyyswebsyys Member
    novembre 2013 modifié
    Bonjour, je suis en train d'adapter le plugin pour l'affichage sur article ET page statique.
    J'ai modifié le code comme ceci : 
    	public function SocialButtons() {

		// préparation variables url et titre
		$plxShow = plxShow::getInstance();

	// Detection page statique / article
		if($plxShow->mode()=='article'){ 
		$link_url = $plxShow->artUrl();
		$link_title = $plxShow->artTitle();
		}
		elseif($plxShow->mode()=='static'){ 
		$link_url = $plxShow->staticUrl();
		$link_title = $plxShow->staticTitle();
		}

    Et remplacé (exemple pour l'url) : 
    https://twitter.com/share?url=<?php $plxShow->artUrl(); ?>
    Par : 
    https://twitter.com/share?url=<?php $link_url; ?>

    Mais l'url n'est pas remplie : https://twitter.com/share?url=
    Sinon je suis obligé de mettre le code de détection pour chaque url, bcp de code pour pas grand chose.
    :(
  • Jerry WhamJerry Wham Member
    Et avec un echo, ça devrait mieux fonctionner non ?
  • websyyswebsyys Member
    novembre 2013 modifié
    Non plus.
    Par contre l'url et le titre s'affiche au niveau du code de détection, mais pas dans l'url !!!
    Exemple http://websyys.olympe.in/localserver-indicator-raccourcis-pour-serveur-local-ubuntu-13-10.html
    (j'ai juste effectué la modif pour le bouton twitter...)
    Et sur une page statique, j'ai une erreur dans le code source et il n'y a que le bouton twitter qui s'affiche.
    http://websyys.olympe.in/outils-en-ligne.html
  • Jerry WhamJerry Wham Member
    Il faut appeler une instance de plxShow dans les pages statiques et mettre tout ton code dans un ob_start et ob_get_clean car sinon, le code s'affichera en dehors de ton appel.
    Et là : 
    https://twitter.com/share?url=<?php $link_url; ?>
    il faut mettre un echo
  • websyyswebsyys Member
    Le plugin fonctionne désormais avec les pages statiques :)
    (version 1.3 dispo)
  • websyyswebsyys Member
    novembre 2013 modifié
    Je suis en train d'optimiser le plugin pour la validation html5.
    J'ai rajouté une class dans plxshow 
    	// titre valide html5 dans l'url (socialbuttons)
	public function socialTitle($type='') {
		$new = plxUtils::strCheck($this->plxMotor->plxRecord_arts->f('title'));
		$new1 = str_replace(' ', '%20', $new);
			echo $new1;
	}
    Dans le plugin, j'ai remplacé 
    $plxShow->artTitle();
    par 
    $plxShow->socialTitle();
    Validation html5 ok.

    Mais est-ce qu'on peut faire la même chose sans éditer class.plx.show.php ?
  • Jerry WhamJerry Wham Member
    Il vaut pas mieux utiliser plxUtils::title2url() ?
  • websyyswebsyys Member
    Jerry Wham a écrit:
    Il vaut pas mieux utiliser plxUtils::title2url() ?

    Comment ça marche ?
  • Jerry WhamJerry Wham Member 
    ob_start();
$plxShow->artTitle();
$title=ob_get_clean();
$title = plxUtils::title2url($title);
  • websyyswebsyys Member
    Si je n'utilise pas str_replace, le titre dans twitter est sous cette forme : titre-article-exemple

    Donc : 
    ob_start();
$plxShow->artTitle();
$title=ob_get_clean();
$socialtitle = str_replace(' ', '%20', $title);

    Merci :)
  • aruhunoaruhuno Member
    novembre 2013 modifié
    websyys a écrit:
    Si je n'utilise pas str_replace, le titre dans twitter est sous cette forme : titre-article-exemple

    Donc : 
    ob_start();
$plxShow->artTitle();
$title=ob_get_clean();
$socialtitle = str_replace(' ', '%20', $title);

    Merci :)
    Personnellement, sur mon plugin, j'utilise urlencode, sinon si tu veux faire selon la RFC 3986, tu peux utiliser rawurlencode.
    websyys a écrit:
    Par contre, ce qui serait bien, ce serait de pouvoir ajouter son pseudo twitter dans une page de configuration du plugin, dans l'administration pluxml. Et de modifier l'url si le pseudo twitter est enregistré ;).
    Je me demande en fait l’intérêt d'enregistrer le pseudo dans la partie admin étant donné que tweet est fait sur le compte du visiteur...
  • websyyswebsyys Member
    aruhuno a écrit:
    Personnellement, sur mon plugin, j'utilise urlencode, sinon si tu veux faire selon la RFC 3986, tu peux utiliser rawurlencode.

    Ce qui compte c'est le résultat :)
    Merci pour l'info.
    aruhuno a écrit:
    websyys a écrit:
    Par contre, ce qui serait bien, ce serait de pouvoir ajouter son pseudo twitter dans une page de configuration du plugin, dans l'administration pluxml. Et de modifier l'url si le pseudo twitter est enregistré ;).
    Je me demande en fait l’intérêt d'enregistrer le pseudo dans la partie admin étant donné que tweet est fait sur le compte du visiteur...

    Il me semble que c'est pour indiquer le pseudo du membre twitter "si on souhaite follow-er l'auteur de l'article".
    Ça sera inclus dans la prochaine version disponible ;)
  • websyyswebsyys Member
    Version 1.4 disponible ;)
  • CristofotoCristofoto Member
    sur mon site pluxml 5.1.6 j'ai cette erreur sur la page article: 
    [== Indéfini ==]
Fatal error: Call to a member function getParam() on a non-object in /homez.348/cristofo/www/vape/plugins/plxSocialButtons/plxSocialButtons.php on line 20
    et sur la page aide du plugin : 
    [== Indéfini ==]
Fatal error: Call to a member function getParam() on a non-object in /homez.348/cristofo/www/vape/plugins/plxSocialButtons/lang/fr-help.php on line 16
  • websyyswebsyys Member
    Profite en pour mettre à jour ta version de PluXml :)
  • CristofotoCristofoto Member
    décembre 2013 modifié
    et ca va pas bugger le theme ?
  • websyyswebsyys Member
    Sauvegarde ton site dans un premier temps. Si la mise a jour fait bugger le site, tu replace ta sauvegarde.
    Pour sauvegarder, tu télécharge le dossier contenant ton site sur ton disque dur avec ton logiciel ftp.
    Ou bien tu renomme le dossier contenant ton site (vape --> vape1). Et tu crée un nouveau dossier vape avec une la nouvelle version 5.2 .
    Tu l'installe puis tu replace les dossier data/ et themes/ qui étaient sur le site (ceux du vape1).
    Si tout fonctionne bien, c'est bon.
  • CristofotoCristofoto Member
    tout nickel.

    Par contre comment les mettre en float right ?
  • websyyswebsyys Member
    décembre 2013 modifié 
    [== Indéfini ==]
<div style="float:right;"><?php eval($plxShow->callHook('SocialButtons')) ?></div>

    Autrement, tu peut personnaliser le fichier /plugins/plxSocialButtons/plxSocialButtons.php

    N'hésites pas si tu à des idées d'améliorations ;)
    Je vais surement rajouter une option pour choisir les boutons à afficher, si par exemple on ne souhaite que les bouton FB et TW.
  • CristofotoCristofoto Member
    génial merci beaucoup.

    tout fonctionne.
  • SuricatSuricat Member
    Proposition d'amélioration : Pouvoir choisir 4 ou 5 mots qui seront précédés d'un # lors d'un clique sur Twitter.

    Ces mots seraient paramétrables dans la configuration du plugin, ce qui permettrait de mettre en valeur ces mots clefs dans le titre de l'article qui est mentionné dans le Tweet généré.
  • SuricatSuricat Member
    Bug :
    il manque une fin de DIV dans plxSocialButtons.php
    [== PHP ==]
//(smartphones / tablettes)
if(strstr($_SERVER['HTTP_USER_AGENT'],'iPhone') || strstr($_SERVER['HTTP_USER_AGENT'],'iPad') || strstr($_SERVER['HTTP_USER_AGENT'],'Android')) { 
print('
<a ... /></a>
<a ... /></a>
<a ... /></a>
<a ... /></a>
<a ... /></a>
    </div>   <============= ici 
');}
Connectez-vous ou Inscrivez-vous pour répondre.