jQuery Plugin "Sharre" für indiv. Facebook-Buttons in Wordpress

1. Welches von den Pluginfiles (jquery.sharrre-1.3.4.js bzw. jquery.sharrre-1.3.4.min.js ), die ich in den Wordpress-Root-JS-Folder hochgeladen habe, muß ich ansprechen? Das wäre für mich der oben fettgedruckte Codeteil ?>/js/yourScript.js"

2. und wie passt das mit der "Simple integration" zusammen, die der Programmierer des Plugins mir liefert, hier unter "Demos". Jeweils ein HTML-Teil, ein Javascript und ein CSS.

jQuery(document).ready(function( $ ) { 

  $('#demo1').sharrre({
    share: {
      googlePlus: true,
      facebook: true,
      twitter: true
    },  
    buttons: {
      googlePlus: {size: 'tall'},
      facebook: {layout: 'box_count'},
      twitter: {count: 'vertical', via: '_JulienH'}
    },  
    hover: function(api, options){
      $(api.element).find('.buttons').show();
    },  
    hide: function(api, options){
      $(api.element).find('.buttons').hide();
    },  
    enableTracking: true
  }); 

});

<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/jquery.sharrre-1.3.4.min.js"></script>
<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/mein-script.js"></script>

Zitat von Finn

Muß ich die "mein-script.js'"-Datei auch erstellen, wenn ich das Ganze in eine php einbinde und nicht in eine html? Bei Wordpress gibt es ja in der Form keine HTML-Dateien.

Muß ich dann quasi folgende Schritte durchlaufen:

1. Ich mache eine "mein-script.js"-Datei, worin der von Dir o.g. Code enthalten ist, der kommt in den Ordner der jquery.sharrre-1.3.4.min.js -Datei


2. In die header.php binde ich das Jquery-Plugin ein also

<?php wp_enqueue_script("jquery"); ?>  

und danach

<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/yourScript.js"></script>

wobei /js/yourScript.js die "mein-script.js"-Datei ist? Oder bezieht sich /js/yourScript.js auf jquery.sharrre-1.3.4.min.js ?

3. den in der Plugin-Demo angesprochenen HTML-Teil packe ich in die php, wo der Button erscheinen soll, also z.B. in dier footer.php?

<div id="demo1" data-url="http://sharrre.com" data-text="Make your sharing widget with Sharrre (jQuery Plugin)" data-title="share"></div>

jQuery(document).ready(function( $ ) {

  $('#share').sharrre({
    share: {
      googlePlus: true,
      facebook: true,
      twitter: true
    },
    buttons: {
      googlePlus: {size: 'tall'},
      facebook: {layout: 'box_count'},
      twitter: {count: 'vertical', via: '_JulienH'}
    },
    hover: function(api, options){
      $(api.element).find('.buttons').show();
    },
    hide: function(api, options){
      $(api.element).find('.buttons').hide();
    },
    enableTracking: true
  });

});

<?php wp_enqueue_script("jquery"); ?>

<?php wp_head() ?>

<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/jquery.sharrre-1.3.4.min.js"></script>
<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/jquery.sharrre-1.3.4.js></script>
<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/sharrre-my-script.js"></script>

</head>

<div id="footer">

<div id="sharrre" data-url="http://sharrre.com" data-text="Make your sharing widget with Sharrre (jQuery Plugin)" data-title="share"></div>

		&copy; <?php print(date(Y)); ?> Copyright <a href="<?php echo get_option('home') ?>/" title="<?php bloginfo('name') ?>" rel="home"><?php bloginfo('name'); ?></a>  etc.pp.

/* =social plugin sharrre */
.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;
  position:absolute;
  margin-left:50px;
  z-index:10;
  background-color:#fff;
}
.sharrre .button {
  float:left;
  max-width:50px;
  margin-left:10px;
}