Làm cách nào để bật javascript trong wordpress?

Nếu bạn muốn nâng cao chức năng giao diện người dùng của trang web WordPress, bạn sẽ cần thêm JavaScript vào trang web của mình—cho dù bạn đang sử dụng thư viện của bên thứ ba hay tập lệnh tùy chỉnh.  

Show

Dựa trên mục tiêu và kiến ​​thức mã hóa của mình, bạn có thể chọn từ một số kỹ thuật để thêm JavaScript tùy chỉnh vào WordPress, từ việc sử dụng plugin đến đính kèm tập lệnh tùy chỉnh vào các hook hành động khác nhau.  

Cách thêm JavaScript tùy chỉnh vào trang web WordPress của bạn

Làm cách nào để bật javascript trong wordpress?

Trong hướng dẫn này, chúng ta sẽ xem xét từng phương pháp, xem cách chúng hoạt động và giải thích khi nào bạn nên sử dụng phương pháp nào

  • Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?

    Cách thêm CSS tùy chỉnh vào trang web WordPress của bạn

    Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?

    Anna Monus

    18 Th02 2020

  • Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?

    Cách tạo chủ đề con WordPress

    Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?

    Rachel McCollin

    23 Tháng năm 2019

  • Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?

    Cách xóa "Được cung cấp bởi WordPress" khỏi Chân trang

    Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?
    Làm cách nào để bật javascript trong wordpress?

    Jessica Thorsby

    23 Thg 12 2019

Thêm JavaScript tùy chỉnh vào WordPress

Mặc dù bạn có thể sử dụng Trình tùy chỉnh tích hợp của WordPress để thêm CSS tùy chỉnh vào chủ đề của mình, nhưng bạn không thể làm điều tương tự với JavaScript. Để thêm JavaScript tùy chỉnh vào trang web WordPress của bạn, bạn cần sử dụng plugin hoặc chỉnh sửa chức năng của chủ đề (con) của mình. tập tin php. Chúng tôi sẽ xem xét chi tiết cả hai tùy chọn, nhưng đây là một bản tóm tắt ngắn

1. Bạn có thể sử dụng các loại plugin khác nhau để thêm JavaScript tùy chỉnh vào WordPress.  

  • plugin để chỉnh sửa các mẫu đầu trang và chân trang
  • plugin để thêm mã JS tùy chỉnh vào WordPress
  • plugin dành riêng cho tập lệnh để thêm và định cấu hình tập lệnh của bên thứ ba, chẳng hạn như Google Analytics hoặc AdSense

2. Hoặc bạn có thể sử dụng các hàm và hook của WordPress trong các hàm. tệp php

  • móc hành động 
    /* Custom script with no dependencies, enqueued in the header */
    add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
    function tutsplus_enqueue_custom_js() {
        wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
    }
    1 và 
    /* Custom script with no dependencies, enqueued in the header */
    add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
    function tutsplus_enqueue_custom_js() {
        wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
    }
  • móc hành động 
    /* Custom script with no dependencies, enqueued in the header */
    add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
    function tutsplus_enqueue_custom_js() {
        wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
    }
    3 , 
    /* Custom script with no dependencies, enqueued in the header */
    add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
    function tutsplus_enqueue_custom_js() {
        wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
    }
    4 và
    /* Custom script with no dependencies, enqueued in the header */
    add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
    function tutsplus_enqueue_custom_js() {
        wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
    }
    0
  • chức năng 
    /* Custom script with no dependencies, enqueued in the header */
    add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
    function tutsplus_enqueue_custom_js() {
        wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
    }
    1 WordPress

Một điều bạn không bao giờ nên làm

Mặc dù cách dễ nhất để thêm tập lệnh tùy chỉnh vào trang web WordPress của bạn là thả thẻ

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
2 trực tiếp vào tiêu đề của bạn. php hoặc chân trang. php tệp mẫu, bạn không bao giờ nên làm như vậy. Điều này là do WordPress có trình tự tải cụ thể cần được tôn trọng trong mọi trường hợp.  

Nếu bạn chèn JavaScript tùy chỉnh trực tiếp vào mẫu đầu trang hoặc chân trang, điều này có thể gây ra xung đột với chủ đề, plugin chạy trên trang web của bạn hoặc lõi WordPress. Thay vào đó, bạn nên sử dụng một trong những kỹ thuật chi tiết trong bài viết này.  

