Aggiungere stili e script in WordPress

Spesso accade, quando si sviluppa un tema o un plugin, di dover aggiungere stili e script nell’intestazione dell’admin panel di WordPress. Può capitare, ad esempio, di dover inserire una Google Map nella pagine di modifica dei post. Oppure di dover utilizzare una libreria JS…

WP offre diversi action hook adatti allo scopo. Tra tutti, trovavo particolarmente utili i seguenti:

admin_print_scripts-{$hook_suffix}
admin_print_styles-{$hook_suffix}

dove {$hook_suffix} è il nome del file .php. Quindi, per caricare script e librerie nelle schede di acquisizione e modifica dei post, sono necessari quattro hook:

add_action( 'admin_print_styles-post.php', 'my_admin_enqueue_styles' );
add_action( 'admin_print_styles-post-new.php', 'my_admin_enqueue_styles' );
add_action( 'admin_print_scripts-post.php', 'my_admin_enqueue_scripts' );
add_action( 'admin_print_scripts-post-new.php', 'my_admin_enqueue_scripts' );

In questo modo, però, le librerie verranno accodate indipendentemente dal tipo di post (post, pagina o ‘custom post type’). Una conseguenza indesiderata potrebbe verificarsi se tra le librerie vi è la Google Maps API. Infatti, la Maps API V3 genera l’errore “a is undefined” quando non viene individuato l’elemento del DOM che ospiterà la mappa. In WP 3.3 questo errore impedisce il corretto funzionamento del menu di amministrazione.

La GMaps API in errore blocca il menu di amministrazione di WP 3.3

Per evitare errori imprevisti, come questo generato dalla Maps API, è opportuno individuare con maggior precisione la scheda dell’admin panel. La soluzione utilizzata dal sottoscritto è la seguente:

add_action('admin_enqueue_scripts', 'eye_admin_enqueue_scripts' );
function eye_admin_enqueue_scripts( $hook ) {
  if( ('custom_event' != get_post_type()) || ('edit.php' == $hook) )
    return;
  // enqueue GMaps API
  wp_enqueue_script('google-maps-api', 'http://maps.googleapis.com/maps/api/js?sensor=false' );
}

L’action hook è admin_enqueue_scripts. Questo esegue la callback al caricamento di ogni pagina dell’admin panel. Il primo task della funzione decide se interromperne l’esecuzione o continuare con l’incorporazione degli stili e delle librerie. La condizione di questo esempio provvede a testare sia il tipo di post, sia il nome del file .php. Ora saremo sicuri che la libreria sarà caricata solo nel tipo di post custom_event, escludendo l’elenco dei post dell’admin panel, generato dalla pagina edit.php.

Annunci