Shopify - 將新的自定義標籤頁添加到產品詳細信息頁面

-2

我有一個基於Shopify的網站。在我的產品詳細信息頁面上，我有3個選項卡，其中一個顯示產品描述，另一個顯示網站運輸信息，另一個顯示產品的顧客評論。不過，我需要添加一個名爲「care」的新列，然後在Shopify管理員中創建/編輯產品時，需要輸入產品獨特的護理信息，這些信息對於每個產品都是獨一無二的。Shopify - 將新的自定義標籤頁添加到產品詳細信息頁面

我發現這個教程，但它不是在如何將新內容添加到產品 https://help.shopify.com/themes/customization/products/add-tabs-to-product-descriptions

任何建議的教程，這將有助於我有幫助嗎？我很喜歡HTML，甚至PHP我只是不知道要編輯的文件。該網站已經安裝了jquery和bootstrap。

感謝

來源

2017-01-18 Jayreis

這是對發展中Shopify主題的最令人沮喪的事情之一 - 添加自定義內容，產品和頁面是不容易的。儘管支持所有內容類型（博客，文章，頁面和產品）的metafields，但無法在Shopify編輯視圖中創建或編輯這些字段及其內容。關於metafields的文檔，更多信息和教程可以在這裏找到：https://www.shopify.com/partners/blog/110057030-using-metafields-in-your-shopify-theme

如果您在問題中提到的教程不符合您的需求，以下選項之一可能工作，但都需要熟練使用Liquid。

1.使用metafield編輯器應用

存儲並顯示在一個自定義元場，這是不幸的是沒有在編輯產品視圖中可見第四屆選項卡的內容。

我已經與Shopify FD（http://shopifyfd.com/）或其稍微升級版Shopify自定義字段運氣最好，雖然兩者都要求您安裝Chrome擴展程序才能在應用程序中使用它。如果您正在爲客戶構建網站，這可能不是管理內容的用戶最友好的方式，但會完成工作。按照上面鏈接中的安裝說明開始。

一旦你能夠創建和編輯metafields，你將需要更新你的product.liquid模板來使用相應的鍵來渲染metafield。

{{ product.metafields.care_instructions }}

2.將內容在說明書中，並使用液體來提取它

這個解決方案是不理想的，但是簡單執行。其基本思想是description字段將把產品描述和護理說明一起保存爲一個唯一的字符串。使用唯一字符串將描述分割成數組。數組中的第一項將成爲描述，第二項成爲護理說明。

{% comment %} 
     First create and capture the description into variables if the delimiter string is found. 
    {% endcomment %} 

    {% if product.description contains "<!-- #care_instructions -->" %} 

     {% assign content = product.description | split: "<!-- #care_instructions -->" %} 
     {% assign description = content[0] %} 
     {% assign care_instructions = content[1] %} 

    {% else %} 
     {% assign description = product.description %} 
     {% assign care_instructions = false %} 
    {% endif %} 

    {% comment %} 
     description will always exist as the product description content regardless if the delimiter is found 
    {% endcomment %} 

    {{ description }} 

    {% comment %} 
     if care_instructions is not false display it 
    {% endcomment %} 
    {% unless care_instructions == false %} 
     {{ care_instructions }} 
    {% endunless %}

您需要包裹在上面的引導標籤標記正確顯示，可能添加一個有條件限制的標籤導航元素的顯示時care_instructions設置爲false，以避免用戶點擊一個空標籤。

來源

2017-01-19 00:06:41 MoxieEric

Shopify - 將新的自定義標籤頁添加到產品詳細信息頁面

回答

相關問題