【企石網(wǎng)絡(luò )公司】阿里巴巴、淘寶自定義店鋪模板制作代碼

現在的B2B平臺可謂是異?；鸨?，像阿里巴巴、淘寶、天貓、京東等知名電子商務(wù)平臺，許多人不僅聽(tīng)過(guò)而且經(jīng)常使用?？墒侨绻覀円谏厦骈_(kāi)店鋪、賣(mài)東西應該怎么辦，平臺自帶的店鋪模板可能會(huì )不符合我們的要求，而自定義的模板又不太會(huì )做，下面企石網(wǎng)絡(luò )公司-眾展網(wǎng)絡(luò )為大家詳細分享B2B電子商務(wù)平臺的店鋪自定義模板制作！

自定義阿里巴巴/淘寶店鋪模板步驟

1.首先是要有一個(gè)大致的規劃，先用PS制作好模板的整體效果的圖片，然后用PS自帶的切片工具把這張圖片切成若干部分，為的是后期能在這些被分切開(kāi)的部分添加獨立的鏈接

2.為了方便看步驟筆者只切成六個(gè)小部分，其中編號1的小圖片不放鏈接，其他五個(gè)部分都要放單獨的鏈接。切完后選擇切片選擇工具，全選六個(gè)切片后導出

3.需要注意的是存儲導出的時(shí)候，選擇的是存儲為web網(wǎng)頁(yè)格式 ，點(diǎn)確定

4.存儲前在格式里面選擇同時(shí)存儲HTML和圖像 ，這樣我們就可以得到一個(gè)網(wǎng)頁(yè)文件和一個(gè)包含切片圖片的文件夾

5.PS部分就這樣結束了，下面要用到Dreamweaver來(lái)繼續生成代碼，以便直接放到自定義模板里面。我們用Dreamweaver打開(kāi)剛6.PS存儲出來(lái)的網(wǎng)頁(yè)文件，用拆分模式查看

7.會(huì )有人問(wèn)這一大堆的代碼看不懂，畢竟不是學(xué)網(wǎng)頁(yè)設計和編程的。別急，我們不需要全部懂，現在拆分模式下有一個(gè)很方便的功能，我們直接選取右邊圖片模式下的圖片，全選，就可以驚喜的發(fā)現左邊代碼模式下會(huì )自動(dòng)選取了一段代碼！沒(méi)錯，這一段代碼就是代表了右邊圖片的這些代碼，我們只需要它們，其他的沒(méi)有自動(dòng)選取的部分不需要用到

8.復制選中的這一段代碼，打開(kāi)我們的店鋪，添加一個(gè)自定義模板，在源碼模式下粘貼剛才復制好的代碼出來(lái)，點(diǎn)擊確定

9.會(huì )不會(huì )瞬間傻眼？模板竟然不是設計好的圖片的效果，是空白的。哈哈，別急，現在可以用到前面切片部分的文件夾里面的那些圖片了。在編輯模式下，選中其中一個(gè)空白切片部分，如圖，點(diǎn)擊上傳該部分對應的圖片

10.一一對應位置上傳完切片圖片，模板就露出真正的面目啦！不過(guò)還沒(méi)有完成操作哦，因為這只是一張圖片，還沒(méi)有屬于各部分自己獨立的鏈接。

11.重新回到模板，編輯模式，選取一個(gè)切片，右鍵選擇圖片屬性，在編輯圖片里面的鏈接地址里面添加鏈接【添加的是點(diǎn)擊該部分切片后，需要跳轉到的網(wǎng)址，記得勾選“在新窗口打開(kāi)鏈接”】

12.每一個(gè)切片都添加完對應需要添加的網(wǎng)址，大功告成！

以上就是阿里巴巴、淘寶等平臺的自定義店鋪模板制作的詳細介紹，其實(shí)我們并不需要懂代碼，只需要利用工具來(lái)達到快速工作的效果！