AnkiWebView Inspector là một công cụ debug mạnh mẽ cho Anki, cho phép bạn inspect và chỉnh sửa HTML, CSS, JavaScript trong các cửa sổ Anki một cách trực tiếp. Đây là công cụ không thể thiếu cho những ai đang phát triển template, addon hoặc tùy chỉnh giao diện Anki.
🔍 Tính năng nổi bật
- Inspect Elements: Kiểm tra và chỉnh sửa HTML/CSS trong các cửa sổ Anki
- Console Debugging: Chạy JavaScript và xem console logs
- Live Editing: Chỉnh sửa CSS và HTML trực tiếp để xem thay đổi ngay lập tức
- Tương tự Chrome DevTools: Giao diện quen thuộc như Chrome Developer Tools
- Hỗ trợ nhiều cửa sổ: Có thể inspect trong reviewer, editor, và các cửa sổ khác
📥 Cài đặt
- Mở Anki
- Vào Tools → Add-ons → Get Add-ons
- Dán mã: 31746032
- Nhấn Enter và chờ cài đặt hoàn tất
- Khởi động lại Anki
🚀 Cách sử dụng
Mở Inspector
- Click chuột phải vào bất kỳ cửa sổ Anki nào (reviewer, editor, v.v.)
- Chọn “Inspect” hoặc “Inspect Element” từ menu
- Cửa sổ Inspector sẽ mở ra
Sử dụng Inspector
- Elements Tab: Xem và chỉnh sửa HTML/CSS
- Console Tab: Chạy JavaScript và xem logs
- Network Tab: Xem các request network (nếu có)
- Sources Tab: Xem và debug JavaScript code
Ví dụ sử dụng
Tìm class CSS của một element:
- Mở Inspector
- Click vào icon “Select element” (hoặc Ctrl+Shift+C)
- Click vào element bạn muốn inspect
- Xem class và ID trong Elements tab
Chỉnh sửa CSS trực tiếp:
- Chọn element trong Elements tab
- Xem và chỉnh sửa CSS trong Styles panel
- Thay đổi sẽ hiển thị ngay lập tức
Debug JavaScript:
- Mở Console tab
- Gõ JavaScript code và nhấn Enter
- Xem kết quả và logs
⚙️ Tương thích
- ✅ Anki 2.1.0+ (Updated 2023-06-27)
- ✅ Windows, Mac, Linux
- ✅ Tất cả các cửa sổ Anki (reviewer, editor, browser, v.v.)
💡 Lưu ý
- Inspector chỉ hoạt động khi bạn click chuột phải và chọn “Inspect”
- Một số cửa sổ có thể không hỗ trợ đầy đủ tính năng
- Thay đổi trong Inspector chỉ là tạm thời, sẽ mất khi reload trang
🌐 Liên kết hữu ích
- GitHub Repository - Source code và documentation
- GitHub Wiki - Tài liệu chi tiết
- Support Thread - Diễn đàn hỗ trợ
💬 Phản hồi từ cộng đồng
Với 128 upvote và 0 downvote, đây là một trong những công cụ debug được đánh giá cao nhất:
- 🛠️ Essential for development: “Indispensable for addon and card template development”
- 🎯 Saves time: “I wish I knew about this 2 years ago”
- 🔧 Works perfectly: “Works like a charm”
- 💪 Should be built-in: “How is this not standard feature”
“This is essential functionality. A million thanks to the creator!” - Review từ AnkiWeb
🔧 Công cụ không thể thiếu cho developer! Nếu bạn đang phát triển template, addon hoặc tùy chỉnh giao diện Anki, AnkiWebView Inspector chính là công cụ bạn cần.
