IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Bouton twitter personnalisé.


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Profil pro
    Inscrit en
    Mai 2004
    Messages
    551
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2004
    Messages : 551
    Par défaut Bouton twitter personnalisé.
    Salut,

    C'est bête comme choux et je pensais que cela serait facile mais j'arrive pas à faire un bouton twitter pour partager une page dont il me faut personnaliser l'url et l'image de twitter.

    J'ai essayé ceci:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <a href="http://twitter.com/share?url=http://www.monurl.com/book.php?bc=26" target="_blank" data-url="http://twitter.com/share?url=http://www.monurl.com/book.php?bc=26" rel="external"><img src="http://monsite.com/images/share-twitter.png"></a>
    Donc j'ai essayé en mettant data-url dans le lien <a... mais ca ne me modifie pas l'url pour autant.

    Je me suis basé sur cette aide:
    http://www.twoutils.com/installer-bo...replytocom=267

    Quelqu'un a déjà fait ça ?

    Merci,
    Vincent.

  2. #2
    Membre Expert
    Avatar de RomainVALERI
    Homme Profil pro
    POOête
    Inscrit en
    Avril 2008
    Messages
    2 652
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 48
    Localisation : France, Meurthe et Moselle (Lorraine)

    Informations professionnelles :
    Activité : POOête

    Informations forums :
    Inscription : Avril 2008
    Messages : 2 652
    Par défaut
    Essaie peut-être quelque chose comme :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <a href="http://twitter.com/share?url=http://www.monurl.com/book.php" target="_blank" data-url="http://www.monurl.com/book.php?bc=26" rel="external"><img src="http://monsite.com/images/share-twitter.png"></a>
    ... histoire d'éviter le double "?" dans le href, que le navigateur ne doit pas trop aimer

  3. #3
    Membre éclairé
    Profil pro
    Inscrit en
    Mai 2004
    Messages
    551
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2004
    Messages : 551
    Par défaut
    Citation Envoyé par RomainVALERI Voir le message
    Essaie peut-être quelque chose comme :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <a href="http://twitter.com/share?url=http://www.monurl.com/book.php" target="_blank" data-url="http://www.monurl.com/book.php?bc=26" rel="external"><img src="http://monsite.com/images/share-twitter.png"></a>
    ... histoire d'éviter le double "?" dans le href, que le navigateur ne doit pas trop aimer
    Oui, bien vu, il faut en fait encoder l'url:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <a href=\"http://twitter.com/share?url=".urlencode(utf8_encode("$link/book.php?bc=$cId"))."&text=".urlencode(utf8_encode($row_book["picbook_name"]." Chapitre ".$current_chapter["chapter_number"].": ".$current_chapter["chapter_name"]))."\" target=\"_blank\" rel=\"external\"><img src=\"$img/share-twitter.png\"></a>
    Sans oublier de passer l'url en utf8 pour les caractères spéciaux style "à"...
    Voila Voila.

    Maintenant je préférerai une popup plutôt qu'une nouvelle fenêtre du navigateur, alors j'ai trouvé ceci en javascript/html sur une page d'un site:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
     
    <script type="text/javascript">
      $(".custom-tweet-button").live("click",function() {
          var url = $(this).attr("href");
          var id  = 995;var largeur=600;var hauteur=400; 
    window.open(url,id,'toolbar=0,location=0,directories=0,status=yes,menubar=0,scrollbars=yes,resizable=yes,width='+largeur+',height='+hauteur+',left=50,top=50');
          return false;
                                    });
    </script>
    <a class="actions_news custom-tweet-button" target="_blank" href="http://twitter.com/share?url=monurl.com" title="Partager sur Twitter"></a>
    Sauf que chez moi j'ai un message d'erreur comme quoi $ n'est pas défini: "$ is not define" au chargement de la page.

    Quelqu'un aurait une idée ?

    Merci,
    Vincent.

  4. #4
    Membre Expert
    Avatar de RomainVALERI
    Homme Profil pro
    POOête
    Inscrit en
    Avril 2008
    Messages
    2 652
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 48
    Localisation : France, Meurthe et Moselle (Lorraine)

    Informations professionnelles :
    Activité : POOête

    Informations forums :
    Inscription : Avril 2008
    Messages : 2 652
    Par défaut
    Citation Envoyé par defacta Voir le message
    Quelqu'un aurait une idée ?
    C'est du jQuery ^^
    Le site où tu as vu cet extrait importe une librairie js dans le head de sa page, sur laquelle s'appuient les fonctionnalités spécifiques à jQuery, dont la fonction "$" qui fait office de sélecteur (beaucoup plus avancé que getElementById car, comme dans ce cas, on peut sélectionner par classe CSS)

  5. #5
    Membre éclairé
    Profil pro
    Inscrit en
    Mai 2004
    Messages
    551
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Mai 2004
    Messages : 551
    Par défaut
    Citation Envoyé par RomainVALERI Voir le message
    C'est du jQuery ^^
    Le site où tu as vu cet extrait importe une librairie js dans le head de sa page, sur laquelle s'appuient les fonctionnalités spécifiques à jQuery, dont la fonction "$" qui fait office de sélecteur (beaucoup plus avancé que getElementById car, comme dans ce cas, on peut sélectionner par classe CSS)
    oups

    Bon cette fois c ok.
    Voila tout le lien (avec le php pour le encoder l'url), si ca peut aider:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <a onClick=\"window.open('http://twitter.com/share?url=".urlencode(utf8_encode("$link/book.php?bc=$cId"))."&text=".urlencode(utf8_encode($row_book["picbook_name"]." Chapitre ".$current_chapter["chapter_number"].": ".$current_chapter["chapter_name"]))."','','toolbar=0,location=0,directories=0,status=yes,menubar=0,scrollbars=yes,resizable=yes,width=600,height=400,left=50,top=50');\" href=\"javascript: void(0)\" ><img src=\"$img/share-twitter.png\"></a>

  6. #6
    Membre Expert
    Avatar de RomainVALERI
    Homme Profil pro
    POOête
    Inscrit en
    Avril 2008
    Messages
    2 652
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 48
    Localisation : France, Meurthe et Moselle (Lorraine)

    Informations professionnelles :
    Activité : POOête

    Informations forums :
    Inscription : Avril 2008
    Messages : 2 652
    Par défaut
    Ca ne devait pas être très clair ...désolé ^^'

    Si l'extrait cité ne marche pas, c'est parce qu'il fait appel à une fonction "$", qui n'est définie nulle part dans ta page.
    Elle fait partie d'un ensemble de fonctions courantes créées pour simplifier et augmenter les possibilités de Javascript, c'est le principe des librairies.
    Quiconque peut créer une librairie, il suffit de l'écrire, la diffuser, et espérer que les développeurs web trouvent un intérêt à l'utiliser.

    En l'occurrence et pour revenir à nos moutons, il se trouve qu'à vue de nez il me semble bien que c'est la librairie jQuery qui est utilisée ici. Tu pourras en avoir le coeur net en consultant à nouveau la page d'où provient l'extrait, et en inspectant la partie <head> du code source de la page. Il doit y avoir une balise script dont la propriété src pointe sur une version de jQuery (là, ne me demande pas laquelle ).

    Si c'est toujours mystique (), n'aie pas peur d'insister ^^'

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Bouton partage personnalisé
    Par chpe1 dans le forum APIs Réseaux sociaux
    Réponses: 1
    Dernier message: 03/07/2015, 00h02
  2. Modifier le script du bouton twitter
    Par tarentaise dans le forum Général JavaScript
    Réponses: 2
    Dernier message: 09/10/2014, 18h10
  3. Réponses: 0
    Dernier message: 14/02/2013, 03h45
  4. [C#] Création d'un bouton personnalisé
    Par _skip dans le forum Windows Forms
    Réponses: 3
    Dernier message: 08/12/2006, 13h44

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo