Caricamento shortcode con ajax

Question

Caricamento shortcode con ajax

3 ago 2013, 21:13:27

Visualizzazioni: 22.2K

Voti: 3

Sto cercando di caricare uno slideshow se il browser ha una determinata dimensione dello schermo - cioè non voglio che lo slideshow si carichi su schermi più piccoli e mobili. Il plugin dello slideshow fornisce uno shortcode:

<?php echo do_shortcode('[metaslider id="8302"]'); ?>

Ma quando provo a caricarlo con .load(), viene semplicemente mostrata la stringa e non esegue il PHP.

Cercando in giro, ho trovato un paio di post correlati:

chiamare shortcode in javascript Perché il 'do_shortcode' di un plugin potrebbe non funzionare in una richiesta AJAX?

Purtroppo non ho una reputazione abbastanza alta per contribuire con commenti a quei post, quindi sto aprendo una nuova domanda.

Qualcuno può aiutarmi a spiegare questo in modo molto semplificato a qualcuno che non ha molta familiarità con PHP?

Don't Wake Me Up

51

plugin shortcode ajax

Commenti

Cosa stai provando a caricare con .load()? Per favore posta tutto il codice rilevante.

s_ha_dum

3 ago 2013 21:32:16

Quando provo a caricare un file php che contiene il codice sopra ( <?php echo do_shortcode('[metaslider id="8302"]'); ?> )

In questo modo: $('.homepage__slider').load('wp-content/themes/mytheme/slider.php');

Don't Wake Me Up

3 ago 2013 21:49:10

Tutte le risposte alla domanda

Commenti

Grazie per il post dettagliato. Sono davvero molto scarso con php e javascript, quindi onestamente non ha avuto molto senso per me anche se la tua spiegazione sembra piuttosto approfondita. Sono riuscito a farlo funzionare quasi - il slideshow si carica, ma è instabile. Come se non stesse caricando tutte le risorse necessarie per funzionare correttamente (le immagini non hanno la dimensione corretta, gli oggetti che dovrebbero essere nascosti non lo sono, ecc.). Ho provato ad aggiungere manualmente il javascript e il css del plugin, ma senza successo.

Don't Wake Me Up

4 ago 2013 12:05:40

Sembra non avere nulla a che fare con le risorse - se carico due versioni dello slider sulla stessa pagina, in questo modo e nel modo regolare con shortcode così che tutte le risorse siano caricate di sicuro, la versione ajax risulta comunque difettosa.

Don't Wake Me Up

4 ago 2013 12:10:40

Per essere più precisi, la versione ajax sta producendo un mucchio di html nello slide che non è presente nella versione regolare con shortcode. Questi includono div con la classe thumbnail, delete slide, campi di input per le didascalie, ecc. - quasi come se fosse una versione amministrativa dello slide.

Don't Wake Me Up

4 ago 2013 12:28:51

Se esiste una versione "admin" dello slideshow e quella viene caricata, dovrai individuare il codice che la controlla. Presumo che stia caricando qualcosa di diverso quando is_admin() === true, ma tutte le richieste API AJAX sono "admin".

s_ha_dum

4 ago 2013 18:43:55

s_ha_dum 65.5K · Answer 1 · 2013-08-03T23:18:56Z

Non puoi caricare un file direttamente in questo modo:

$('.homepage__slider').load('wp-content/themes/mytheme/slider.php');

Inoltre, nota che WordPress carica jQuery in modalità noConflict, quindi l'alias $ non funziona.

Se carichi un file direttamente, nessuna delle funzioni di WordPress funzionerà. Dovresti utilizzare l'API AJAX in modo che tutto venga caricato nel contesto di WordPress.

Dovresti racchiudere il tuo codice PHP di elaborazione in una funzione:

function my_ajax_shortcode_wpse_108874() {
    echo do_shortcode('[metaslider id="8302"]');
    die;
}

Collega questa funzione al sistema AJAX:

add_action('wp_ajax_my_ajax_shortcode', 'my_ajax_shortcode_wpse_108874()');
add_action('wp_ajax_nopriv_my_ajax_shortcode', 'my_ajax_shortcode_wpse_108874()');

Invia la tua richiesta a http://site/wp-admin/admin-ajax.php e passa my_ajax_shortcode come argomento quando Javascript effettua una richiesta.

var data = {
    action: 'my_ajax_shortcode'
};
jQuery.post(ajax_url, data, function(response) {
    // fai quello che ti serve; magari nulla
});

Puoi impostare ajax_url in modo simile a questo esempio dal Codex:

add_action( 'admin_enqueue_scripts', 'my_enqueue' );
function my_enqueue($hook) {
    if( 'index.php' != $hook ) return;  // Solo per il pannello della dashboard

    wp_enqueue_script( 'ajax-script', plugins_url( '/js/my_query.js', __FILE__ ), array('jquery'));

    // in javascript, le proprietà dell'oggetto sono accessibili come ajax_object.ajax_url, ajax_object.we_value
    wp_localize_script( 'ajax-script', 'ajax_object',
            array( 'ajax_url' => admin_url( 'admin-ajax.php' ), 'we_value' => 1234 ) );
}