Thêm file javascript vào Wordpress

Đăng bởi Neo trong mục Hướng dẫn vào 26 tháng 9, 2010 | Comments

Có rất nhiều bạn muốn sử dụng jquery plugin vào blog Wordpress hỏi tôi cách để thêm các file plugin. Có bạn thêm thẳng vào file header.php, có bạn dùng plugin... Trong bài hướng dẫn này tôi sẽ chi cho bạn cách sử dụng (tôi cho là) đúng nhất.

Trong Wordpress đã có sẵn jQuery, nhưng khi bạn cài mới một blog Wordpress thì sẽ không thấy jQuery được gắn thêm vào. Bạn có thể gọi jQuery nhờ đoạn mã sau:

wp_enqueue_script('jquery');

Cấu trúc của hàm wp_enqueue_script:

wp_enqueue_script( $handle, $src, $deps, $ver, $in_footer );

Trong đó:

  • $handle: tên file javascript (duy nhất)
  • $src: Link tới file javascript
  • $deps: file javascript của bạn có phụ thuộc vào file khác không, khai báo ở đây
  • $ver: phiên bản của javascript file (thường dùng cho các javascript framework như jquery, mootools...)
  • $in_footer: Thêm file javascript này vào footer thay vì phần header

Như vậy, nếu bạn muốn đưa thêm file javascript vào Wordpress, có thể dùng như sau:

wp_enqueue_script('ntuts_test_file', '/duong-dan/js/ntuts.js', array('jquery'));

Gọi hàm wp_enqueue_script ở đâu?

Như thường lệ, bạn sẽ gọi hàm này ở functions.php của theme. Giả sử tôi gọi file ntuts.js ở trong thư mục js của theme, tôi sẽ thêm vào functions.php như sau:

function ntuts_scripts() {
   //wp_enqueue_script('jquery'); /* không cần thiết vì bên dưới file ntuts.js đã phụ thuộc vào jquery */
   wp_enqueue_script('ntuts_test_file', get_bloginfo('template_directory').'/js/ntuts.js', array('jquery'));
}    
add_action('init', 'ntuts_scripts');

Như bạn thấy, tôi đặt hàm wp_enqueue_script trong hàm ntuts_scripts(), tên của hàm này bạn có thể tự đặt theo ý của mình, quan trọng là bạn phải đặt nó vào add_action.

Bạn có thích bài viết này?

Neo's picture

Neo

Nhìn mặt trời từ năm 1984 nhưng tới tận 2002 mới được thấy cái máy tính đầu tiên của mình. Đầu năm 2007 thì quyết định theo cái nghề cao quý là thiết kế web Big Grin. Hiện mình đang sống tại Hà Nội. Sở thích: làm website và giúp đỡ mọi người phát triển website theo chiều hướng tốt đẹp hơn.

Trang chủ - Twitter