Julienh / Sharrre

Make your sharing widget! Sharrre is a jQuery plugin that allows you to create nice widgets sharing for Facebook, Twitter, Google Plus (with PHP script) and more.
sharrre.com
MIT License
1.04k stars 411 forks source link

Uncaught ReferenceError: $ is not defined localhost (anonymous function) #132

Open nusquama opened 11 years ago

nusquama commented 11 years ago

so i use wordpress and i have this error : Uncaught ReferenceError: $ is not defined localhost (anonymous function)

in my header.php i put

<?php wp_enqueue_script('sharrre', get_stylesheet_directory_uri() .'/js/jquery.sharrre-1.3.4.js'); ?>

$(function(){ $('#demo1').sharrre({ share: { googlePlus: true, facebook: true, twitter: true, delicious: true }, buttons: { googlePlus: {size: 'tall'}, facebook: {layout: 'box_count'}, twitter: {count: 'vertical'}, delicious: {size: 'tall'} }, hover: function(api, options){ $(api.element).find('.buttons').show(); }, hide: function(api, options){ $(api.element).find('.buttons').hide(); } }); $('#demo2').sharrre({ share: { googlePlus: true, facebook: true, twitter: true }, url: 'http://sharrre.com', enableHover: false }); }); in my css i put :

demo1.sharrre {

width: 100%; display: inline-block; }

demo2.sharrre {

width: 50px; }

.sharrre .box { float: left; }

.sharrre .count { color: #444444; display: block; font-size: 17px; line-height: 34px; height: 34px; padding: 4px 0; position: relative; text-align: center; text-decoration: none; width: 50px; background-color: #eee; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }

.sharrre .share { color: #FFFFFF; display: block; font-size: 11px; height: 16px; line-height: 16px; margin-top: 3px; padding: 0; text-align: center; text-decoration: none; width: 50px; background-color: #9CCE39; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }

.sharrre .buttons { display: none; float: left; width: 300px; }

.sharrre .button { float: left; max-width: 50px; height: 50px; margin-left: 10px; }

in my post :

the demo use on the file download

can you help me

Julienh commented 11 years ago

Have you checked the path of sharrre.js and jQuery files?

nusquama commented 11 years ago

yes the path is ok...

i spend all my day on it...

Julienh commented 11 years ago

do you have a live demo?

nusquama commented 11 years ago

tu parles français ?

Julienh commented 11 years ago

Zut ça se voit tant que ça :D

nusquama commented 11 years ago

lol

non c'est que je suis français et ça sera plus simple en français !

nusquama commented 11 years ago

je peux t'envoyer le lien en privé ?

Julienh commented 11 years ago

tu peux oui

nusquama commented 11 years ago

je reponds directement dans ce mail ?

2013/5/5 Julien Hany notifications@github.com

tu peux oui

— Reply to this email directly or view it on GitHubhttps://github.com/Julienh/Sharrre/issues/132#issuecomment-17453753 .

Franck

Julienh commented 11 years ago

le code de sharrre est lancé avant jQuery, voilà pourquoi il ne connais pas $ :)

Julienh commented 11 years ago

quand je parle du code de sharrre, ce n'est pas le fichier JS, mais ton code d'exemple.

nusquama commented 11 years ago

d'accord et comment je dois faire pour le mettre avant !

nusquama commented 11 years ago

je dois appeller jquery avant ?

Julienh commented 11 years ago

Je ne connais pas wordpress, mais je pense que si tu met le code d'exemple dans un fichier javascript et que tu l'ajoute comme ceci : wp_enqueue_script('sharrre', get_stylesheet_directory_uri() .'/js/jquery.sharrre-1.3.4.js');

Ça devrait fonctionner.

nusquama commented 11 years ago

c'est bizarre car ce code est dans mon header, il devrai donc apparaitre avant...

nusquama commented 11 years ago

dans mon header j'ai inscrit ça :

<?php wp_enqueue_script('sharrre', get_stylesheet_directory_uri() .'/js/jquery.sharrre-1.3.4.js');
?> mais il semblerait que cela ne marche pas, car que ce soit là ou pas, j'ai le meme message. Normalement cette fonction devrait appeler le jquery. As tu une idée ?

Julienh commented 11 years ago

ce n'est pas ce fichier le problème, c'est que ton code suivant est avant les fichiers de jquery et de sharrre : $(function(){ $('#demo1').sharrre({ share: { googlePlus: true, facebook: true, twitter: true, delicious: true }, buttons: { googlePlus: {size: 'tall'}, facebook: {layout: 'box_count'}, twitter: {count: 'vertical'}, delicious: {size: 'tall'} }, hover: function(api, options){ $(api.element).find('.buttons').show();
}, hide: function(api, options){ $(api.element).find('.buttons').hide(); } });

$('#demo2').sharrre({
  share: {
    googlePlus: true,
    facebook: true,
    twitter: true
  },
  url: 'http://sharrre.com',
  enableHover: false
});

});

nusquama commented 11 years ago

oui mais dans mon header c'est comme ça

<?php wp_enqueue_script('sharrre', get_stylesheet_directory_uri() .'/js/jquery.sharrre-1.3.4.js'); ?>

$(function(){ $('#demo1').sharrre({ share: { googlePlus: true, facebook: true, twitter: true, delicious: true }, buttons: { googlePlus: {size: 'tall'}, facebook: {layout: 'box_count'}, twitter: {count: 'vertical'}, delicious: {size: 'tall'} }, hover: function(api, options){ $(api.element).find('.buttons').show(); }, hide: function(api, options){ $(api.element).find('.buttons').hide(); } }); $('#demo2').sharrre({ share: { googlePlus: true, facebook: true, twitter: true }, url: 'http://sharrre.com', enableHover: false }); });

Donc la commande qui appelle le jquery est bien avant...

nusquama commented 11 years ago

bref...j'ai passé la journée dessus et je suis pas plus avancé !

Tu devrais en faire un plugin pour wordpress et le vendre sur codecanyon tu aurais du succés ! Je serais le premier acheteur !

mais là j'abandonne

Merci quand meme de ton aide et bravo pour le plugin

nusquama commented 11 years ago

http://www.formation-web.org/optimisation-medias-sociaux/ http://www.formation-web.org/partage-sociaux-dans-un-seul-bouton/

Ici il a fait un tuto pour wordpress avec le plugin mais ça marche pas non plus...

Julienh commented 11 years ago

Dans le code source de la page que tu m'as donné en exemple, ce code est toujours au mauvais endroit : $(function(){ $('#demo1').sharrre({ share: { googlePlus: true, facebook: true, twitter: true, delicious: true }, buttons: { googlePlus: {size: 'tall'}, facebook: {layout: 'box_count'}, twitter: {count: 'vertical'}, delicious: {size: 'tall'} }, hover: function(api, options){ $(api.element).find('.buttons').show(); }, hide: function(api, options){ $(api.element).find('.buttons').hide(); } }); $('#demo2').sharrre({ share: { googlePlus: true, facebook: true, twitter: true }, url: 'http://sharrre.com', enableHover: false }); });

Il se retrouve même devant la balise title

Dsl si tu as perdu du temps dessus :S

nusquama commented 11 years ago

je test sur un brouillon qui n'est pas publié

J'ai posté un commentaire sur le site cité plus haut. Si j'arrive à avoir plus d'info je te tiens informé. Mais comme je l'ai dit un plugin wordpress publié sur codecanyon pourra être une bonne affaire !

bonne soiree