“Trong cuộc sống hiện tại, chúng tôi mong muốn sử dụng các ứng dụng truyền thông xã hội và công cụ Tìm kiếm của Google cho mục đích giải trí và tìm kiếm của mình, tức là nghiên cứu một số chủ đề giáo dục thông qua công cụ tìm kiếm“ Google ”và cũng có được kiến thức chung. Để sử dụng công cụ tìm kiếm Google để tìm kiếm thứ gì đó, chúng ta phải cài đặt một số trình duyệt trên điện thoại di động, máy tính xách tay hoặc máy tính cá nhân của mình. Một trong những trình duyệt được sử dụng nhiều nhất và hiệu quả nhất trong thế kỷ ngày nay là trình duyệt “Google Chrome” với nhiều chức năng tốt cùng với tiện ích mở rộng. “Tiện ích mở rộng” là plugin được tìm thấy trong bất kỳ trình duyệt nào để hạn chế hoặc cho phép các trang web và các chức năng khác nhau. Những phần mở rộng này thường không có sẵn; bạn phải thêm từng tiện ích mở rộng vào trình duyệt của mình một cách riêng biệt bất cứ khi nào được yêu cầu. Nếu bạn là một chuyên gia nhỏ về công nghệ, thì bạn có thể biết việc sử dụng tệp JSON kê khai để tạo và thêm tiện ích mở rộng trong một vài bước. Do đó, bài viết này sẽ trình bày tất cả các bước đó để tạo tiện ích mở rộng mới trên trình duyệt Google Chrome.
Trước khi xem phương pháp tạo tiện ích mở rộng, bạn cần đảm bảo rằng trình duyệt Google Chrome của bạn đã được khởi chạy và Công cụ tìm kiếm “Google” không chứa bất kỳ hình nền nào. Bạn có thể thấy rằng hình ảnh đính kèm bên dưới không có nền cho công cụ tìm kiếm “Google.com”, tức là chỉ có nền trắng. ”
Thêm thư mục tiện ích mở rộng
Mở công cụ Visual Studio Code của bạn một cách nhanh chóng từ các ứng dụng của hệ thống Windows của bạn. Có thể mất đến 1 phút để mở Mã Visual Studio đúng cách và kích hoạt nó để chúng tôi sử dụng. Sau khi nó đã được khởi chạy đúng cách và sẵn sàng để sử dụng, chúng tôi đã thêm thư mục “Extension” đã được tạo trong đó thông qua danh sách menu “File” ở thanh tác vụ trên cùng được hiển thị bên dưới. Sau khi tạo thư mục “Tiện ích mở rộng”, chúng tôi đã thêm một thư mục khác có tên là “hình ảnh” trong đó chứa các hình ảnh được sử dụng làm biểu tượng cho tiện ích mở rộng trên trình duyệt. Cùng với đó, chúng tôi đã thêm một tệp “manifest.json” và một tệp javascript có tên “script.js” để tạo một tiện ích mở rộng mới và thêm nó vào trình duyệt. Hãy bắt đầu từ tệp manifest.json bằng cách nhấp đúp vào tệp để bắt đầu làm việc trong JSON để tạo và sử dụng tiện ích mở rộng để thay đổi nền của “Google”.
Tạo tệp kê khai
Trong tệp manifest.json, bạn nên thêm mã “JSON” được hiển thị bên dưới. Mã này là tập lệnh cấu hình thực tế để tạo và thêm tiện ích mở rộng vào Trình duyệt Google Chrome của chúng tôi. Mã JSON này đã được bắt đầu với việc khởi tạo phiên bản tệp kê khai biến là “2” và tên của tiện ích mở rộng sẽ được tạo, tức là “Thay đổi nền”. Sau đó, chúng tôi đã thêm mô tả ngắn cho tiện ích mở rộng của mình trong biến 'description'.
Cùng với đó, chúng tôi đã thêm phiên bản của tiện ích mở rộng là “1.0”. Sau khi tất cả các cấu hình cơ bản cho “tiện ích mở rộng” được tạo, chúng tôi cần thêm đường dẫn đến biểu tượng hình ảnh để được sử dụng làm biểu tượng cho các tiện ích mở rộng. Biến “trình duyệt” đã được xác định để đặt biểu tượng tiện ích mở rộng cho thanh tác vụ trên cùng của trình duyệt Google Chrome, tức là nơi tất cả các tiện ích mở rộng được hiển thị sau khi bật chúng để sử dụng trong tương lai cho các trang web cụ thể hoặc tất cả. Sau đó, chúng tôi đã thêm đường dẫn đến ba tệp hình ảnh có kích thước khác nhau để trình duyệt có thể sử dụng các tệp khác nhau mỗi lần.
Cùng với đó, biến “page_action” đã được sử dụng để hiển thị hình ảnh sẽ được hiển thị sau khi nhấp vào biểu tượng “tiện ích mở rộng” từ thanh tác vụ trên cùng của Google Chrome. Biến “Default_icon” đã được sử dụng bên trong nó, cùng với ba giá trị đường dẫn khác nhau của nó để các hình ảnh được sử dụng làm biểu tượng trên mỗi lần tải lại. Ba tệp hình ảnh khác nhau được sử dụng cho mục đích này. Biến content_scripts cuối cùng có tổng cộng 2 biến mới trong đó, tức là các biến đối sánh và CSS. Biến 'đối sánh' chứa đường dẫn đến trang web sẽ được thay đổi sau khi việc sử dụng tiện ích mở rộng mới này được tạo. Cùng với đó, biến “CSS” chứa tên của tệp CSS sẽ được sử dụng để tạo kiểu cho Google.com sau khi đăng ký tiện ích mở rộng, tức là tạo kiểu cho Google.com sau mỗi lần tải lại khi bật tiện ích mở rộng. Bây giờ mã này đã hoàn tất và sẵn sàng để sử dụng, chỉ cần nhanh chóng lưu nó và chuyển đến tệp “main.css”.
Trong tệp CSS main.css, chúng tôi đã thêm kiểu cho phần mở rộng tệp kê khai của chúng tôi sẽ được tạo. Kiểu sẽ được áp dụng bằng cách sử dụng thẻ html “body”, tức là, được áp dụng trên toàn bộ vùng “body” của tệp kê khai. Chúng tôi đã thiết lập nền mới cho Google.com bằng cách sử dụng “URL” của tệp hình ảnh từ công cụ tìm kiếm. Bây giờ, hãy lưu mã của bạn trước khi làm bất cứ điều gì.
Sau khi hoàn thành các mã bắt buộc, tức là tệp kê khai.json và tệp main.css, chúng tôi phải mở tiện ích Tiện ích mở rộng trên trình duyệt Google Chrome thông qua URL chrome: // extensions ”trong tab mới. Khu vực tiện ích Tiện ích mở rộng được mở ra. Từ chế độ nhà phát triển, bạn cần tải thư mục “Tiện ích mở rộng” đã giải nén từ hệ thống cục bộ của mình để biến nó thành tiện ích mở rộng thông qua nút “tải giải nén” hiển thị trong hình ảnh bên dưới. Tiện ích mở rộng đã được thêm vào trình duyệt Chrome một cách hiệu quả, như được trưng bày. Loại bỏ các lỗi để làm cho nó hoạt động đầy đủ.
Từ biểu tượng “tiện ích mở rộng”, hãy chọn tiện ích mở rộng “Thay đổi nền” để hiển thị nó trên thanh tác vụ, tức là tiện ích mở rộng biểu tượng “C”.
Sau khi tải lại Google.com, nền của nó đã được cập nhật bằng cách sử dụng tiện ích mở rộng này.
Sự kết luận
Bắt đầu từ phần giải thích về việc sử dụng các trình duyệt trong hệ thống Windows, chúng tôi cũng đã thảo luận về tầm quan trọng của các tiện ích mở rộng trong bất kỳ trình duyệt nào. Sau phần giải thích ngắn gọn về tiện ích mở rộng, chúng tôi đã giải thích phương pháp sử dụng tệp kê khai JSON để tạo tiện ích mở rộng cho trình duyệt Google Chrome và cách sử dụng tệp này để thay đổi nền cho công cụ tìm kiếm “Google.com”. Sau khi tải tiện ích mở rộng trên Google chrome, chúng tôi đã sử dụng tiện ích này trên Google.com.vn để thay đổi nền của nó.