Shopify的主題結(jié)構(gòu)分析（一）,shopify的基本知識-ESG跨境

Shopify的主題結(jié)構(gòu)分析（一）,shopify的基本知識

《購物》的主題結(jié)構(gòu)分析(一)

主題模板結(jié)構(gòu)

其實在修改Shopify的主題代碼或者模板配置項的時候，我們并不知道主題代碼的結(jié)構(gòu)和Shopify的代碼，所以有時候我們只知道在哪里修改什么內(nèi)容。我們雖然改了，但是并不真正理解為什么要在這個位置改，甚至不知道為什么代碼或者配置要這樣設(shè)置。為了滿足我們?nèi)找嬖鲩L的需求，我們先來熟悉一下Shopify的深層結(jié)構(gòu)。

平時我們更改Shopify的主題模板時，無論是Shopify自帶的配置項，還是修改了Shopify的主題代碼文件。我們總能看到Shopify的整個模板結(jié)構(gòu)，比如下面的結(jié)構(gòu)層次(圖1)。最常見的模塊是頁眉頁腳，我們可以發(fā)現(xiàn)基本上每一頁都會出現(xiàn)，設(shè)置項目也很常見。

圖1

我們可以打開主題的代碼修改部分。我這里用的是系統(tǒng)默認的主題出道，每個主題模板都有不同的結(jié)構(gòu)層次和編號?？梢哉f付費主題模板的可選版塊和可配置項目遠比免費的多。也就是通過設(shè)置付費模板可以改變更多的東西。當然，只要你能改變代碼的風格，免費模板的主題也可以比付費模板改得更好。

我們可以再看看代碼部分的結(jié)構(gòu)。(圖12)

圖12

在圖12中，我們可以看到代碼的主要結(jié)構(gòu)分為七個部分:布局、模板、部分、代碼片段、資產(chǎn)、配置和區(qū)域設(shè)置。所有的基本主題模板都只有這七個代碼模塊。

版面指的是布局，也就是總的布局風格。比如header section和footer section都是在layout下的主題中引入的，那么為什么在每一頁中都能看到常見的頁眉和頁腳呢(圖2)。

圖2

模板可以理解為每一個頁面，比如產(chǎn)品頁面，購物車頁面等。，通常是在布局的布局下構(gòu)建的。

版塊是每個功能模塊，如圖2中的特色收藏、幻燈片等。模板代碼中的{%section%}通常會引用節(jié)。

Snippets是比Sections更小的模塊?？赡苁荢ection下的少量功能模塊，通常由{%include%}引入。

資產(chǎn)通常包含相關(guān)的導入文件，如js文件、css文件和一些圖片資料。

Config是描述整個主題的一般設(shè)置。比如圖22中的字體顏色，字體風格等等。與單個節(jié)相關(guān)的設(shè)置項通常寫在相應的節(jié)文件下面。(圖23)

圖22

圖23

語言環(huán)境，如果您的商店的業(yè)務目標是一些不常見的國家，并且您想將您的主題語言更改為相應的國家，那么您應該在存儲相關(guān)語言模板的語言環(huán)境中進行配置。語言模板的配置詳細信息將在以后更新。

通過上面的介紹，我們可以對整個主題和代碼結(jié)構(gòu)有一個大概的了解。如果某個位置有修改代碼的需要，我們也可以準確的找到修改的位置。

特別聲明：以上文章內(nèi)容僅代表作者本人觀點，不代表ESG跨境電商觀點或立場。如有關(guān)于作品內(nèi)容、版權(quán)或其它問題請于作品發(fā)表后的30日內(nèi)與ESG跨境電商聯(lián)系。