導讀：

   在這競爭激烈電商領域， 運營，美工、推廣、客服對店鋪的整個運營息息相關，缺一不可。今天，咱們就來聊聊店鋪設計，為什么是談店鋪設計呢，接下來將為你揭曉。靚麗的頁面最能引人注意，豐富的畫面可以讓平凡普通的頁面更加有活力，從而降低跳失率，提高轉化。

正文： 

   盡管是普通的頁面，也能擁有活力的一面，而在其中起橋梁的就是——裝修。或許你會說裝修我也會，但，你真的懂嗎？還是只會簡單的裝修。一個成功的店鋪離不開運營，離不開設計， 一個好的頁面需要符合主題地去設計，當然，裝修是每個頁面的必經之路，無論是普普通通的頁面還是高逼格的頁面，經過裝修之手，就像經過層層的精致包裝，才可以完整、更美好的呈現在大家面前。

一、交互效果的應用

首先需明確，要想要一些豐富的交互效果或是比較智能的顯示，就算是高級的后臺裝修模板，也是需要借助其他工具來使用的，比如倒計時。就需要借助外來工具的使用，接下來就為大家引薦設計師門在裝修時會經常用到的工具——盛夏科技在線布局和醉語言編輯器。

（一）設置動態倒計時

設置倒計時，一般在大促活動中會用到，可以起到渲染活動緊張氛圍的效果。如下圖所指，做好倒計時圖片，上傳圖片空間后，進入盛夏科技，把背景和尺寸調整好，再點擊“倒計時”圖層，調整好下列的屬性，最后點擊右上角的”生成代碼”即可（需注意選擇是淘寶店鋪還是天貓店鋪，因為不同類型的顯示尺寸是不一樣的）。

（二）設置搜索框、視頻以及旺旺客服

搜索框可調節大小以及不透明度，視頻可等比例調節大小，并將視頻鏈接放入即可。旺旺客服可調整顯示大圖小圖。如下圖：

（三）輪播海報的應用（不用買智能版依然可以用）

海報輪播，對于用默認的專業版模板的店鋪，是沒有全屏圖片輪播的功能的，但買模板的每個月也要承擔的很大的費用，當然，針對的一些小商型的店鋪。現在解決辦法來了，不用購買裝修模板也可以實現全屏輪播海報的效果。同理，打開“盛夏科技”，點擊右側的“圖片輪播”層，在底部屬性里即可添加輪播圖片以及鏈接，導航開關以及箭頭可自行選擇隱藏，最后直接點擊生成代碼即可。

（四）鼠標經過彈出圖層

鼠標經過彈出圖層，也就是開關燈效果， 將寶貝圖片和鼠標經過的圖片依次更新上去，調節好大小生成代碼即可，是不是很簡單呢。

（五）多層固定背景代碼

多層固定背景，是交互效果其中一種，在頁面上的效果表現是有一層是固定的，另外一層可以在其固定背景上滾動展示。一般運用在分類banner的海報上，圖片是固定背景——jpg格式，上面的文字是可以滾動的——png格式。按下圖所示，復制圖片鏈接地址，替換紅色的文字，對于png的透明圖，需要復制代碼去替換。然后即可去后臺利用自定義模塊去編輯即可。

二、裝修必備橋梁

（一）淘寶天貓店鋪優惠券鏈接轉換工具

有裝修過后臺的人都會知道，pc端的優惠券鏈接和無線端的優惠券鏈接是不一樣的，在這就給大家獻上寶典——淘寶天貓店鋪優惠券鏈接轉換工具。

http://www.ahatao.com/pc2wap/

直接復制鏈接點擊生成即可獲取無線端的鏈接地址，是不是很方便呀。

（二）1920尺寸全屏頁面生成

你可知道這是什么呢，一般情況下，無論是天貓還是淘寶店鋪，頁面上的寬度是做1920px的，但你在裝修的時候，是否有遇到過這樣的情況呢，直接把圖片放上去，卻不會居中顯示，而是偏移了位置，這時候就需要借助這個工具來限制它啦——戰國策。http://moban.cn/gongju/index.php?t=quanpin

如上圖所示，將代碼粘貼進選框中，然后點擊“生成全屏代碼”，復制代碼去裝修后臺即可，此處需要注意的是，在進行第二次生成全屏代碼時需要點擊左邊的“清空代碼”，不然會導致生成的是亂碼。

（三）如何獲取天貓淘寶的主圖原圖

最后這一招很神奇的哦，不知道你有沒有發現，淘寶的主圖獲取直接右擊就可以復制圖片了，但這招在天貓卻不頂用，那到底可以怎么拿到圖片呢，在主圖中選擇你想要的圖片，在小圖中右擊“在新標簽中打開圖片”，此時在新窗口里會看到一張小圖，只要將紅框里的尺寸限制刪除，就可以得到主圖原圖的大小。

五、總結

交互效果的應用，可以給頁面增加幾分活力，但是，也不是說交互效果越多越好，太多的話反而會擾亂整個頁面。特別是對于電商頁面，簡單的交互效果在頁面上呈現會美觀活力了很多，但應用過多的話會產生視覺疲勞的。以上所說的交互效果就有：

1.設置倒計時

2.設置搜索框、視頻、旺旺客服

3.輪播海報的應用

4.鼠標經過彈出圖層

另外，在裝修過程中也需要借助一些工具，方便我們工作的進行，例如生成全屏代碼,優惠券轉換工具，以及日常工作時需要用到的ps快捷鍵技能，通過一些技巧來提高我們工作的效率與質量。