Vì vậy, đừng bao giờ thêm một dòng như dòng sau vào tiêu đề của bạn. php hoặc chân trang. php (ngay cả khi bạn có thể làm điều đó về mặt kỹ thuật)

1. Sử dụng Plugin để thêm JavaScript tùy chỉnh vào WordPress 

Sử dụng plugin là phương pháp được đề xuất khi bạn

  • không muốn chỉnh sửa trực tiếp các tệp nguồn
  • muốn thêm JavaScript độc lập với chủ đề mà bạn có thể giữ ngay cả khi quyết định chuyển sang chủ đề mới

Bạn có thể sử dụng các loại plugin khác nhau để thêm JavaScript tùy chỉnh vào trang web WordPress của mình

1. 1. Plugin để chỉnh sửa tiêu đề. php và chân trang. php

Tùy chọn đầu tiên là sử dụng plugin cho phép bạn chỉnh sửa tệp mẫu đầu trang và chân trang của chủ đề WordPress của bạn. Nếu muốn thêm các tập lệnh tải trước nội dung trang, chẳng hạn như tập lệnh phân tích và theo dõi, bạn cần chỉnh sửa mẫu tiêu đề, trong khi các tập lệnh tải sau nội dung sẽ đi vào mẫu chân trang. Thông thường, khi tập lệnh của bạn sửa đổi một thành phần được hiển thị trên trang của bạn, chẳng hạn như tập lệnh thư viện hình ảnh, thì tập lệnh đó sẽ được đặt ở cuối trang

Chèn đầu trang và chân trang là một ví dụ điển hình về plugin cho phép bạn chỉnh sửa các mẫu đầu trang và chân trang. Nó có giao diện người dùng đơn giản chỉ với hai vùng văn bản—một dành cho tiêu đề và một dành cho tập lệnh chân trang. Nó thêm tập lệnh của bạn vào móc hành động

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 hoặc
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
2.  

Bạn có thể chèn bất kỳ loại tập lệnh nào vào hai trường nhập liệu. Bạn cần phải đính kèm các tập lệnh của mình bằng thẻ

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
5. Ngoài ra, bạn cũng có thể sử dụng plugin này để thêm CSS tùy chỉnh vào mẫu tiêu đề của mình—bạn chỉ cần đính kèm nó với thẻ
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
6 (lưu ý rằng CSS phải luôn được thêm vào tiêu đề)

Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?

1. 2. Plugin để thêm JavaScript tùy chỉnh

Một tùy chọn khác là chọn plugin cho phép bạn thêm JavaScript tùy chỉnh vào trang web WordPress của mình. Các plugin này rất giống với plugin chỉnh sửa đầu trang và chân trang và hầu hết trong số chúng cũng sử dụng móc hành động 

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 và 
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
2 . Tuy nhiên, chúng thường cung cấp cho bạn nhiều tùy chọn cấu hình hơn

Ví dụ: plugin Simple Custom CSS và JS cho phép bạn xác định permalink cho các tệp JavaScript tùy chỉnh của mình, lưu chúng vào thư mục wp-content/, quản lý tập lệnh của bạn dưới dạng loại bài đăng tùy chỉnh, v.v. Nếu bạn muốn thêm nhiều tệp JavaScript tùy chỉnh vào trang web WordPress của mình và sắp xếp chúng ngăn nắp, bạn sẽ thấy loại plugin này rất hữu ích

Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?

1. 3. Plugin dành riêng cho tập lệnh

Cuối cùng, nếu bạn chỉ muốn thêm một tập lệnh của bên thứ ba vào trang web của mình, bạn cũng có thể kiểm tra xem tập lệnh đó có plugin tích hợp cho WordPress không. Người tạo thư viện JavaScript bên thứ ba phổ biến thường xuất bản plugin miễn phí trong WordPress. org repo để bạn có thể dễ dàng thêm công cụ của họ vào trang web của mình. Ưu điểm lớn nhất của loại plugin này là nó thường đi kèm với các tùy chọn cấu hình tích hợp cho thư viện JavaScript cụ thể đó

