
可結果往往是「起了個大早,趕了個晚集」,一手好牌給打得稀爛。今天來聊聊 Edge 瀏覽器上的一個獨享功能,算是給微軟的「整活」整個活。側邊欄搜索的現狀
在 Edge 87.0 版本的時候,瀏覽器新增了一個「側邊欄搜索」的功能。它可以將文字放在側邊欄中搜索,而不用打開新標籤頁,這樣做的好處,自然是不會打斷當前的瀏覽狀態。Edge 的側邊欄搜索無法修改搜索引擎,你只能使用 Bing 搜索。這讓好好的一個神級功能一下子就變得雞肋。因為 Chromium 內核就沒有「側邊欄」這一概念,很多所謂的側邊欄擴展,都只不過是模擬而已。而 Chrome 在 Edge 的刺激下,也只是象徵性地增加了「書籤側邊欄」,並沒有打算在側邊欄上發力。所以,就算有這麼大的缺點,側邊欄搜索,目前也還是 Edge 瀏覽器的獨享功能。
側邊欄搜索的探索
就是利用《小書籤》來實現類的「側邊欄搜索」效果,而具體的思路,就是使用彈窗小窗口來代替側邊欄。1、高度自定義首先要解決的的搜索引擎,這自然不是問題,只需要修改藍色部分的鏈接即可。2、不改變原網頁相較於打開側邊欄會擠壓原來的網頁,在小窗口打開則完全不會影響原網頁。而且,使用鼠標手勢的輔助,劃 M 型可以將小窗口置頂,而不需要了,則可以劃 L 型一鍵關閉。3、有更多可玩性彈窗小窗口,就是一個單獨的標籤頁,只不過它隱藏了導航欄這些東西。所以,瀏覽器的所有功能在小窗口上都可以使用,比如廣告過濾比如、油猴腳本、比如鼠標拖拽等等。又比如你想讓小窗口裡的鏈接在當前窗口中打開,那麼拖拽鏈接向下就可以實現。
側邊欄搜索的使用
1、Chrome 使用方法就如同添加一般的搜索引擎一樣,只需要將奶酪製作的小書籤搜索代碼,加入到「搜索引擎」即可。javascript:var keyword = 'https://m.baidu.com/s?wd='+'%s';winsize = screen.width - 500;void(window.open(keyword,'_blank','height=650,width=450,top=150,left='+ winsize));
javascript:var keyword = 'https://www.google.com/search?q='+'%s';winsize = screen.width - 500;void(window.open(keyword,'_blank','height=650,width=450,top=150,left='+ winsize));
javascript:var keyword = 'https://www.bing.com/search?q='+'%s';winsize = screen.width - 500;void(window.open(keyword,'_blank','height=650,width=450,top=150,left='+ winsize));PS:如果在「新標籤頁」等瀏覽器內建頁上搜索,那麼需要按 Ctrl 鍵敲回車,否則無法啟用。2、Firefox 使用方法Firefox 瀏覽器則可以通過"書籤關鍵字"來調用搜索引擎。PS:如果設置了地址欄鏈接在「新標籤頁」打開,那麼需要按 Ctrl 鍵敲回車,否則會多一個空白頁。最後,在地址欄輸入調用關鍵字 bw、gw、yw,然後再輸入搜索內容,即可實現側邊欄搜索。3、選中文字一鍵搜索我們還是可以利用「小書籤」來實現一鍵搜索。具體來說,就是選中文字後按 bb、gg 來分別小窗搜索百度和谷歌。4、小窗打開指定網頁如果你不是想搜索某個內容,而想將某個網頁放在側邊欄上當做參考。同樣還是可以使用小書籤來實現。具體來說,就是按快捷鍵 oo,然後輸入要在小窗口中打開的網址即可。
側邊欄搜索的不足
就是無法自定義打開網頁的瀏覽模式,所以會出現小窗口裡的網頁是「桌面版」的,而不是「移動版」的。好在擴展 Sideview Plus 可以解決這個問題。它可以根據窗口的大小,來自動決定訪問「桌面版」還是「手機版」,問題完美解決。Firefox:https://t.cn/A6a7VHxXChrome:https://t.cn/A6a7V84lEdge:https://t.cn/A6a7VR2i
最後再插播一條消息。奶酪小書籤又雙叒更新了,除了包含以上文章介紹的所有搜索代碼。奶酪還特意更新了小書籤圖標,現在,小書籤在深色模式下也可以正常使用了。
回復關鍵字S查看本系列的所有文章,回復關鍵字S06獲取本文提到的所有資源
近期文章:



1、點在看,幫助更多的人看到這篇文章。2、寫留言,對文章進行評論,我會儘可能回復。