最近又有幾位朋友關(guān)注了秀色可燦，所以我這里再次溫馨提示下：本公眾號是燦燦給電商設計小白寫(xiě)的免費教程，更新時(shí)間是每周五晚上。如遇到身體狀況或者突發(fā)情況，周五未見(jiàn)更新，大家直接跳到下周五即可。不用等待。畢竟我是個(gè)實(shí)在人，不想浪費大家的時(shí)間。
好了。上周我們已經(jīng)知道了如何熱點(diǎn)裝修店招，那么這周呢，我們再了解下如何裝修異形店招。
所謂異形店招呢，就是跟普通的、我們常見(jiàn)的店招不太一樣。我們常見(jiàn)的店招呢，高度一般都是120p+30px,如下圖所示那樣：
那么這周呢，我們來(lái)嘗試另一種店招的裝修方法：
廢話(huà)不多說(shuō)，先準備一個(gè)異形店招（我隨便找了個(gè)給大家做示范）：以淘寶店鋪店招為例：
首先，第一步，導出整張店招，保存到桌面。
路徑：PS菜單欄“文件”——“導出”——“存儲為Web所用格式（舊版）”——存儲到桌面——存儲為JPEG即可(也可以按快捷鍵：三鍵“Ctrl”+“Shift”+“Alt”+S存儲)。
第二步，新建兩條參考線(xiàn)。
“視圖”——“新建參考線(xiàn)”——選擇“垂直”——輸入“485px”；同樣的方法，再新建一條參考線(xiàn),輸入“1435px”。至于為什么是這兩個(gè)數值呢，上周的教程里我有寫(xiě)，不懂的可以點(diǎn)開(kāi)下面的鏈接看下。這里我就不做重復。
然后PS現在是這個(gè)樣子的：
選擇裁剪工具，裁剪到參考線(xiàn)的位置。
裁好后，如下圖。中間應該是950px。（查看方式：點(diǎn)擊菜單欄“圖像”——“圖像大小”查看）。我現在是以淘寶為例，那么寬度是950px沒(méi)錯的。
接著(zhù)選擇切片工具。（我們是用切片去添加鏈接，而不是熱點(diǎn)。）
框選店招切片。(用切片工具框選要特別注意，不要交錯，不要在中間留下縫隙）
導出，并且保存為“HTML和圖像”。
“文件”——“導出”——“存儲為web所用格式”——“存儲”——存儲位置選擇桌面——格式選擇“HTML和圖像”——點(diǎn)擊“保存”。
這時(shí)候，桌面上就有這兩個(gè)了。
切完之后檢查下?。ㄟ@個(gè)很重要！)
切好之后打開(kāi)images文件夾是這樣子的：
沒(méi)切好（來(lái)個(gè)錯誤的示范），下圖就是切片沒(méi)切好，留下了一堆縫隙，大家千萬(wàn)要注意?。ㄔ趇mages文件夾里查看）
接著(zhù)登錄淘寶。
打開(kāi)淘寶后臺，進(jìn)入圖片空間，新建一個(gè)文件夾“秀色可燦全屏店招”，將“images”文件夾里的圖片上傳到圖片空間。
回到桌面。直接把秀色可燦這個(gè)圖標拖到DW軟件里。
然后DW現在是這樣的。點(diǎn)擊拆分。
然后找到“table”這個(gè)英文。（這個(gè)單詞是盒子的意思）我們先看前面，我們找到這個(gè)“table”，然后把“table”之前的代碼（不包含"table"）全部刪除。
接著(zhù)我們滑動(dòng)到最下面，同樣找到“table”這個(gè)英文，然后把“table”之后的代碼（不包含"table"）全部刪除。
接著(zhù)點(diǎn)擊選中第一張切片。
然后進(jìn)入淘寶后臺圖片空間，復制這張切片的網(wǎng)址。（第2個(gè)按鈕就是復制鏈接）
回到DW，刪除如圖所示紅框內所有文字，一定要刪除干凈！
然后粘貼我們剛剛復制的代碼
接著(zhù)點(diǎn)擊選中第二張切片。
然后進(jìn)入淘寶后臺圖片空間，復制這張切片的網(wǎng)址。（第2個(gè)按鈕就是復制鏈接）
回到DW，刪除如圖所示紅框內所有文字，一定要刪除干凈！
然后粘貼我們剛剛復制的代碼
其余的切片都是同樣的方法，這里我不過(guò)多的重復說(shuō)明了。
現在我全部替換完了。（你們慢慢換，嘿嘿！
）
接著(zhù)選中切片，我們分別給對應的切片添加鏈接（就是點(diǎn)了這個(gè)切片后跳轉的網(wǎng)絡(luò )鏈接地址）。比如，我選中“返回首頁(yè)”，那么我就要復制店鋪首頁(yè)的鏈接：
店鋪首頁(yè)鏈接的獲取路徑：淘寶后臺——店鋪管理——查看淘寶店鋪——打開(kāi)網(wǎng)頁(yè)后復制這個(gè)地址即可
進(jìn)入DW，在如圖所示“鏈接”這個(gè)框內粘貼剛剛復制的網(wǎng)址，目標選擇＿blank：
接下來(lái)是其他需要添加鏈接的切片，你需要給哪個(gè)切片，就選擇哪個(gè)切片，然后在DW下發(fā)“鏈接”一欄里粘貼對應的鏈接網(wǎng)址。這里我就不重復啰嗦了，大家自己去操作即可。
我們做店招添加的鏈接，往往是很多的（因為有的店鋪導航分類(lèi)很多），有時(shí)候甚至比首頁(yè)需要添加的鏈接都要多，這里需要大家多多耐心與仔細。
鏈接全部添加完成后挨個(gè)點(diǎn)擊下添加了鏈接的切片，看是否有漏掉選擇“＿blank”。然后全選所有的代碼（快捷鍵Ctrl+A），然后復制所有的代碼（Ctrl+C）。
然后進(jìn)入淘寶裝修后臺——店鋪管理——店鋪裝修——PC端——首頁(yè)——裝修頁(yè)面——找到店招的位置——編輯。
照片類(lèi)型選擇“自定義招牌”，再選擇源碼符號，再粘貼剛剛復制好的代碼，高度輸入“150px”最后點(diǎn)“保存”即可。
大家看到，保存后，我們看到的店招中間是有縫隙的，那怎么解決這個(gè)問(wèn)題呢？
DW里 按 ctrl+F 查找： alt=""
替換成：alt="" 即可！
替換好后淘寶店鋪裝修免費教程，大家看下，代碼是不是就替換好了。接著(zhù)選擇全部代碼，然后再復制（拷貝）代碼，然后進(jìn)入淘寶店招的代碼區域，粘貼我們的代碼，再點(diǎn)保存。
現在可以看到，中間的縫隙沒(méi)有了。
然后點(diǎn)擊左側的“頁(yè)頭”，頁(yè)頭背景色不顯示（別打勾就行）淘寶店鋪裝修免費教程，頁(yè)頭下邊距10像素選擇“關(guān)閉”，然后點(diǎn)擊“更換圖”（找到我們保存到桌面上的那整張店招：1920*150px的替換即可），然后選擇“平鋪”，選擇“居中”，然后“應用到所有的頁(yè)面”。
然后預覽下，挨個(gè)點(diǎn)擊下你添加鏈接的地方，沒(méi)什么問(wèn)題，再點(diǎn)發(fā)布即可。
好了，到這里我們的《裝修異形店招》就完美結束了。你是否Get到了呢？
以下是之前寫(xiě)的淘寶裝修干貨，大家按自己的需要點(diǎn)擊觀(guān)看，拿走不謝。
下周呢，先給大家做個(gè)預告：我們講講如何用代碼裝修動(dòng)畫(huà)店招。期待嗎？
喜歡記得關(guān)注我哦！也可以打賞燦燦，畢竟免費給大家寫(xiě)教程不容易呢~~下周五晚再見(jiàn)落！么么噠！
以上內容由用戶(hù)投稿，彬迪地板進(jìn)行整理發(fā)布，希望對大家有所幫助，如有侵權，請聯(lián)系我們進(jìn)行刪除。
裝修材料一站式解決方案商