Ví dụ: plugin GA Google Analytics phổ biến cho phép bạn thêm Google Analytics vào trang web của mình ngay từ khu vực quản trị WordPress. Nó đi kèm với các tính năng tích hợp dành riêng cho tập lệnh Google Analytics, chẳng hạn như phân bổ liên kết nâng cao, ẩn danh IP, đối tượng trình theo dõi tùy chỉnh và các tính năng khác

Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?

2. Chỉnh sửa các chức năng của Chủ đề con của bạn. tệp php

Bên cạnh việc dựa vào các plugin, bạn cũng có thể sử dụng các chức năng và móc hành động tích hợp sẵn của WordPress để thêm JavaScript tùy chỉnh vào trang web của mình. Trong trường hợp này, bạn cần chỉnh sửa các chức năng của mình. php và tải tập lệnh lên máy chủ của bạn theo cách thủ công. Bạn cũng nên tạo một chủ đề con cho các tùy chỉnh của mình để có thể cập nhật chủ đề gốc một cách an toàn mà không làm mất mã tùy chỉnh. Bạn có thể tải tập lệnh tùy chỉnh của mình lên thư mục gốc của chủ đề con hoặc nếu có nhiều tập lệnh, bạn có thể tạo thư mục tập lệnh cho chúng

Bạn cần thêm mã PHP để xử lý hoặc in JavaScript tùy chỉnh của bạn vào các chức năng của chủ đề con của bạn. tập tin php. Bạn có thể chỉnh sửa tệp này trong trình chỉnh sửa mã và tải phiên bản cập nhật lên máy chủ của mình theo cách thủ công hoặc chỉnh sửa tệp qua menu Giao diện > Trình chỉnh sửa chủ đề trong khu vực quản trị WordPress của bạn (xem ảnh chụp màn hình bên dưới)

Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?

2. 1. Xếp hàng các tập lệnh tùy chỉnh của bạn với chức năng /* Custom script with no dependencies, enqueued in the header */ add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js'); function tutsplus_enqueue_custom_js() { wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js'); }1

Sổ tay chủ đề WordPress đề xuất chức năng 

/* Custom script with no dependencies, enqueued in the footer */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js', 
    array(), false, true);
}
0 để thêm tập lệnh tùy chỉnh vào trang web của bạn. Chức năng tích hợp này tôn trọng trình tự tải của WordPress và liệt kê các tập lệnh tùy chỉnh của bạn theo thứ tự phù hợp, vì vậy chúng sẽ không xung đột với các tập lệnh khác được tải bởi lõi WordPress và các plugin chạy trên trang web của bạn

Với

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1, bạn có thể thêm JavaScript tùy chỉnh của mình vào cả mẫu đầu trang và chân trang. Theo mặc định, nó liệt kê các tập lệnh trong phần
/* Custom script with no dependencies, enqueued in the footer */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js', 
    array(), false, true);
}
2 của trang được tải bởi mẫu tiêu đề.  

Nếu bạn muốn thêm tập lệnh của mình vào tiêu đề, bạn chỉ cần xác định một bộ điều khiển tùy chỉnh (

/* Custom script with no dependencies, enqueued in the footer */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js', 
    array(), false, true);
}
3 trong ví dụ bên dưới) và đường dẫn đến tập lệnh. Như bạn có thể thấy bên dưới, tôi cũng đã sử dụng hàm
/* Custom script with no dependencies, enqueued in the footer */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js', 
    array(), false, true);
}
4 WordPress để lấy URI của thư mục chủ đề con. Và hàm
/* Custom script with no dependencies, enqueued in the footer */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js', 
    array(), false, true);
}
5 thêm hàm
/* Custom script with no dependencies, enqueued in the footer */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js', 
    array(), false, true);
}
6 tùy chỉnh vào hook hành động
/* Custom script with no dependencies, enqueued in the footer */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js', 
    array(), false, true);
}
7, cho phép bạn liệt kê các tập lệnh tùy chỉnh mà bạn muốn hiển thị trên giao diện người dùng của trang web

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}

Xin lưu ý rằng mặc dù chức năng 

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 tích hợp trong WordPress và móc hành động 
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
3 có tên gần như giống nhau, nhưng chúng lại khác nhau

