已收藏,可在 我的資料庫 中查看
關(guān)注作者
您可能還需要

shopify 二次開發(fā) 產(chǎn)品詳情頁面的開發(fā)一(結(jié)構(gòu)布局)

在 使用 shopify 的一些主題過程中,總有不如意的地方,所以就需要我們程序員敲敲代碼了,本篇講的是shopify 產(chǎn)品詳情頁的開發(fā) 之 結(jié)構(gòu)布局,建議同行們?cè)诒镜亻_發(fā),本地開發(fā)shopify部署可以看 Shopify 配置本地開發(fā)教程 最詳細(xì)詳解

shopify 二次開發(fā) 產(chǎn)品詳情頁面的開發(fā)一(結(jié)構(gòu)布局)

在 使用 shopify 的一些主題過程中,總有不如意的地方,所以就需要我們程序員敲敲代碼了,本篇講的是shopify 產(chǎn)品詳情頁的開發(fā) 之 結(jié)構(gòu)布局,建議同行們?cè)诒镜亻_發(fā),本地開發(fā)shopify部署可以看 Shopify 配置本地開發(fā)教程 最詳細(xì)詳解

一、結(jié)構(gòu)布局說明

shopify 二次開發(fā) 產(chǎn)品詳情頁面的開發(fā)一(結(jié)構(gòu)布局)

二、創(chuàng)建 產(chǎn)品詳情頁 section

1、在 section 文件夾 下面創(chuàng)建自己的 產(chǎn)品詳情頁的section,如 boderry-product-template.liquid,一般我們可以給自己創(chuàng)建的文件加上前綴 如我加的前綴是 boderry shopify 二次開發(fā) 產(chǎn)品詳情頁面的開發(fā)一(結(jié)構(gòu)布局) 2、在 /templates/product.liquid 修改原先的 section 指向 shopify 二次開發(fā) 產(chǎn)品詳情頁面的開發(fā)一(結(jié)構(gòu)布局) 到這里我們就可以編寫我們的產(chǎn)品詳情頁了

三、編寫結(jié)構(gòu)代碼

代碼如圖

shopify 二次開發(fā) 產(chǎn)品詳情頁面的開發(fā)一(結(jié)構(gòu)布局)

效果

shopify 二次開發(fā) 產(chǎn)品詳情頁面的開發(fā)一(結(jié)構(gòu)布局) 對(duì)于這基礎(chǔ)的結(jié)構(gòu)布局代碼編寫我就不說了,大伙估計(jì)比我還熟悉這布局,對(duì)于前端人員來說,我們更重要的是獲取數(shù)據(jù)和利用數(shù)據(jù) 下一步我們將進(jìn)入 圖片展示區(qū)域的開發(fā)

(來源:baymax)

以上內(nèi)容屬作者個(gè)人觀點(diǎn),不代表雨果跨境立場(chǎng)!本文經(jīng)原作者授權(quán)轉(zhuǎn)載,轉(zhuǎn)載需經(jīng)原作者授權(quán)同意。

(來源:baymax)

分享到:

--
評(píng)論
最新 熱門 資訊 資料 專題 服務(wù) 果園 標(biāo)簽 百科 搜索
雨果跨境顧問
【爆單沖刺】Google爆單沖刺包
雨果跨境谷歌官方顧問

收藏

--

--

分享
baymax
分享不易,關(guān)注獲取更多干貨