web-dev-qa-db-fra.com

script de mise en file d'attente pour un shortcode spécifique

J'ai créé des codes courts et pour certains d'entre eux, je dois charger des scripts particuliers à la demande.

J'ai inclus par défaut dans mon fichier function.php

vendor.js
myscript.js

Lorsque je charge le shortcode, je dois inclure un script séparé entre les deux précédents (ce qui signifie que myscript.js nécessite l'inclusion du nouveau script avant qu'il ne fonctionne).

J'ai créé le shortcode comme ceci:

function callbackService()
{
    ob_start();    
    get_template_part('hg_custom_shortcodes/callback');
    return ob_get_clean();   
}
add_shortcode('callbackService', 'callbackService');

le modèle charge une application angulaire.

J'ai ensuite essayé de charger mon script (celui qui ne doit être inclus que lorsque le shortcode est chargé) en modifiant l'extrait de code ci-dessus:

function callbackService()
{
    ob_start();    
    wp_enqueue_script('angular-bundle', get_template_directory_uri() . '/scripts/angular-bundle.js', array(), false, true);
    get_template_part('hg_custom_shortcodes/callback');
    return ob_get_clean();   
}
add_shortcode('callbackService', 'callbackServhowever

Le script est inclus, mais je pense qu'il est inclus après myscript.js et que l'intégralité du shortcode (application angulaire) ne fonctionne pas en tant que "angulaire n'est pas définie".

Comment puis-je dire à la file d'attente de charger le script après? Je sais que d'habitude je changerais la priorité add_action(), mais dans ce cas particulier, aucun add_action n'est impliqué et je ne sais pas quoi essayer d'autre.

Aucune suggestion? Merci

theme-developmentshortcode
4
Nick

wp_enqueue_script ne va pas fonctionner dans un shortcode, c'est à cause de l'ordre de chargement.

Vous pouvez utiliser wp_register_script, puis wp_enqueue_script dans votre fonction de shortcode comme dans cet exemple:

// Front-end
function front_end_scripts() {
    wp_register_script( 'example-js', '//example.com/shared-web/js/example.js', array(), null, true );
}
add_action( 'wp_enqueue_scripts', 'front_end_scripts' );

Ensuite, vous utilisez ceci dans votre shortcode:

function example_shortcode() {

   wp_enqueue_script( 'example-js' );
   return; // dont forget to return something

}
add_shortcode( 'example-shortcode', 'example_shortcode' );

De plus, vous pouvez utiliser has_shortcode pour vérifier si un shortcode est chargé:

function custom_shortcode_scripts() {
global $post;
if( is_a( $post, 'WP_Post' ) && has_shortcode( $post->post_content, 'custom-shortcode') ) {
    wp_enqueue_script( 'custom-script');
}
}
add_action( 'wp_enqueue_scripts', 'custom_shortcode_scripts');
5
Remzi Cavdar

Est-ce que has_shortcode vous aiderait à résoudre votre problème?

Sur le codex, il y a un exemple,

Mettre un script en file d'attente quand un message utilise un shortcode

function custom_shortcode_scripts() {
    global $post;
    if( is_a( $post, 'WP_Post' ) && has_shortcode( $post->post_content, 'custom-shortcode') ) {
        wp_enqueue_script( 'custom-script');
    }
}
add_action( 'wp_enqueue_scripts', 'custom_shortcode_scripts');
2
Antti Koskinen