淘寶裝修店鋪搜索功能教程代碼裝修教程天馭設計

店鋪搜索功能是重要的淘寶引流工具，裝修好了此頁面，可以提高轉化率。
希望大家通過本教程學習可以學會 如何對淘寶搜索功能 進行代碼裝修。

操作方法

（01）在裝修之前首先需要我們先安裝好兩個軟件Adobe Dreamweaver以及Adobe Photoshop。這兩個軟件我會共享在qq羣裏面，大家需要的話加羣下載。

（02）下面我們開始學習如何裝修店鋪搜索功能。1.我們將已經準備好的店招圖片用PS軟件打開。將店招切成兩個部分， 左邊是店招，右邊是搜索框內容。

（03）我們會把搜索框的圖層關閉掉，如圖：

（04）選擇店招的圖層，選擇左邊的店招，再如下圖所示點擊，將左邊店招的效果拷貝下來。再新建一個文件，將剛剛拷貝下來的內容粘貼上去。

（05）選擇店招的圖層，選擇左邊的店招，再如下圖所示點擊，將左邊店招的效果拷貝下來。再新建一個文件，將剛剛拷貝下來的內容粘貼上去。

（06）粘貼好了之後再將效果圖存儲下來，注意，保存的時候可以起個名字，以免混亂。如：店招招左邊。

（07）點擊菜單欄中的“文件”“打開”，打開之後選擇這個代碼一

（08）打開代碼之後我們再新建一個文檔，如圖：

（09）打開淘寶圖片空間，把上載的店招左邊圖代碼複製下來，粘貼在剛剛新建文檔的雙“body”之間，如圖：

（10）將代碼粘貼好了之後，這一步我們是要給店招加上鍊接，我們先點擊到設計頁面，看一下圖片是否顯示正常。然後選擇軟件左下方的熱點工具。對需要添加鏈接的繪製熱點，繪製完成如圖：

（11）然後進入淘寶複製鏈接貼入相對應的板塊當中。當我們把所有的模塊鏈接都添加好了之後，把兩個“body”之間的代碼拷貝下來。再打開剛剛的“搜索功能代碼”。將拷貝下來的代碼粘貼在兩個“店招內容之間”。

（12）所有的鏈接都貼好了之後，再次把兩個“body”之間的代碼拷貝下來，再打開淘寶店鋪裝修後台，在店招的位置雙擊。再按照下圖操作：

（13）編輯好了之後我們再發布出去，那麼我們今天學習的淘寶裝修搜索功能就完成啦。後面還有第二種效果圖，由於圖文解説有限，更多的詳情就請觀看上方視頻。

特別提示

注意代碼下載

如有不懂可以看上面視頻教程