今天跟大家探討的是關(guān)于裝修的問題，雖然模板有千千萬萬，但它們都真正適合自己的店鋪嗎？在這里裝修不求人淘寶學(xué)堂教你免費(fèi)打造屬于自己的店鋪公告欄。

首先我們需要的軟件是photoshop(也就是PS)和dreamweaver

1、首先打開PS，依次點(diǎn)擊“文件” ---- “新建”

創(chuàng)建一個(gè) 750*750 分辨率為72的文件

2、從網(wǎng)上找一張圖片來作為背景，我們店里的整體顏色都是綠色的，所以我找來一張綠色的圖片作為背景，快捷鍵“ctrl+o”導(dǎo)入圖片。

3、選擇PS左側(cè)面板上的按鈕，把原圖拖拽到咱們新建的文件中來

4、點(diǎn)擊左側(cè)面板的按鈕在背景圖上托一個(gè)框出來（這個(gè)框就是以后我們輸入文字的公告欄，大小根據(jù)自己店鋪和背景圖的大小定），然后點(diǎn)擊右側(cè)面板上的按鈕新建圖層， 接著左側(cè)面板選擇顏色。

5、在拖出的那個(gè)框中填充顏色，快捷鍵“alt+delete”

我們還要給這個(gè)框描邊，方法是：點(diǎn)擊鼠標(biāo)右鍵，選擇描邊

進(jìn)入描邊選項(xiàng)

按鍵盤上的“ctrl+d”把框周圍的虛線去掉

6、給這個(gè)框加入立體感，點(diǎn)擊右側(cè)面板的按鈕，選擇投影選項(xiàng)

進(jìn)入投影選項(xiàng)，數(shù)據(jù)如下

最后效果

7、打字，選擇左側(cè)面板的按鈕，這個(gè)按鈕就是一個(gè)打字工具，選擇后鼠標(biāo)點(diǎn)擊圖片任意部分就可以打字了。

字體、大小、顏色 在這里調(diào)

如果想讓字體有立體感同上，選擇右側(cè)面板的，自己可以DIY，試著做一下。

8、我們還需要一個(gè)框，同樣點(diǎn)擊左側(cè)面板的按鈕，右側(cè)面板的新建圖層，這里顏色我們選擇白色，“alt+delete”填充顏色，然后鼠標(biāo)右鍵選擇描邊 ，這個(gè)框是用來放客服旺旺的圖標(biāo)的地方，可根據(jù)客服的多少來選擇這個(gè)框的大小。

進(jìn)入描邊選項(xiàng)

選擇顏色

9、給這個(gè)圖層加一個(gè)蒙版，選擇右側(cè)面板的按鈕。

10、依次選擇 漸變工具 漸變顏色

漸變顏色我們選擇第一個(gè)，左白右黑

按住鍵盤上的“shift”用鼠標(biāo)拉一條線，按住“shift”目的是拉的線是直線。

最后的效果

11、從網(wǎng)上找來一張客服圖片，從PS中"ctrl+o"導(dǎo)入這張圖片

選擇左側(cè)面板的按鈕，把原圖拖拽到自己的文件中

如果大小不一可按一下鍵盤上的“ctrl+t”鼠標(biāo)調(diào)節(jié)大小，大小調(diào)節(jié)好之后“回車”確認(rèn)

12、左側(cè)面板選擇按鈕，然后打上字

13、把你的旺旺圖標(biāo)截一下圖放在這里，這里的旺旺圖標(biāo)是不會動的，目的是一會切片的時(shí)候尺寸不會錯(cuò)

14、再從網(wǎng)上找來一張 收藏本店 ，這個(gè)最后加上鏈接，顧客朋友就可以點(diǎn)擊這里收藏你的店鋪了。

如果感覺還是比較空，就輸入關(guān)于店鋪介紹的文字

15、選擇左側(cè)面板上的按鈕，進(jìn)行切片，切片的時(shí)候注意，1.公告欄 2.旺旺圖標(biāo)切成一個(gè)一個(gè)的3.收藏本店 這3個(gè)地方一定要切好，公告欄是我們以后要放文字的地方，旺旺圖標(biāo)使我們最后要把它替換成客服的旺旺代碼，方便顧客和我們聯(lián)系，收藏本店使我們要單獨(dú)加入鏈接。

