AnkiWebView Inspector chính là chiếc kính lúp ma thuật bắt buộc phải có cho giới Lập trình viên (Developer) hoặc những tay ngang đam mê Thiết kế Mặt thẻ Anki.
Nếu bạn từng bực mình vì viết Code HTML/CSS làm thẻ Anki mà bị lỗi hiển thị lệch cột, tràn font… nhưng không biết chọc vào đâu để tìm lỗi. Thì đây! Cục Addon này sẽ mang nguyên cái rạp DevTools (f12) lừng danh của Google Chrome cấy thẳng vào lòng phần mềm Anki!
🔍 Chùm Tính Năng Soi Mó (Features)
- Mổ Sẻ Phần Tử (Inspect Elements): Chọc thẳng vào các lớp HTML/CSS đang chạy ngầm trong Cửa sổ Anki để xem nó được đắp từ mã lệnh gì.
- Trạm Điều Khiển Mật (Console Debugging): Bắn Code lệnh JavaScript sống và dòm logs trả về trực tiếp.
- Phẫu Thuật Sống (Live Editing): Chỉnh màu chữ đổi Size bằng mũi chuột ở bảng CSS và ngắm thành quả nháy mắt Real-time.
- Form Dáng Quen Thuộc: Giao diện đúc khuôn 99% y hệt Google Chrome Developer Tools. Không lo bỡ ngỡ.
- Phủ Sóng Mọi Cửa Sổ: Inspect từ Reviewer màn học thẻ, Editor màn thiết kế, lấn sang cả mấy cái Addon UI khác.
📥 Mâm Thiết Lập Cài Đặt
- Kéo mở app Anki ở máy tính lên.
- Chỉa mỏ lết vào Tools → Add-ons → Get Add-ons
- Cắm mã: 31746032
- Bấm Enter hóng cài đặt. Xong xuôi thì Khởi động lại Anki để bẻ khóa.
🚀 Bí Kíp Kích Hoạt Bộ Phận Soi
Cầm Kính Lúp Mở Inspector:
- Nằm trong Anki (đang xem Thẻ hoặc ở bàn Editor), Click Chuột Phải vào vùng trống bất kỳ.
- Bấm chọn “Inspect” hoặc “Inspect Element” hiện ở cuối màn.
- BÙM! Trạm DevTools quen thuộc chẻ đôi màn hình hiện ra.
Hệ Sinh Thái Các Tab Nghề Nghiệp:
- Tab Elements (Lớp vỏ): Đây là nơi bắt sâu HTML và nặn lại CSS nháp.
- Tab Console (Lệnh): Vung JavaScript, hứng Logs và rượt bắt lỗi đỏ lòm (Errors).
- Tab Network (Lưới mạng): Xem các rãnh Request ping Data (nếu add-on có gọi API mạng lưới).
- Tab Sources (Nguồn): View thọc mạch vào cội nguồn Code JS.
Múa Mẫu Vài Tình Huống:
Bắt bệnh CSS bị què:
- Khui Inspector lên (Chuột phải -> Inspect).
- Chọt vô Icon cái Chuột “Select element” (Hoặc phím
Ctrl+Shift+C). - Click rà rà vào chỗ chữ hoặc hình bị móp méo trên App.
- Ngó xuống Tab Elements xem nó đang vướng Class CSS nào, rồi nhìn sang ô Styles bên tay phải gõ số tắt/bật lại màu thử xem. Chữa xong nháy F5 là đẹp mộng mơ.
⚙️ Trạm Tương Thích & Đề Phòng
- Trơn láng trên mọi phiên bản Anki 2.1.0 đổ lên.
- Lướt mượt trên Windows, Mac Silicon, Linux.
💡 Lưu ý Đỏ: Những gì bạn gõ dũa bên ô Inspector nó chỉ là Ảo Cảnh Tạm Thời (Live Edit nháp). Vừa ý rồi thì phải chép lại mã Code đó ném vào bảng CSS xịn của thẻ (Card Template) rồi lưu lại nhé. F5 phát là nó bay màu cái đang nháp đấy!
🌐 Dây Nhợ Si-Phông Tiếp Tế Máu
- Trạm Gốc Lòng Cốt: GitHub Repository hikaru-y
- Hang Ổ FAQ Sách Vở: GitHub Wiki Chuyên Sâu
- Bãi Chém Gió Kêu Cứu: Support Thread Ở Diễn Đàn
Khán Đài Oanh Tạc (Reviews)
Ẵm 128 Cúp Upvote và Đáy 0 Downvote, một siêu phẩm 100% thánh thiện không tì vết cho dân Code:
🛠️ “Ông thần nào Dev Add-on với nặn Thẻ Card Template mà không xách cái này theo thì đúng là tự sát!”
🎯 “Biết muộn 2 năm, mất bao nhiêu thanh xuân mò mẫm code mù!”
💪 “Sao mẹ Anki không đắp thẳng cái này thành Core mặc định luôn đi đệt?! Quá đẳng cấp!”