Inserisci Gridster nel modello WordPress

Ho un problema con il mio plugin WordPress, voglio inserire Gridster nel plugin ma non funziona.Inserisci Gridster nel modello WordPress

Qui sto caricando i file, che sono correttamente nella cartella.

function add_my_stylesheet() 
{ 
    wp_enqueue_style('myCSS', plugins_url('/css/bootstrap.css', __FILE__), false); 
    wp_enqueue_style("gridster-style", plugins_url('/css/jquery.gridster.min.css', __FILE__), false); 
} 
add_action('admin_print_styles', 'add_my_stylesheet'); 



function add_my_scripts() 
{ 
    //I tried wp_register_script as well as wp_enqueue_script 
    wp_register_script("jquery-gridster", plugins_url('/js/jquery.min.js', __FILE__)); 
    wp_register_script("gridster-script", plugins_url('/js/jquery.gridster.min.js', __FILE__ )); 
    wp_register_script("gridster-script-extra", plugins_url(  '/js/jquery. gridster.with-extras.min.js', __FILE__)); 

} 
add_action('wp_register_scripts', 'add_my_scripts');

E questo è un esempio di codice dell'output previsto, che ovviamente non funziona.

echo' 

<section class="demo"> 
     <div class="gridster"> 
      <ul> 
       <li class="bg-blue" data-row="1" data-col="1" data-sizex="1" data-sizey="1">Box1</li> 
       <li class="bg-pink" data-row="1" data-col="2" data-sizex="1" data-sizey="1">Box2</li> 
       <li class="bg-pink" data-row="1" data-col="3" data-sizex="1" data-sizey="2">Box3</li> 
      </ul> 
     </div> 
    </section> 

    <script type="text/javascript"> 
    var gridster; 

    $(function() { 
     gridtster = $(".gridster > ul").gridster({ 
      widget_margins: [10, 10], 
      widget_base_dimensions: [140, 140], 
      min_cols: 6 
     }).data("gridster"); 
    }); 
</script>';

ho provato includendolo nel file di intestazione modelli così come nel plugin, ma mi mostra solo il testo e io non sono in grado di trascinare e rilasciare.

fonte

2016-01-04 Michael

Stai mai accodando quelle sceneggiature? Sembra che tu li stia solo registrando ... – rnevius

Sì, ho appena provato a registrarli questa volta, perché pensavo che avrebbe aiutato. – Michael

La registrazione degli script in realtà non li include nella tua pagina ... Dovresti usare 'wp_enqueue_script()' e l'hook di azione 'wp_enqueue_scripts' – rnevius

Michael - buona domanda ancora!

WordPress è fantastico, ma ci sono alcuni trucchi/sfumature su come funziona.

Per prima cosa, la registrazione di uno script è utile (se ad esempio si desidera localize, o nei casi in cui si può (o non si vuole) inviarlo nel piè di pagina (con un numero separato print_scripts), MA, lo fa Nessuna uscita per gli script Onto markup.

Inoltre, in base a dove li hai registrato (nel gancio wp_register_script), si consiglia di cambiare anche quello.

Se invece si è per gli script per l'output al markup della pagina, quindi modificare il codice come segue:

function add_my_scripts() 
{ 
    // proper way to include jQuery that is packaged with WordPress 
    wp_enqueue_script('jquery'); 
    // Do not EVER include your own jquery. This will cause all sorts of problems for the users of your plugin! 
    // wp_enqueue_script("jquery-gridster", plugins_url('/js/jquery.min.js', __FILE__)); 
    // you need enqueue here. ALSO note the use of the $dependencies parameter - this plugin relies on jquery, so be sure to include that as a dependency! 
    wp_enqueue_script("gridster-script", plugins_url('/js/jquery.gridster.min.js', __FILE__ ), array('jquery')); 
    wp_enqueue_script("gridster-script-extra", plugins_url(  '/js/jquery. gridster.with-extras.min.js', __FILE__), array('gridster-script')); 

} 
// and you need to hook the enqueue action here... 
add_action('wp_enqueue_scripts', 'add_my_scripts');

nota che se questo non funziona per voi, il passo successivo è visualizzare la fonte di rendering e vedere cosa sta succedendo. Se ritieni che ciò non funzioni, ti preghiamo di avvisare:

Stai provando a farlo sul front-end, sulla dashboard dell'amministratore o su entrambi?
Qual è l'html esatto che esegue il rendering all'interno del tag <head>?
Se l'url viene emesso, ma non è corretto, allora abbiamo un problema diverso, quindi è consigliabile se è corretto. Si noti che quando si "visualizza l'origine", normalmente i collegamenti allo/gli script sono selezionabili nella vista "Visualizza origine" e si può immediatamente vedere se il file di script viene caricato (perché quando si fa clic sul collegamento, vedrai il codice dello script) o no (perché vedrai il markup per una pagina di errore 404).
Infine, è possibile provare rimuovere le dipendenze. Ho avuto problemi interessanti usandoli a volte, e questo sarebbe qualcosa con cui vorrei giocare.

fonte

2016-01-04 15:09:37

Solo una nota ...' wp_enqueue_script ('jquery'); 'è ridondante, dal momento che è incluso come dipendenza negli altri script. – rnevius

@mevius - Vero, ma sto cercando di insegnare a Michael il modo corretto di accodare jQuery, quindi l'ho fatto esplicitamente come esempio/modello per lui da usare in futuro. –

Grazie mille, questo mi ha aiutato :) Ora sono in grado di trascinare e rilasciare le scatole nella mia parte anteriore e il mio [email protected] cale_b le tue risposte sono sempre utili e dettagliate per essere comprese facilmente, grazie per questo. – Michael

Inserisci Gridster nel modello WordPress

risposta

Problemi correlati