Bên cạnh việc sắp xếp các tập lệnh cho tiêu đề, bạn cũng có thể sử dụng hàm 

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 để thêm JavaScript tùy chỉnh vào mẫu chân trang. Tuy nhiên, trong trường hợp này, bạn cũng cần xác định tất cả các tham số tùy chọn tương ứng.  

  1. sự phụ thuộc.
    /* Custom script with no dependencies, enqueued in the header */
    add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
    function tutsplus_enqueue_custom_js() {
        wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
    }
    81 vì hiện tại chúng tôi không có phụ thuộc
  2. phiên bản của kịch bản.
    /* Custom script with no dependencies, enqueued in the header */
    add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
    function tutsplus_enqueue_custom_js() {
        wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
    }
    82 vì chúng tôi không muốn thêm số phiên bản
  3. cho dù đây là mẫu đầu trang hay chân trang.
    /* Custom script with no dependencies, enqueued in the header */
    add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
    function tutsplus_enqueue_custom_js() {
        wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
    }
    83 khi chúng tôi chuyển sang mẫu chân trang, đây là tùy chọn không mặc định
/* Custom script with no dependencies, enqueued in the footer */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js', 
    array(), false, true);
}

Nếu tập lệnh tùy chỉnh của bạn có các thành phần phụ thuộc, thì bạn cần thêm chúng vào tham số

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
81 của hàm
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1. Có một số tập lệnh và thư viện phổ biến, chẳng hạn như jQuery, đã được đăng ký bởi lõi WordPress, vì vậy bạn có thể thêm chúng bằng tên điều khiển đã đăng ký của chúng (
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
86 trong ví dụ bên dưới)

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
8

Nếu bạn có một phần phụ thuộc chưa được WordPress đăng ký, bạn cần phải đăng ký và đưa nó vào hàng đợi bằng một hàm

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 khác, trước khi bạn có thể thêm nó làm phần phụ thuộc bằng cách sử dụng tay cầm tùy chỉnh của nó

Nếu bạn muốn chạy tập lệnh của mình trong khu vực quản trị thay vì giao diện người dùng của trang web, bạn cần sử dụng móc hành động

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
88 thay vì
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
3 trong hàm
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
80. Và đối với màn hình đăng nhập, bạn cần sử dụng móc hành động 
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
81, chỉ liệt kê các tập lệnh tùy chỉnh cho trang đăng nhập.  

2. 2. In ra Tập lệnh nội tuyến của bạn bằng Móc hành động /* Custom script with no dependencies, enqueued in the header */ add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js'); function tutsplus_enqueue_custom_js() { wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js'); }1 hoặc /* Custom script with no dependencies, enqueued in the header */ add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js'); function tutsplus_enqueue_custom_js() { wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js'); }2

Mặc dù tài liệu WordPress khuyến nghị sử dụng hàm

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 cho tập lệnh tùy chỉnh, nhưng bạn cũng có thể thêm tập lệnh nội tuyến vào trang web của mình bằng móc hành động 
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
85 và
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
86. Thay vì liệt kê các tập lệnh tùy chỉnh của bạn, các móc này chỉ in chúng ra trong mẫu đầu trang hoặc chân trang. Vì vậy, bạn chỉ nên sử dụng kỹ thuật này để thêm tập lệnh nội tuyến, chứ không phải cho bên ngoài. tập tin js

Đây là cách bạn có thể sử dụng hook hành động

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 để in ra một tập lệnh nội tuyến trong mẫu tiêu đề

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
8

Và đây là cách bạn có thể sử dụng hook hành động

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
2 để in ra một tập lệnh nội tuyến trong mẫu chân trang

4

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 và
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
2 chỉ kích hoạt ở giao diện người dùng trên trang web của bạn nên các tập lệnh được thêm bằng các hook này sẽ không tải trong khu vực quản trị và trang đăng nhập. Để thêm các tập lệnh nội tuyến tùy chỉnh vào khu vực quản trị của bạn, thay vào đó, bạn nên sử dụng móc hành động
41 và
42 trong hàm
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
80. Và nếu bạn muốn in ra các tập lệnh trên trang đăng nhập, hãy sử dụng hook hành động
44 và
45

