Xin chào mọi người, Trong bài đăng này, chúng ta sẽ xem xét cách giải quyết vấn đề Wordpress Wp_Enqueue_Script Footer bằng ngôn ngữ máy tính
Meaning:
Wordpress Wp_Enqueue_Script Footer đã được giải quyết bằng một số tình huống, như chúng ta đã thấy
Làm cách nào để liệt kê một tập lệnh trong chân trang WordPress?
Để thêm tập lệnh vào chân trang hoặc cuối trang WordPress, tất cả những gì bạn cần làm là đặt tham số $in_footer thành true. Chúng tôi cũng đã sử dụng một chức năng khác get_template_directory_uri[] trả về URL cho thư mục mẫu. 04-Oct-2013
wp_enqueue_script trong WordPress là gì?
wp_enqueue_script[ $handle, $src, $deps, $ver, $in_footer ];
Tại sao wp_enqueue_script[] được sử dụng?
wp_enqueue_scripts là hook thích hợp để sử dụng khi liệt kê các tập lệnh và kiểu có nghĩa là xuất hiện ở giao diện người dùng. Bất chấp cái tên, nó được sử dụng để liệt kê cả tập lệnh và kiểu
Làm cách nào để di chuyển jquery đến chân trang trong WordPress?
function move_jquery_to_footer[] { wp_scripts[]->add_data[ 'jquery', 'group', 1 ];
Wp_footer[] làm gì trong code WordPress?
In tập lệnh hoặc dữ liệu trước thẻ nội dung đóng ở giao diện người dùng. 29-Jun-2022
Wp_head trong WordPress là gì?
Hàm wp_head[] mà cái nhìn thấy trong tất cả các tiêu đề. php, chỉ đơn giản là kích hoạt hook do_action['wp_head']. Các tệp cốt lõi của WordPress sau đó móc nó nhiều lần để in đầu, Sao chép mã Mở rộng. 26-Oct-2017
Làm cách nào để thêm liên kết CDN trong WordPress?
Tích hợp CDN WordPress
- Tạo vùng kéo
- Đăng nhập vào bảng điều khiển quản trị viên WordPress của bạn
- Chuyển đến cài đặt Trình kích hoạt CDN
- Cập nhật cài đặt Tên máy chủ CDN với Bí danh Khu vực của bạn [e. g. cdn. thí dụ. com ] hoặc URL vùng [e. g. ví dụ-hexid. kxcdn. com ]
- Nhấp vào Lưu thay đổi và xác thực cấu hình
Trang có phải là sên không?
Sên là một phần của URL xác định một trang cụ thể trên trang web ở dạng dễ đọc. Nói cách khác, đó là một phần của URL giải thích nội dung của trang. Ví dụ, đối với bài viết này, URL là https. // sữa chua. com/slug, và slug đơn giản là 'slug'. 18-Tháng 9-2019
Trong WordPress, thay vì chỉ thêm những thứ này vào tiêu đề, bạn nên sử dụng một phương pháp gọi là enqueueing, đây là cách xử lý tài sản của bạn được tiêu chuẩn hóa với phần thưởng bổ sung là quản lý các phụ thuộc. Tìm hiểu cách thực hiện bên dưới bằng cách sử dụng
add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
2- Cách hoạt động của Enqueueing
- Khái niệm cơ bản về Enqueueing Với wp_enqueue_scripts
- Quản lý phụ thuộc
- Tải tập lệnh ở chân trang
- Chỉ định phương tiện cho kiểu
Cách hoạt động của Enqueueing
Có hai bước được thực hiện khi liệt kê một tập lệnh hoặc một kiểu. Trước tiên, bạn đăng ký nó – hãy nói với WordPress rằng nó ở đó – và sau đó bạn thực sự đưa nó vào hàng đợi, điều này cuối cùng sẽ đưa nó vào tiêu đề hoặc ngay trước thẻ đóng nội dung
Lý do có hai bước liên quan đến tính mô đun. Đôi khi, bạn sẽ muốn cho WordPress biết về một nội dung, nhưng bạn có thể không muốn sử dụng nội dung đó trên mọi trang. Ví dụ. Nếu bạn đang xây dựng mã ngắn thư viện tùy chỉnh sử dụng Javascript, bạn thực sự chỉ cần tải JS khi mã ngắn được sử dụng – có thể không phải trên mọi trang
Cách để thực hiện điều này là đăng ký tập lệnh trước và chỉ thực sự đưa nó vào hàng đợi khi mã ngắn được hiển thị [nên đọc. Hướng dẫn cơ bản về mã ngắn WordPress]
Khái niệm cơ bản về Enqueueing Với wp_enqueue_scripts
Để liệt kê các tập lệnh và kiểu ở giao diện người dùng, bạn sẽ cần sử dụng móc nối
add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
2. Trong chức năng móc nối, bạn có thể sử dụng các chức năng add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
4, add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
0, add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
1 và add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
2add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_register_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_register_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
wp_enqueue_style[ 'custom-gallery' ];
wp_enqueue_script[ 'custom-gallery' ];
}
Trong ví dụ trên, tôi đã đăng ký và liệt kê các nội dung trong cùng một chức năng, điều này hơi dư thừa. Trên thực tế, bạn có thể sử dụng các hàm enqueue để đăng ký và enqueue ngay lập tức bằng cách sử dụng các đối số giống như bạn làm trong các hàm đăng ký
add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
Nếu tôi tách hai chức năng, tôi sẽ làm như vậy bằng cách sử dụng chúng trong các hook khác nhau. Trong một ví dụ thực tế, chúng ta có thể sử dụng hook
add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
2 để đăng ký nội dung và chức năng của mã ngắn để đưa chúng vào hàng đợiadd_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_register_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_register_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
add_shortcode[ 'custom_gallery', 'custom_gallery' ];
function custom_gallery[ $atts ]{
wp_enqueue_style[ 'custom-gallery' ];
wp_enqueue_script[ 'custom-gallery' ];
// Gallery code here
}
Quản lý phụ thuộc
Cơ chế xếp hàng của WordPress có hỗ trợ tích hợp để quản lý phụ thuộc, sử dụng đối số thứ ba của cả hai hàm
add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
1 và add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
4. Bạn cũng có thể sử dụng ngay các hàm xếp hàng nếu không cần tách chúng raTham số thứ ba là một mảng các tập lệnh/kiểu đã đăng ký cần được tải trước khi nội dung hiện tại được đưa vào hàng đợi. Ví dụ của chúng tôi ở trên hầu hết có thể dựa vào jQuery, vì vậy hãy xác định điều đó ngay bây giờ
Đăng kí để nhận thư mới
Bạn muốn biết làm thế nào chúng tôi tăng lưu lượng truy cập của mình hơn 1000%?
Tham gia cùng hơn 20.000 người khác nhận bản tin hàng tuần của chúng tôi với các mẹo nội bộ về WordPress
Theo dõi ngay________số 8Chúng tôi không cần phải đăng ký hoặc tự liệt kê jQuery vì nó đã là một phần của WordPress. Bạn có thể tìm thấy danh sách các tập lệnh và kiểu có sẵn trong WordPress trong Codex
Nếu bạn có các phần phụ thuộc của riêng mình, bạn sẽ cần phải đăng ký chúng, nếu không, tập lệnh của bạn sẽ không tải được. Đây là một ví dụ
add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ], array[ 'jquery' ] ];
wp_enqueue_script[ 'custom-gallery-lightbox', plugins_url[ '/js/gallery-lightbox.js' , __FILE__ ], array[ 'custom-gallery' ] ];
}
Giả sử rằng tập lệnh đầu tiên là một thư viện, tập lệnh thứ hai là phần mở rộng của tập lệnh giúp hình ảnh mở ra trong hộp đèn. Lưu ý rằng mặc dù tập lệnh thứ hai của chúng tôi dựa trên jQuery, nhưng chúng tôi không cần chỉ định điều này, vì tập lệnh đầu tiên của chúng tôi đã tải jQuery. Điều đó nói rằng, có thể nên nêu rõ tất cả các phụ thuộc, chỉ để đảm bảo rằng không có gì có thể bị hỏng nếu bạn quên bao gồm một phụ thuộc
WordPress hiện biết chúng tôi cần tập lệnh nào và có thể tính toán thứ tự chúng cần được thêm vào trang
Tải tập lệnh ở chân trang
Bất cứ khi nào bạn có thể thoát khỏi việc tải tập lệnh ở chân trang, bạn nên. Điều này làm tăng thời gian tải trang rõ ràng và có thể ngăn trang web của bạn bị treo trong khi tải tập lệnh, đặc biệt nếu chúng chứa lệnh gọi AJAX
Cơ chế xếp hàng có thể thêm tập lệnh vào chân trang bằng tham số thứ năm [tham số thứ tư là số phiên bản tùy chọn]. Ví dụ của chúng tôi ở trên sẽ tải các tập lệnh ở chân trang nếu chúng tôi sửa đổi nó một chút
add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
0Chỉ định đúng làm tham số thứ năm sẽ đặt tập lệnh ở chân trang, sử dụng sai hoặc bỏ qua tham số sẽ tải mọi thứ trong tiêu đề. Như tôi đã đề cập trước đây, bất cứ khi nào có thể, hãy tải tập lệnh ở chân trang
Chỉ định phương tiện cho kiểu
Sử dụng tham số thứ năm của chức năng đăng ký kiểu dáng/chức năng enqueue, bạn có thể kiểm soát loại phương tiện mà tập lệnh đã được xác định cho [in, màn hình, thiết bị cầm tay, v.v. ]. Bằng cách sử dụng tham số này, bạn có thể hạn chế tải các kiểu đối với loại phương tiện cụ thể, đây là một thủ thuật tối ưu hóa nhỏ hữu ích
add_action[ 'wp_enqueue_scripts', 'my_plugin_assets' ];
function my_plugin_assets[] {
wp_enqueue_style[ 'custom-gallery', plugins_url[ '/css/gallery.css' , __FILE__ ] ];
wp_enqueue_script[ 'custom-gallery', plugins_url[ '/js/gallery.js' , __FILE__ ] ];
}
1Để biết danh sách đầy đủ các loại phương tiện có thể được sử dụng, hãy xem thông số kỹ thuật CSS
Bản tóm tắt
Enqueueing tài sản là một cách mạnh mẽ để xử lý chúng. Nó cung cấp cho bạn và các nhà sản xuất plugin/chủ đề khác, nhiều quyền kiểm soát hơn đối với toàn bộ hệ thống và loại bỏ việc quản lý phụ thuộc khỏi tầm tay của bạn
Nếu điều đó vẫn chưa đủ, đó là cách để thêm nội dung của bạn, nhiều thị trường chủ đề và chính kho lưu trữ WordPress sẽ không phê duyệt công việc của bạn nếu bạn không sử dụng phương pháp này
Nhận tất cả các ứng dụng, cơ sở dữ liệu và trang web WordPress của bạn trực tuyến và dưới một mái nhà. Nền tảng đám mây hiệu suất cao, đầy đủ tính năng của chúng tôi bao gồm
- Dễ dàng thiết lập và quản lý trong bảng điều khiển MyKinsta
- Hỗ trợ chuyên gia 24/7
- Mạng và phần cứng Google Cloud Platform tốt nhất, được cung cấp bởi Kubernetes để có khả năng mở rộng tối đa
- Tích hợp Cloudflare cấp doanh nghiệp cho tốc độ và bảo mật
- Tiếp cận đối tượng toàn cầu với tối đa 35 trung tâm dữ liệu và hơn 275 PoP trên toàn thế giới
Hãy tự kiểm tra với $20 trong tháng đầu tiên của Lưu trữ ứng dụng hoặc Lưu trữ cơ sở dữ liệu. Khám phá kế hoạch của chúng tôi hoặc nói chuyện với bộ phận bán hàng để tìm thấy sự phù hợp nhất của bạn