Bạn có muốn giảm thiểu các tập tin trên trang web WordPress của bạn?
Bạn muốn tăng tốc độ load của website hay mong muốn tối ưu điểm page speed của website.
Việc giảm thiểu các tệp WordPress CSS và Javascript có thể khiến chúng tải nhanh hơn và tăng tốc độ trang WordPress của bạn. Trong hướng dẫn này, chúng tôi sẽ giới thiệu cho bạn cách giảm thiểu các tệp CSS / Javascript trong WordPress để cải thiện hiệu suất và tốc độ.
Minify là gì và khi nào bạn cần nó?
Thuật ngữ “Giảm thiểu” được sử dụng để mô tả một phương pháp làm cho kích thước tệp trang web của bạn nhỏ hơn. Nó đạt được mục tiêu này bằng cách loại bỏ không gian trắng, dòng, và các ký tự không cần thiết từ mã nguồn.
Thông thường, chỉ nên sử dụng cho các tệp được gửi đến trình duyệt của người dùng. Điều này bao gồm tệp HTML, CSS và JavaScript. Bạn cũng có thể giảm thiểu các tệp PHP, nhưng PHP là ngôn ngữ lập trình phía máy chủ và giảm thiểu nó sẽ không cải thiện tốc độ tải trang cho người dùng của bạn.
Lợi thế rõ ràng của minifying các tập tin được cải thiện WordPress tốc độ và hiệu suất. Các tệp tin gọn nhẹ sẽ tải nhanh hơn và cải thiện tốc độ trang web của bạn.
Tuy nhiên, một số chuyên gia tin rằng cải tiến hiệu suất là rất nhỏ đối với hầu hết các trang web và không có giá trị rắc rối. Việc giảm thiểu chỉ làm giảm vài kilobytes dữ liệu trên hầu hết các trang web WordPress. Bạn có thể giảm thời gian trễ hơn bằng cách tối ưu hóa hình ảnh cho web.
Dưới đây là một ví dụ về mã CSS bình thường:
1 2 3 4 5 6 7 8 9 10 11 |
body { margin: 20px; padding: 20px; color: #333333; background: #f7f7f7; } h1 { font-size: 32px; color #222222; margin-bottom: 10px; } |
Sau khi minifying mã nó sẽ như sau:
1 |
body {margin: 20px; padding: 20px; color: # 333; background: # f7f7f7} h1 {font-size: 32px; margin-bottom: 10px} |
Nếu bạn đang cố đạt được 100/100 điểm trên Google Pagespeed hoặc công cụ GTMetrix, thì việc giảm thiểu CSS và JavaScript sẽ cải thiện đáng kể điểm của bạn.
Có nói rằng chúng ta hãy xem làm thế nào để dễ dàng giảm thiểu CSS / JavaScript trên trang web WordPress của bạn.
Giảm thiểu CSS / Javascript trong WordPress
Điều đầu tiên bạn cần làm là cài đặt và kích hoạt plugin Better WordPress Minify. Để biết thêm chi tiết
Khi kích hoạt, plugin sẽ thêm một mục trình đơn mới có nhãn ‘BWP Minify’ vào thanh quản trị WordPress của bạn. Nhấp vào nó sẽ đưa bạn đến trang cài đặt plugin.
Trên trang cài đặt, bạn cần phải kiểm tra hai tùy chọn đầu tiên để tự động giảm thiểu các tệp JavaScript và CSS trên trang web WordPress của bạn.
Giờ đây, bạn có thể nhấp vào nút Lưu Thay đổi để lưu cài đặt của bạn.
Có nhiều tùy chọn nâng cao khác trên trang này. Cài đặt mặc định sẽ hoạt động cho hầu hết các trang web nhưng bạn có thể xem lại và thay đổi các tùy chọn này theo từng trường hợp.
Tiếp theo, bạn cần phải đi qua trang web của mình. Nhấp chuột phải vào bất cứ nơi nào và sau đó chọn ‘View Page Source’ từ trình đơn trình duyệt.
Bây giờ bạn sẽ thấy mã nguồn HTML được tạo ra bởi trang WordPress của bạn. Nếu bạn nhìn kỹ, bạn sẽ nhận thấy rằng plugin này sẽ tải tệp CSS / JavaScript từ thư mục riêng của plugin thay vì các chủ đề và plugin của WordPress.
Đây là những phiên bản nhỏ của các tệp CSS và JavaScript gốc của bạn. Plugin WordPress Minify tốt hơn sẽ giữ chúng lưu trữ và phục vụ các phiên bản minified để trình duyệt.
Trên đây là một số mẹo để các bạn nén css và js trên website. Để khắc phục tốt nhất bạn có thể liên hệ chúng tôi để được tư vấn hỗ trợ sửa lỗi:
Ftechx Solutions – Nhà thiết kế website chuyên nghiệp hàng đầu Việt Nam
Phone: 0901 764 514
Email: Contact.ftechx@gmail.com