Làm thế nào để giảm thiểu tập tin CSS / JavaScript trong WordPress

Thảo luận trong 'Thủ thuật - Mã nguồn - Theme' bắt đầu bởi tông lào, 7/3/17.

  1. tông lào PageRank 1 Member

    Tham gia ngày:
    8/2/17
    Bạn có muốn giảm thiểu các tệp trên trang WordPress của mình? Việc giảm thiểu các tệp 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,dịch vụ thiết kết website bán hàng trực tuyến OTVINA 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 độ.

    [​IMG]

    Giảm thiểu (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à một 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 là 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 đơn giản tối ưu hóa hình ảnh cho web .

    Xem thêm : Làm thế nào để cài đặt Google Analytics trong WordPress cho người mới bắt đầu (P2)

    Dưới đây là một ví dụ về mã CSS bình thường:

    Body {
    margin: 20px;
    Đệm: 20px;
    Màu sắc: # 333333;
    Nền: # f7f7f7;
    }
    H1 {
    font-size: 32px;
    Màu # 222222;
    Margin-bottom: 10px;
    }

    Sau khi minifying mã nó sẽ như sau:

    Body {margin: 20px; padding: 20px; color: # 333; background: # f7f7f7} h1 {font-size: 32px; margin-bottom: 10px}

    Nếu bạn đang cố đạt được điểm số 100/100 trên công cụ Google Pagespeed hoặ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.

    Chúng ta hãy cùng nhau 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
    Theo thiết kế website bán hàng OTVINA điều đầu tiên bạn cần làm là cài đặt và kích hoạt plugin Better WordPress Minify . 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.

    [​IMG]

    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.

    Bây giờ 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.

    Xem thêm : 32 thủ thuật vô cùng hữu ích cho các file chức năng trong WordPress (P1)

    [​IMG]

    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.

    Lời kết
    Đó là tất cả, thiết kế website bán hàng chuẩn SEO OTVINA hy vọng bài viết này đã giúp bạn tìm hiểu làm thế nào để giảm thiểu tập tin CSS / JavaScript trang web WordPress của bạn. Hãy cho chúng tôi biết ý kiến của các bạn và đừng quên theo dõi các bài viết tiếp theo của chúng tôi nhé!

    Nguồn : Làm thế nào để giảm thiểu tập tin CSS / JavaScript trong WordPress
     
    #1

Chia sẻ trang này