淘寶旺鋪自定義客服中心和動態(tài)收藏店鋪的制作
156****1640樓主|2022-07-07|17:22|發(fā)布在分類 / 618大促|閱讀:7808
156****1640樓主|2022-07-07|17:22|發(fā)布在分類 / 618大促|閱讀:7808
在論壇也逛了好長時間了,一直沒有怎么發(fā)帖,一是由于自己工作生活比較忙,更重要的是自己的文筆有限,馬上就要到中秋節(jié)了,在這里我提前祝大家中秋節(jié)快樂,財源廣進廢話不多說,直接上干貨。
我在這里跟大家談?wù)勛远x客服中心的制作,希望給大家?guī)韼椭?/p>
一
、準備工具我們做自定義客服中心,主要就用到兩個強大的工具,一個是Photoshop
。另外一個是Dreamweaver
。PS我用的版本是CS5,DW用的版本是8.0.現(xiàn)在我們開始制作
。
二、用Photoshop制作客服中心1、打開PS,設(shè)置好背景色和前景色,這個是根據(jù)自己店鋪的風(fēng)格設(shè)置的,在這里我店鋪客服中心的背景色選擇了6b1834,前景色選擇了f87ca2,效果圖2、選擇視圖—新建參考線,對第一步的圖像進行分割,這個可以根據(jù)自己的設(shè)計自由新建參考線的,我現(xiàn)在是設(shè)置了一個售前客服,一個售后客服,最下面還有一個收藏店鋪,水平參考線的值分別是:0,50,60,90,95,113,123 ,153,158,176,186,23
6。豎直參考線的值是0和190.如圖:我在截圖上面標注了數(shù)字,這些數(shù)字分表代表了6個區(qū)域的內(nèi)容1表示我們要輸入的文字區(qū)域2表示售前客服字樣3表示售前旺旺圖片4表示售后客服字樣5表示售后旺旺圖片6表示收藏店鋪3、現(xiàn)在分別對上面的六個步驟進行詳解1 點擊工具欄上面的T,然后在1區(qū)域輸入“客服中心”四個字,字體顏色選自己喜歡的,字體大小選72,然后點擊圖層—圖層樣式—混合選項,選擇投影和外發(fā)
光。如圖2 和第一步一樣,選好顏色和字體,調(diào)整好大小如圖#p#副標題#e#旺旺的圖片是要讓系統(tǒng)自動生成
的。首先我們要開通E客服,這個論壇的帖子都有介紹,我在這里不多講,然后自己添加售前和售后客
服。然后回到店面裝修頁面,在左側(cè)欄添加一個模塊中心里面的客服中心,這樣做主要是要是生成旺旺代碼和旺旺圖
片。如圖4 區(qū)域4和區(qū)域2的步驟一樣,不再詳述5 區(qū)域5和區(qū)域3的步驟一樣,不再詳述6 點擊T ,字體顏色自己選,字體大小我選了72,輸入“收藏店鋪”,然后復(fù)制圖層ctrl+J,然后點擊圖層—圖層樣式—混合選項,選擇投影和外發(fā)光,發(fā)光的顏色自己
選。選擇窗口—動畫,下面出現(xiàn)了一個動畫幀,在圖層面板把剛才復(fù)制圖層的眼睛取消然后兩個動畫幀的時間都選0.2(這個隨自己喜好自己選),這樣動態(tài)收藏店鋪就做好
了。(動態(tài)收藏店鋪其實很簡單,我寫得有點少,大家可以看看論壇上面專門介紹動態(tài)圖片制作的)4、我們需要在區(qū)域3 5 6設(shè)置 連
接。選擇PS的切片工具,樣式選擇正常,然后在上述三個區(qū)域做切片,調(diào)整合適的切片,如圖格式一定要選HTML和圖像,點擊保
存。桌面上生成了一個HTML文件和一個image文件夾,把文件夾里面的圖片存儲到我們自己的圖片空
間。這樣PS的工作我們就做完了,存儲一份PSD格式的圖像,方便以后修改,然后關(guān)閉P
S
。三、用Dreamweaver添加連接和生成模版的代碼打開DW,選擇HTML,文件—打開,打開剛才生成的HTML
文件。呈現(xiàn)在我們面前的是一大堆代碼,不用管,選擇設(shè)計按鈕,出現(xiàn)下面的界面旺旺的源文件是上面TXT文檔的第二個網(wǎng)址,鏈接是TXT文檔的第一個
網(wǎng)址。2、然后點擊代碼,復(fù)制代碼頁的所有
代碼。3、在裝修頁面的左側(cè)欄新建一個自定義模塊,在自定義模塊里面黏貼我們復(fù)制的代碼,然后生成設(shè)計頁面,保存,
發(fā)布。最后的生成的效果圖就介紹到這里了,沒想到一下子寫了這么多,希望能給大家?guī)?/p>
幫
這個問題還有疑問的話,可以加幕.思.城火星老師免費咨詢,微V.信X號是為: msc496。
微信掃碼回復(fù)「666」