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