Funkce wp_enqueue_script vytváří odkaz na script, který jste již dříve zaregistrovali pomocí wp_register_script. Jedná se o jediný správný způsob, jak vkládat do šablony například jQuery, protože WordPress kontroluje zaregistrované scripty a nedochází tak k opakovanému načtení stejného scriptu.
wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );
Parametry:
$handle – vyžadováno, obsahuje jméno scriptu, pod kterým je zaregistrován. Pokud jste tedy zaregistrovali script pod jménem „slider“, pod stejným jménem ho budete volat v této funkci.
$src – cesta ke scriptu. Povinná je pouze v tom případě, že jste ji již nedefinovali v wp_register_script. V žádném případě v cestě nepoužívejte pevné pojmenování url, ale v případě pluginu funkci plugins_url a v šabloně get_template_directory_uri.
$deps – pomocí tohoto parametru můžete ovlivnit řazení vkládaných scriptů a určit, který soubor se vkládá dříve. Použijte pouze, pokud jste jej nedefinovali v wp_register_sript.
$ver – zde můžete definovat verzi scriptu a defaultně je nastavena na false. V tom případě WordPress automaticky přidává do url verzi instalace WordPressu. Pokud chcete link bez uvedení verze, nastavte na null.
$in_footer – určuje, zda se bude script načítat v head, nebo footer. Pokud je true, načte se v patičce. Defaultně je false.
Několik příkladů z WordPress.org
Protože jsem na toto téma již článek napsal – Jak vložit javascript do šablony, uvedu jen příklady, které článek rozšiřují.
Vložení js souboru, který je již ve WordPressu vložen a zaregistrován:
function my_scripts_method() {
wp_enqueue_script( 'scriptaculous' );
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
Akce wp_enqueue, kterou zde voláme, se vztahuje jen k frontendu. Pokud potřebujeme soubory vložit do administrace, musíme použít hook admin_enqueue_scripts.
Vložení scriptu v závislosti na jQuery
Řada vkládaných scriptů je závislá na některé z knihoven, jako je jQuery. Pokud použijeme parametr $deps, vloží se script pouze, pokud již bylo vloženo jQuery.
function my_scripts_method() {
wp_enqueue_script(
'custom-script',
get_stylesheet_directory_uri() . '/js/custom_script.js',
array( 'jquery' )
);
}
add_action( 'wp_enqueue_scripts', 'my_scripts_method' );
Vložení scriptu do patičky bez závislosti na jiném souboru
add_action( 'wp_enqueue_scripts', 'child_add_scripts' );
function child_add_scripts() {
wp_register_script(
'google-analytics',
get_stylesheet_directory_uri() . '/google_analytics_object.js',
false,
'1.0',
true
);
wp_enqueue_script( 'google-analytics' );
}
Scripty, které WordPress již obsahuje a vkládá:
Při instalaci již WordPress obsahuje řadu scriptů, které využívá v administraci a pro funkce webu. Zde je seznam všech scriptů, které tak můžete použít ve svých šablonách a pluginech:
| Jméno | Handle | Závislost |
| Image Cropper | Image cropper | |
| Jcrop | jcrop | |
| SWFObject | swfobject | |
| SWFUpload | swfupload | |
| SWFUpload Degrade | swfupload-degrade | |
| SWFUpload Queue | swfupload-queue | |
| SWFUploadHandlers | swfupload-handlers | |
| jQuery | jquery | json2 (for AJAX calls) |
| jQuery Form | jquery-form | jquery |
| jQuery Color | jquery-color | jquery |
| jQuery Masonry | jquery-masonry | jquery |
| jQuery UI Core | jquery-ui-core | jquery |
| jQuery UI Widget | jquery-ui-widget | jquery |
| jQuery UI Mouse | jquery-ui-mouse | jquery |
| jQuery UI Accordion | jquery-ui-accordion | jquery |
| jQuery UI Autocomplete | jquery-ui-autocomplete | jquery |
| jQuery UI Slider | jquery-ui-slider | jquery |
| jQuery UI Tabs | jquery-ui-tabs | jquery |
| jQuery UI Sortable | jquery-ui-sortable | jquery |
| jQuery UI Draggable | jquery-ui-draggable | jquery |
| jQuery UI Droppable | jquery-ui-droppable | jquery |
| jQuery UI Selectable | jquery-ui-selectable | jquery |
| jQuery UI Position | jquery-ui-position | jquery |
| jQuery UI Datepicker | jquery-ui-datepicker | jquery |
| jQuery UI Resizable | jquery-ui-resizable | jquery |
| jQuery UI Dialog | jquery-ui-dialog | jquery |
| jQuery UI Button | jquery-ui-button | jquery |
| jQuery UI Effects | jquery-effects-core | jquery |
| jQuery UI Effects – Blind | jquery-effects-blind | jquery-effects-core |
| jQuery UI Effects – Bounce | jquery-effects-bounce | jquery-effects-core |
| jQuery UI Effects – Clip | jquery-effects-clip | jquery-effects-core |
| jQuery UI Effects – Drop | jquery-effects-drop | jquery-effects-core |
| jQuery UI Effects – Explode | jquery-effects-explode | jquery-effects-core |
| jQuery UI Effects – Fade | jquery-effects-fade | jquery-effects-core |
| jQuery UI Effects – Fold | jquery-effects-fold | jquery-effects-core |
| jQuery UI Effects – Highlight | jquery-effects-highlight | jquery-effects-core |
| jQuery UI Effects – Pulsate | jquery-effects-pulsate | jquery-effects-core |
| jQuery UI Effects – Scale | jquery-effects-scale | jquery-effects-core |
| jQuery UI Effects – Shake | jquery-effects-shake | jquery-effects-core |
| jQuery UI Effects – Slide | jquery-effects-slide | jquery-effects-core |
| jQuery UI Effects – Transfer | jquery-effects-transfer | jquery-effects-core |
| MediaElement.js (WP 3.6+) | wp-mediaelement | jquery |
| jQuery Schedule | schedule | jquery |
| jQuery Suggest | suggest | jquery |
| ThickBox (modified) | thickbox | |
| jQuery HoverIntent | hoverIntent | jquery |
| jQuery Hotkeys | jquery-hotkeys | jquery |
| Simple AJAX Code-Kit | sack | |
| QuickTags | quicktags | |
| Iris (Colour picker) | iris | jquery |
| Farbtastic (deprecated) | farbtastic | jquery |
| ColorPicker (deprecated) | colorpicker | jquery |
| Tiny MCE | tiny_mce | |
| Autosave | autosave | |
| WordPress AJAX Response | wp-ajax-response | |
| List Manipulation | wp-lists | |
| WP Common | common | |
| WP Editor | editorremov | |
| WP Editor Functions | editor-functions | |
| AJAX Cat | ajaxcat | |
| Admin Categories | admin-categories | |
| Admin Tags | admin-tags | |
| Admin custom fields | admin-custom-fields | |
| Password Strength Meter | password-strength-meter | |
| Admin Comments | admin-comments | |
| Admin Users | admin-users | |
| Admin Forms | admin-forms | |
| XFN | xfn | |
| Upload | upload | |
| PostBox | postbox | |
| Slug | slug | |
| Post | post | |
| Page | page | |
| Link | link | |
| Comment | comment | |
| Threaded Comments | comment-reply | |
| Admin Gallery | admin-gallery | |
| Media Upload | media-upload | |
| Admin widgets | admin-widgets | |
| Word Count | word-count | |
| Theme Preview | theme-preview | |
| JSON for JS | json2 | |
| Plupload Core | plupload | |
| Plupload All Runtimes | plupload-all | |
| Plupload HTML4 | plupload-html4 | |
| Plupload HTML5 | plupload-html5 | |
| Plupload Flash | plupload-flash | |
| Plupload Silverlight | plupload-silverlight | |
| Underscore js | underscore | |
| Backbone js | backbone |
Využití takových scriptů vám určitě usnadní práci na šablonách a můžete využívat řadu funkcí, které již WordPress v základu má.