202 lines
5.0 KiB
Markdown
202 lines
5.0 KiB
Markdown
# 快速開始指南
|
||
|
||
## 🚀 5 分鐘安裝使用
|
||
|
||
### 第一步：安裝使用者腳本管理器
|
||
|
||
選擇適合您瀏覽器的擴充功能：
|
||
|
||
#### Chrome / Edge
|
||
1. 前往 [Chrome 線上應用程式商店](https://chrome.google.com/webstore)
|
||
2. 搜尋「Tampermonkey」並安裝
|
||
3. 點擊「加到 Chrome」→「新增擴充功能」
|
||
|
||
#### Firefox
|
||
1. 前往 [Firefox 附加元件商店](https://addons.mozilla.org)
|
||
2. 搜尋「Tampermonkey」並安裝
|
||
3. 點擊「加入至 Firefox」→「新增」
|
||
|
||
#### Safari
|
||
1. 前往 App Store 搜尋「Userscripts」
|
||
2. 安裝 Userscripts 應用程式
|
||
3. 在 Safari 偏好設定中啟用擴充功能
|
||
|
||
### 第二步：安裝腳本
|
||
|
||
#### 方法一：直接安裝（推薦）
|
||
1. 複製 `twpkinfo-ad-blocker-sniper.user.js` 檔案內容
|
||
2. 開啟 Tampermonkey 管理面板
|
||
3. 點擊「建立新腳本」
|
||
4. 貼上複製的程式碼
|
||
5. 按 `Ctrl+S`（或 `Cmd+S`）儲存
|
||
|
||
#### 方法二：本機安裝
|
||
1. 下載 `twpkinfo-ad-blocker-sniper.user.js` 到電腦
|
||
2. 拖曳檔案到瀏覽器視窗
|
||
3. Tampermonkey 會自動偵測並提示安裝
|
||
4. 點擊「安裝」確認
|
||
|
||
### 第三步：驗證安裝
|
||
|
||
1. 前往 [TWPKInfo 首頁](https://twpkinfo.com)
|
||
2. 檢查以下變化：
|
||
- ✅ 頂部導覽列消失
|
||
- ✅ 底部功能列消失
|
||
- ✅ 地圖填滿整個視窗
|
||
- ✅ 滑鼠懸停地圖按鈕顯示中文說明
|
||
|
||
## 🎯 基本使用
|
||
|
||
### 正常瀏覽
|
||
腳本會在頁面載入時自動執行，無需任何手動操作：
|
||
|
||
1. **開啟任一 TWPKInfo 頁面**
|
||
2. **等待 2-3 秒讓腳本完成清理**
|
||
3. **開始使用純淨的地圖介面**
|
||
|
||
### 檢查運作狀態
|
||
|
||
開啟瀏覽器開發者工具（`F12`）查看主控台：
|
||
```
|
||
TWPKInfo 廣告清除器啟動
|
||
清理 CSS 規則已應用
|
||
已清理 3 個元素
|
||
清理監控已啟動
|
||
清理任務完成
|
||
```
|
||
|
||
### 功能測試清單
|
||
|
||
逐一確認以下功能正常：
|
||
- [ ] 地圖可以縮放
|
||
- [ ] 定位按鈕有效
|
||
- [ ] 切換地圖類型（道館/寶可夢/任務）正常
|
||
- [ ] 工具按鈕顯示中文提示
|
||
- [ ] 無廣告干擾
|
||
- [ ] 頁面滾動已禁用（地圖全屏）
|
||
|
||
## ⚙️ 自訂設定
|
||
|
||
### 修改工具提示文字
|
||
|
||
編輯腳本第 259-306 行的對應表：
|
||
|
||
```javascript
|
||
const directTooltips = [
|
||
['#update', '重新整理地圖資料'], // 修改這裡的中文
|
||
['#filter_btn', '開啟/關閉篩選面板'],
|
||
// ... 繼續添加或修改
|
||
];
|
||
```
|
||
|
||
### 調整清理強度
|
||
|
||
**溫和模式**（保留更多元素）：
|
||
註解掉第 102-104 行：
|
||
```javascript
|
||
// body > div:last-child:not(#map):not([id*="map"]):not([class*="leaflet"]):not(.leaflet-control-attribution) {
|
||
// display: none !important;
|
||
// }
|
||
```
|
||
|
||
**激進模式**（移除更多元素）：
|
||
在第 120 行後添加：
|
||
```javascript
|
||
body > div:not(#map):not([class*="leaflet"]) {
|
||
display: none !important;
|
||
}
|
||
```
|
||
|
||
### 新增支援網站
|
||
|
||
修改腳本標頭的 `@match` 規則：
|
||
```javascript
|
||
// @match https://twpkinfo.com/*
|
||
// @match https://*.twpkinfo.com/*
|
||
// @match https://你的網站.com/* // 新增這行
|
||
```
|
||
|
||
## 🔧 故障排除
|
||
|
||
### 常見問題
|
||
|
||
#### 問題：腳本沒有執行
|
||
**症狀**：頁面沒有變化，廣告仍然存在
|
||
|
||
**解決方案**：
|
||
1. 確認 Tampermonkey 圖示為綠色（已啟用）
|
||
2. 檢查腳本是否在啟用狀態
|
||
3. 重新整理頁面
|
||
4. 清除瀏覽器快取
|
||
|
||
#### 問題：地圖功能異常
|
||
**症狀**：無法縮放、定位失效、地圖空白
|
||
|
||
**解決方案**：
|
||
1. 暫時停用腳本測試原網站功能
|
||
2. 檢查瀏覽器主控台錯誤訊息
|
||
3. 嘗試切換至溫和模式
|
||
4. 回報問題給開發者
|
||
|
||
#### 問題：新廣告出現
|
||
**症狀**：網站更新後出現新的廣告元素
|
||
|
||
**解決方案**：
|
||
1. 右鍵點擊廣告元素 →「檢查元素」
|
||
2. 記錄元素的 class 或 id
|
||
3. 在腳本 CSS 規則中添加對應選擇器
|
||
4. 儲存並重新整理頁面
|
||
|
||
### 手動除錯
|
||
|
||
#### 檢查腳本版本
|
||
```javascript
|
||
// 在瀏覽器主控台執行
|
||
console.log('腳本版本:', GM_info.script.version);
|
||
```
|
||
|
||
#### 檢查清理效果
|
||
```javascript
|
||
// 檢查剩餘底部元素
|
||
document.querySelectorAll('div').forEach(div => {
|
||
const rect = div.getBoundingClientRect();
|
||
if (rect.bottom >= window.innerHeight - 50 && rect.width > 200) {
|
||
console.log('發現底部元素:', div);
|
||
}
|
||
});
|
||
```
|
||
|
||
#### 強制重新清理
|
||
```javascript
|
||
// 在主控台執行強制清理
|
||
if (typeof cleanupBottomBar === 'function') {
|
||
cleanupBottomBar();
|
||
console.log('已執行手動清理');
|
||
}
|
||
```
|
||
|
||
## 🆘 取得協助
|
||
|
||
### 聯絡管道
|
||
- **GitHub Issues**：回報 bug 或功能請求
|
||
- **Email**：loyangchun@gmail.com
|
||
- **社群**：Taiwan Pokemon GO 相關論壇
|
||
|
||
### 回報 Bug 時請提供
|
||
1. 瀏覽器版本和作業系統
|
||
2. 使用者腳本管理器版本
|
||
3. 腳本版本號碼
|
||
4. 詳細的問題描述和截圖
|
||
5. 瀏覽器主控台錯誤訊息
|
||
|
||
### 功能建議
|
||
歡迎提出改進建議，特別是：
|
||
- 新的元素清理策略
|
||
- 更好的工具提示文案
|
||
- 效能優化方案
|
||
- 其他實用功能
|
||
|
||
---
|
||
|
||
**下一步**：了解腳本設計理念請閱讀 [SUMMARY.md](SUMMARY.md)
|
||
**詳細功能**：查看完整功能說明請閱讀 [README.md](README.md) |