大家好,我是一個(gè)淘寶新手,以前學(xué)過一點(diǎn)DW(DW是dreamweaver的簡(jiǎn)稱,是一款網(wǎng)頁(yè)設(shè)計(jì)軟件),沒想到如今在淘寶上用上了。想必大家都見過一些比較大的店鋪或是商城,人家做促銷時(shí),怎么樣實(shí)現(xiàn)一張圖片可以多個(gè)不同的連接呢?可能有些朋友會(huì)說,人家都是用PS切片,一塊塊切出來分開再另做鏈接的。其實(shí)不是的,使用PS切片來制作比較繁瑣,最大的缺點(diǎn)就是切片出來的圖片會(huì)失幀。下面給大家介紹《dreamweaver 8.0》是怎么實(shí)現(xiàn)一圖多個(gè)連接。DW的高手們多多指教,別拋磚喲!沒有DW軟件的朋友可以到百度上搜《dreamweaver 8.0》安裝時(shí)須要序列號(hào),百度上搜也非常多,下載、安裝就跳過。廢話不多說,上張圖,避廣告嫌疑,寶貝做模糊處理,只是圖片未上連接。
一、DW界面介紹
1、雙擊打開軟件,新建一個(gè)HTML網(wǎng)頁(yè)。如圖:
或是點(diǎn)擊《文件》——《新建》——《HTML》——《創(chuàng)建》如圖:
2、簡(jiǎn)單介紹下面幾個(gè)模式
代碼模式:所有東西以代碼顯示
拆分模式:是上半部分顯示代碼,下半部分示圖
設(shè)計(jì)模式:是全示圖操作
制作完成后,點(diǎn)擊中間地球圖標(biāo)是預(yù)覽,選擇瀏覽器預(yù)覽。此時(shí)會(huì)彈出問你是否保存,點(diǎn)擊確定保存即可預(yù)覽。如圖:
二、制作連接
1、點(diǎn)擊《設(shè)計(jì)》按鈕,進(jìn)入設(shè)計(jì)模式。
2、點(diǎn)擊《插入》——《圖像》選擇之前做好的促銷圖片后點(diǎn)擊《確定》。如圖:
彈出的窗口直接確定,如圖:
3、圖片屬性介紹
插入圖片后,點(diǎn)擊一下圖片選中,底部將會(huì)顯示圖片的屬性,如圖:
3、本地圖片地址替換成網(wǎng)絡(luò)圖片地址。
本地地址:就是圖片保存在你電腦上的地址(只能在本機(jī)看到)
網(wǎng)絡(luò)地址:是上傳到網(wǎng)絡(luò)圖片空間里的地址(保存到服務(wù)器大家都可以看到)
凡是想在網(wǎng)絡(luò)上顯示的圖片,都必須先上傳到網(wǎng)上,所以將圖片傳到淘寶圖片空間里(上傳方法與其它圖片一樣)
點(diǎn)擊《賣家中心》——《圖片空間》——《圖片上傳》——《添加圖片》——《確定上傳》。如圖:
上傳完成后,點(diǎn)擊《連接》來復(fù)制地址 如圖:
復(fù)制好連接后回到DW軟件里,將之前的本地地址選中,把剛在空間里復(fù)制的地址,按《Ctrl + V》粘貼上去,再點(diǎn)一下其它地方或是按鈕,圖片地址就替換過來了。如圖:
4、在圖片上添加熱點(diǎn)(熱點(diǎn)就是連接區(qū)域)
點(diǎn)擊圖片選中,底部將出現(xiàn)圖片屬性后,點(diǎn)擊《矩形熱點(diǎn)工具》在你須要連接的寶貝上,拉動(dòng)選取區(qū)域,畫上熱點(diǎn)。如圖:
熱點(diǎn)區(qū)域?yàn)橛兴{(lán)色(也有其它顏色)透明狀態(tài)區(qū)分,將其它寶貝都畫上熱點(diǎn)區(qū)域。點(diǎn)擊左下角的《指針熱點(diǎn)工具》可以選中,選中熱點(diǎn)區(qū)域時(shí),4個(gè)角會(huì)出現(xiàn)圓點(diǎn)。此時(shí)可以調(diào)整區(qū)域的大小,如圖:
5、添加連接地址
點(diǎn)擊左下角的那個(gè)箭頭圖標(biāo)《指針熱點(diǎn)工具》,點(diǎn)擊選中上面的熱點(diǎn)區(qū)域,熱點(diǎn)四個(gè)角會(huì)出現(xiàn)一個(gè)點(diǎn),屬性下面連接處默認(rèn)有個(gè):#號(hào)(#號(hào)表示空連接)選中刪除掉,如圖:
此時(shí)找到你的寶貝連接地址(當(dāng)點(diǎn)擊時(shí)連接到的地址)打開你的寶貝詳情頁(yè),瀏覽器上出現(xiàn)的地址就是你的寶貝連接地址。選中地址,按《Ctrl +C》復(fù)制地址。如圖:
刪除掉連接處的:#號(hào)后,把剛才復(fù)制的寶貝連接按《Ctrl + V》粘貼上去,此時(shí),點(diǎn)擊目標(biāo)處的三角形按鈕,選擇第一個(gè)《_blank》(blank是在新窗口打開)如圖:
其它連接操作一樣,全部制作完成連接后。
點(diǎn)擊上面的地球圖標(biāo)選擇瀏覽器預(yù)覽測(cè)試一下,如圖:
測(cè)試過沒問題后,點(diǎn)擊代碼按鈕,切換到代碼模式。按《Ctrl +A》全選后按《Ctrl+C》復(fù)制代碼,如圖:
復(fù)制好代碼后,進(jìn)入你的賣家中心《店鋪裝修》里,在你須要放置的位置,新建一個(gè)自定義內(nèi)容區(qū)。如圖:
添加好自定義模塊后,點(diǎn)擊《編輯》后再點(diǎn)擊雙箭頭圖標(biāo)《源碼》進(jìn)入到代碼模式,將剛才復(fù)制好的代碼,按《Ctrl +V》粘貼進(jìn)去。再次點(diǎn)擊雙箭頭圖標(biāo)《源碼》可切換回示圖模式。點(diǎn)擊保存。預(yù)覽沒問題后即可發(fā)布。如圖:
最后點(diǎn)擊發(fā)布操作:
樂發(fā)網(wǎng)超市批發(fā)網(wǎng)提供超市貨源信息,超市采購(gòu)進(jìn)貨渠道。超市進(jìn)貨網(wǎng)提供成都食品批發(fā),日用百貨批發(fā)信息、微信淘寶網(wǎng)店超市采購(gòu)信息和超市加盟信息.打造國(guó)內(nèi)超市采購(gòu)商與批發(fā)市場(chǎng)供應(yīng)廠商搭建網(wǎng)上批發(fā)市場(chǎng)平臺(tái),是全國(guó)批發(fā)市場(chǎng)行業(yè)中電子商務(wù)權(quán)威性網(wǎng)站。
本文內(nèi)容整合網(wǎng)站:百度百科、知乎、淘寶平臺(tái)規(guī)則
本文來源: 玩轉(zhuǎn)促銷圖HTML代碼