Lưu ý rằng các plugin đã nói ở trên (Chèn Đầu trang và Chân trang và CSS và JS Tùy chỉnh Đơn giản) sử dụng

/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 và
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
2 không chỉ cho các tập lệnh nội tuyến mà còn cho các tập lệnh bên ngoài. js, nhưng bạn vẫn không nên thực hiện thao tác sau trừ khi bạn thực sự biết mình đang làm gì. Điều này là do các plugin chạy các kiểm tra bổ sung để đảm bảo rằng trình tự tải của WordPress được tôn trọng. Nếu bạn muốn thêm các tập lệnh tùy chỉnh của mình theo cách thủ công, thì việc sử dụng hàm
/* Custom script with no dependencies, enqueued in the header */
add_action('wp_enqueue_scripts', 'tutsplus_enqueue_custom_js');
function tutsplus_enqueue_custom_js() {
    wp_enqueue_script('custom', get_stylesheet_directory_uri().'/scripts/custom.js');
}
1 được đề xuất sẽ an toàn và dễ dàng hơn nhiều

kết thúc

Bạn có thể thêm JavaScript tùy chỉnh vào trang web WordPress của mình bằng cách sử dụng plugin hoặc bằng cách chỉnh sửa các chức năng của chủ đề hoặc chủ đề con. tập tin php.  

Sử dụng plugin là kỹ thuật được khuyến nghị nếu bạn không muốn chỉnh sửa các tệp nguồn của mình vì các plugin này đảm bảo rằng các tập lệnh tùy chỉnh của bạn tải theo đúng thứ tự. Xếp hàng các tập lệnh của bạn trong các hàm. php theo cách thủ công cho phép bạn liên kết các tập lệnh tùy chỉnh với chủ đề của mình và giữ mọi thứ theo thứ tự mà không phải thêm một plugin khác vào trang web WordPress của bạn

Các Chủ đề và Plugin WordPress Tốt nhất trên Envato Market

Khám phá hàng ngàn chủ đề WordPress tốt nhất từng được tạo trên ThemeForest và các plugin WordPress hàng đầu trên CodeCanyon. Mua các chủ đề và plugin WordPress chất lượng cao này và cải thiện trải nghiệm trang web của bạn cho bạn và khách truy cập của bạn.  

Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?
Làm cách nào để bật javascript trong wordpress?

Dưới đây là một số chủ đề và plugin WordPress bán chạy nhất và sắp ra mắt có sẵn cho năm 2020

Tại sao JavaScript không hoạt động WordPress?

Thật không may, có nhiều chủ đề và plugin không được viết theo tiêu chuẩn WordPress . Một số không bao gồm móc để tải JavaScript hoặc chúng gây ra lỗi JavaScript trên trang web của bạn, điều này ngăn các tính năng như logic có điều kiện, phép tính, trường ngày, v.v. từ làm việc một cách chính xác.

WordPress có cho phép JavaScript không?

JavaScript sẽ hoạt động trong WordPress. Nếu được sử dụng trong các tệp mẫu, hầu hết JavaScript sẽ hoạt động tốt. Dưới đây là một số mẹo giúp JavaScript của bạn hoạt động trong WordPress

Cách dễ nhất để thêm JavaScript vào trang WordPress là gì?

Để thực hiện việc này, chỉ cần đi tới Đoạn mã » + Thêm đoạn mã và sau đó nhấp vào 'Tạo đoạn mã của riêng bạn. ' Bây giờ, bạn sẽ thấy trang 'Tạo đoạn mã tùy chỉnh' nơi bạn có thể thêm tiêu đề cho mã của mình và dán mã vào hộp 'Xem trước mã'. Sau đó, chọn 'Đoạn mã JavaScript' từ menu thả xuống 'Loại mã'.

Bảng điều khiển JavaScript trong WordPress ở đâu?

Thông thường, bạn chỉ cần nhấn F12 để mở, sau đó nhấp vào tab “Bảng điều khiển” . Bảng điều khiển sẽ hiển thị dòng nào, của tệp JavaScript nào, đã xảy ra lỗi. Nó thường hiển thị đầy đủ “stacktrace” hoặc một loạt các tệp sẽ đi qua cho đến khi bạn tìm ra thủ phạm. Đây cũng là nơi bảng điều khiển của bạn.