Việc thêm tập lệnh hoặc biểu định kiểu tùy chỉnh vào trang web WordPress của bạn thường được thực hiện để cải thiện chức năng, tính năng và thiết kế của trang web. Có nhiều cách để thêm mã JavaScript [còn gọi là JS] và mã CSS vào chủ đề hoặc plugin của bạn. Trong một bài viết khác, chúng tôi đã đề cập đến tất cả các cách để thêm mã JS, từ những cách dễ hiểu và dễ triển khai hơn đến những cách viết mã chuyên sâu hơn. Trong bài viết này, chúng ta sẽ xem xét kỹ hơn một trong những phương pháp đó—enqueueing. Tốt nhất là thêm các tập lệnh và biểu định kiểu tùy chỉnh lớn hơn nhưng đó là phương pháp dành cho người dùng nâng cao. Do đó, bài viết này phù hợp hơn cho các nhà phát triển hoặc người dùng WordPress muốn nâng cao kiến thức hiện có. Tất nhiên, đây là một bài đọc tốt cho bất kỳ người dùng WordPress nào, nhưng hãy chắc chắn thực hiện nghiên cứu bổ sung nếu bạn muốn thử điều này nhưng không thoải mái với việc viết mã. Chúng tôi sẽ đề cập đến một số cách tiếp cận để liệt kê các tập lệnh và biểu định kiểu tùy chỉnh trong bài viết này và cung cấp các ví dụ cho chúng
Việc thêm tập lệnh và biểu định kiểu có thể khá hữu ích trong việc cải thiện trang web WordPress của bạn. Từ việc cải thiện chức năng và thêm các tính năng để tạo ra một thiết kế hấp dẫn hơn—có rất nhiều lý do để thêm tập lệnh hoặc biểu định kiểu tùy chỉnh. Và để đảm bảo mã tùy chỉnh của bạn tích hợp và hoạt động tốt với WordPress, bạn nên thêm mã đúng cách bằng cách liệt kê các tệp. Sử dụng bài viết này và các ví dụ khác nhau mà chúng tôi đã trình bày ở đây, bạn sẽ có thể liệt kê các tập lệnh và biểu định kiểu vào trang web và bảng điều khiển của mình ngay lập tức
WordPress dựa vào một số ngôn ngữ lập trình để cung cấp một khung vững chắc nhưng có thể mở rộng để xây dựng trên đó. Các ngôn ngữ phía máy khách như HTML, CSS, JavaScript và jQuery tạo ra trải nghiệm người dùng phong phú và dường như vô hạn. Ngôn ngữ phía máy chủ PHP thực hiện công việc nặng nhọc đằng sau hậu trường để cung cấp dữ liệu cho trình duyệt. Về cốt lõi, WordPress đã quản lý một danh sách dài các tập lệnh và kiểu dáng để tạo ra một trang web hoạt động. Nhiều tập lệnh và kiểu được bao gồm trong lõi WordPress; . WordPress có các hệ thống tích hợp để theo dõi tất cả các tập lệnh và kiểu, giữ cho chúng không xung đột với nhau và sử dụng chúng theo đúng thứ tự. Phương pháp thêm tập lệnh và kiểu của riêng bạn vào chủ đề của bạn được gọi là enqueueing. Enqueueing được sử dụng cho cả tập lệnh và kiểu và có nghĩa là chúng ta phải truy cập và thay đổi các chức năng. php đi kèm với cài đặt WordPress của bạn. Đừng lo lắng về việc thông thạo lập trình PHP; . Việc học PHP bổ sung và sâu hơn nằm ngoài phạm vi của bài học, vì vậy chúng tôi khuyến khích bạn xem các tài nguyên khác, chẳng hạn như hướng dẫn sử dụng PHP chính thức. Đối với bài học này, mục tiêu đơn giản là làm quen với việc xếp hàng để bạn có thể hoàn thành nó ở dạng cơ bản nhất. Ghi chú. Phương pháp thêm tập lệnh và kiểu vào WordPress về cơ bản là giống nhau cho cả plugin và chủ đề. Trong bài học này, chúng ta sẽ tùy chỉnh một chủ đề, nhưng những gì bạn học được cũng có thể áp dụng cho việc xây dựng plugin
mục tiêu
Vào cuối bài học này, bạn sẽ có thể
- Khai thác hệ thống của WordPress để quản lý vô số tập lệnh và kiểu
- Bao gồm và tải chính xác các tập lệnh và kiểu của riêng bạn để WordPress quản lý chúng một cách hiệu quả
Kỹ năng tiên quyết
Bạn sẽ được trang bị tốt hơn để học qua bài học này nếu bạn có kinh nghiệm và quen thuộc với
- Kiến thức cơ bản về HTML/CSS
- Kiến thức cơ bản về cài đặt và kích hoạt chủ đề WordPress
- Hiểu biết về cách các thư mục và tệp được cấu trúc
- Khả năng chỉnh sửa tệp bằng trình soạn thảo văn bản
Tài sản
- Cài đặt WordPress
- Chủ đề Hai Mươi Mười Bảy
- Chủ đề con “MyChildTheme” [tải xuống tệp zip]
Câu hỏi sàng lọc
- Bạn đã quen với việc cài đặt và kích hoạt các chủ đề thông qua Bảng điều khiển WordPress chưa?
- Bạn có ít nhất kiến thức cơ bản về HTML/CSS không?
- Bạn có cảm thấy thoải mái khi sử dụng trình soạn thảo văn bản để chỉnh sửa mã không?
- Bạn sẽ có trang web WordPress hộp cát được lưu trữ cục bộ hoặc từ xa để sử dụng trong lớp chứ?
Ghi chú của giáo viên
- Thực hiện một bản demo trực tiếp trong khi dạy các bước là rất quan trọng để có tài liệu “nhấp chuột” cho sinh viên
- Sinh viên làm việc trên một bản sao WordPress được cài đặt cục bộ là dễ nhất. Dành thời gian trước giờ học để hỗ trợ sinh viên cài đặt WordPress cục bộ nếu họ cần. Để biết thêm thông tin về cách cài đặt WordPress cục bộ, vui lòng truy cập giáo án Cài đặt cục bộ của chúng tôi
- Các câu trả lời ưa thích cho các câu hỏi sàng lọc là “có. ” Những học viên trả lời “không” cho cả 4 câu hỏi có thể chưa sẵn sàng cho bài học này
- Được xây dựng bằng WordPress 4. 7. 4
Hướng dẫn thực hành
Bạn sẽ làm việc với một chủ đề con của chủ đề Twenty Seventeen. Cách tốt nhất là sử dụng chủ đề con vì chủ đề gốc sẽ nhận được các bản cập nhật định kỳ của tác giả chủ đề và các bản cập nhật sẽ ghi đè lên bất kỳ thay đổi hoặc tùy chỉnh nào được thực hiện trực tiếp trong chủ đề gốc. Sử dụng chủ đề con cho phép bạn tự do thử nghiệm mà không cần thay đổi chủ đề gốc. Để hiểu rõ hơn về điều này, hãy tham khảo giáo án xây dựng chủ đề trẻ em,
Cài đặt và kích hoạt chủ đề mẹ và con
Đăng nhập vào bảng điều khiển quản trị viên WordPress của bạn. Trong menu bảng điều khiển ở bên trái màn hình của bạn, hãy chọn Giao diện, sau đó chọn Chủ đề. Nếu đây là bản cài đặt mới, chủ đề Twenty Seventeen đã được kích hoạt trên trang web. Nếu không, vui lòng cài đặt nó ngay bây giờ bằng cách nhấp vào dấu cộng trong hộp có nhãn, Thêm chủ đề mới. Sau khi bạn đảm bảo rằng bạn đã tải chủ đề Twenty Seventeen, hãy tải xuống và cài đặt chủ đề con có tên MyChildTheme. Tải xuống tệp zip tại đây hoặc từ danh sách Nội dung ở trên. Kích hoạt chủ đề con, sau đó xem trang web của bạn và để ý giao diện của nó với chủ đề này. Bây giờ bạn sẽ thay đổi nó và xem điều đó ảnh hưởng như thế nào đến giao diện của trang web. Xem các tệp cài đặt WordPress của bạn và điều hướng đến