16、存儲，依次點(diǎn)擊“文件”---“存儲為Web所用格式”

點(diǎn)擊“save”

臨時(shí)保存在桌面上吧

存儲之后我們得到這兩個(gè)文件

好了，下一步我們要使用的軟件是 “dreamweaver”

1、打開軟件，選擇“打開”

選擇我們剛剛存儲的文件

選擇“設(shè)計(jì)”

2、用鼠標(biāo)點(diǎn)擊一下公告欄，記住源文件和尺寸

如上圖，這個(gè)的源文件是“images/未完成-03.gif” 寬：424高：425記住之后按鍵盤上的“delete”也就是刪除鍵，然后找到背景后邊的文件夾圖標(biāo)。

選擇剛才PS存儲的images

打開之后找到剛剛讓你記住的源文件，也就是images/未完成-03.gif點(diǎn)擊“確定”

輸入尺寸 寬424 高425 ，然后鼠標(biāo)點(diǎn)擊一下其他的圖就等于確認(rèn)了，看是不是被我們刪除的圖又回來了，只不過它是作為背景回來的，我們可以在上邊寫字了，寫上幾個(gè)字用來做記號，比如輸入“插入內(nèi)容”

3、旺旺圖標(biāo)也是一樣，同樣選定第一個(gè)旺旺圖標(biāo)，記住源文件和尺寸

刪除之后再從背景里邊找到被我們刪掉的圖片，也就是“images/未完成-07.gif”

替換好之后我們就可以在旺旺圖標(biāo)上打字了，這里你可以打上幾個(gè)字作為記號，目的就是以后放在淘寶自定義以后我們可以用旺旺代碼來替換這兩個(gè)字，來實(shí)現(xiàn)顧客點(diǎn)擊這里就可以和我們聯(lián)系，比如說我們先在這里打上“客服”兩個(gè)字，等把代碼復(fù)制到自定義里邊我們就可以用旺旺代碼來替換“客服”這兩個(gè)字了，如果不替換這兩個(gè)字那么它一點(diǎn)用處都沒有，有很多網(wǎng)站可以生成旺旺代碼，大家可以搜索一下。

4、我們需要把PS存儲的另一個(gè)文件里邊的圖片全部都要上傳到我們的圖片空間，記住不要勾選下邊這幾項(xiàng)，以免最后亂碼。

已經(jīng)上傳到空間了

5、我們從軟件中切換到代碼

選擇需要替換的部分，也就是“images/未完成-x.gif”

從淘寶圖片空間復(fù)制鏈接，需要注意一點(diǎn)，替換的時(shí)候一定要看準(zhǔn)文件名，1就替換1,2就替換2，千萬不要替換錯(cuò)了哦，替換的時(shí)候盡量采用快捷鍵“ctrl+c和ctrl+v”來復(fù)制粘貼，以免弄錯(cuò)。

OK，替換好了

6、把所有需要替換的全部替換完成之后我們也快大功告成了，復(fù)制粘貼到店鋪首頁的自定義，注意要切換到代碼再粘貼哦，旺旺圖標(biāo)一定要記得替換，公告欄里的文字想讓它成為自下往上滾動的效果，我們還要從代碼做文章，切換到代碼在你做記號的那個(gè)位置也就是“插入內(nèi)容”這個(gè)地方替換成代碼：

<marquee scrollamount="3" direction="up">文字部分替換成你想要讓公告欄顯示的文字</marquee>

全部搞定之后我們就可以預(yù)覽一下了，發(fā)布之前記得要把你原來的自定義備份一下，避免出問題了沒得還原了。

樂發(fā)網(wǎng)超市批發(fā)網(wǎng)提供超市貨源信息,超市采購進(jìn)貨渠道。超市進(jìn)貨網(wǎng)提供成都食品批發(fā),日用百貨批發(fā)信息、微信淘寶網(wǎng)店超市采購信息和超市加盟信息.打造國內(nèi)超市采購商與批發(fā)市場供應(yīng)廠商搭建網(wǎng)上批發(fā)市場平臺,是全國批發(fā)市場行業(yè)中電子商務(wù)權(quán)威性網(wǎng)站。

本文內(nèi)容整合網(wǎng)站：百度百科、知乎、淘寶平臺規(guī)則

本文來源： 免費(fèi)打造屬于自己的店鋪公告欄