The Metafields feature enables you to store additional fields in the SHOPLINE admin panel, allowing for customization of store appearance and functionality. With Metafields, you can implement personalized configurations or various display effects on store design and product pages, such as:
- Adding different user manuals for multiple products on the product detail page
- Adding different discount information on different Collections
- Adding different material descriptions, washing instructions, etc. for clothing products
- Adding Carat weight display information for jewelry products
- Adding different shipping notices for different products
In This Article
- Overview of Metafields Usage
- Introduction to Metafields
- Creating Metafields
- Assigning Values to Metafields
- Configuring Metafields in Theme Design
- Recommended Practices
Overview of Metafields Usage
Module selection: Each metafield is specific to a particular module, so before using metafields, you must identify the module for which you want to create them. Currently, Metafields supports the following modules: Product, Product variants, Product category, Page, Customers, Blog, Blog category, and Order.
Note: Metafields also supports the Company module if your store is on an Enterprise plan. |
Steps:
- Enter basic information for the metafield.
- Assign values to the metafield in your store’s SHOPLINE admin panel.
- Insert dynamic sources in the page editor or insert call codes in the SHOPLINE Layout Engine.
Introduction to Metafields
Metafield Composition
Entering the basic information of metafields. A metafield is composed of the following information: Field Name / OwnerResource / Namespace / Key / Description, and dataType.
- Field Name: The name of the metafield. For example: The material of the product.
- OwnerResource: The type of resource to which the metafield belongs, also known as the “OwnerResource Type”. For example: Products, Custom pages, etc.
- OwnerID: The ID of the OwnerResource to which the metafield belongs. For example: The ID of Product A is 1605898661.
- Namespace: A container for a group of metafields. Grouping metafields by namespace helps prevent conflicts between metafields with the same key name for different merchants. For example: my_fields.
- Key: The name of the metafield, used to reference a specific metafield, serving as a code identifier for the metafield. For example: materials.
- dataType: The type of data stored in the metafield, such as Single-line text, url, Whole number, etc.
- Description: Descriptive information defining the metafield, helping you enter the correct value when assigning values. For example: Input the material information for the jewelry.
- Value: The data to be stored in the metafield. For example: 925 silver.
Metafield Data Types
The following are the data types available for the Metafield feature:
Data Type | Subclass | Whether the value list is supported | Features | Use Cases |
Text | Single-line text | Yes | Supports single-line plain text input. | Add shipping notices for your products. |
Multi-line text | Yes | Supports multi-line plain text input. | Add a product ingredient table for your product. | |
Color | None | Yes | Supports RGB values in the #RRGGBB format. | Add a background color to your page. |
Json | None | No | Supports raw JSON data for advanced use cases. | Add custom modules to your store pages. |
Number | Whole number | Yes | Supports only whole number input. | Add a specific page count info for a book product. |
Decimal | Yes | Supports whole number + decimal input. | Add carat information for jewelry on the product detail page. | |
URL | None | Yes | Supports adding HTTP, HTTPS, and mailto: | Add a URL link to your product detail page. |
Date and Time
|
Date | Yes | Supports date values in the ISO 8601 format without a time zone. | Add product expiration date, order delivery date, or customer birth date. Example: 2022-05-28. |
Date and Time | Yes | Supports date values in the ISO 8601 format and time values in UTC time. | 2022-01-01T12:30:00 | |
True or False | None | No | Boolean type, creates a checkbox to select whether the condition is true or false. | Add whether an option is available, for example, whether a product can be engraved. Example: true. |
Measurement
|
Weight | Yes | Supports whole number and decimal values. Weight is measured in metric or imperial units, such as kg, g, lb, oz. |
Add the weight of a product or ingredient, for example, the grams of sugar. Example: {"value":3.0,"unit":"oz"}. |
Size | Yes | Supports whole number and decimal values. Size is measured in metric or imperial units. mm,cm,m,inch,foot,code |
Size: Add the height of a packaging box or the length of a product, for example, the length of a scarf. Example: {\"value\":2.0,\"unit\":\"in\"}. |
|
Volume | Yes | Supports whole number and decimal values. Volume is measured in metric or imperial units with a single value and a volume unit. Valid unit values: ml, cl, l, m3(cubic meter), us_fl_oz, us_pt, us_qt, us_gal, imp_fl_oz, imp_pt, imp_qt, imp_gal. |
Volume: Add the volume capacity of a water cup. Example:{\"value\":1.0,\"unit\":\"us_fl_oz\"}. |
|
Ratings | None | Yes | Supports configuring ratings or the star rating. |
Add a user rating or star rating for a product. Example: {\"value\":\"5\"}. |
Reference
|
Products | Yes | Supports referencing a product in your online store. |
Set featured products to be displayed on Product pages or Product collection pages in your online store. Example: gid://shopline/Product/160589866. |
Product variants | Yes | Supports referencing a product variant in your online store. | Set other clothing products with the same color to be displayed on Product pages in your online store. Example: gid://shopline/ProductVariant/1805951613. | |
Categories | Yes | Supports referencing a category in your online store. | Example: gid://shopline/collections/1225615767. | |
Pages | Yes | Supports referencing a Custom page in your online store. |
Insert a Policy page or detailed care instructions for a product in your online store. Example: gid://shopline/Page/59592784. |
|
Document | Yes |
Images: Refer to the store’s document library or upload images in JPG, JPEG, PNG, or GIF formats with a size of up to 10MB.
PDFs: Refer to the store’s document library or upload PDF files with a size of up to 10MB. |
gid://shopline/MediaImage/59301914
gid://shopline/GenericFile/596207872 |
|
Money | None | No | A numerical amount with a currency code matching the store’s currency. | {\"amount\":\"2\",\"currency_code\":\"USD\"} |
Creating Metafields
The following will be an example of creating metafields for the product module.
-
Open the SHOPLINE admin panel, and go to Settings > Metafields.
-
Select the module for the metafield you want to create. Currently, you can create metafields for the following modules: Product / Product category / Product variants / Page / Customers / Blog / Blog category / Order. In this process, we will choose the Product module for creating metafields.
-
Click Add fields.
-
Fill in the details and click Add once finished.
- Field name: Used to identify the metafield in the SHOPLINE admin panel, for example, Color.
- Namespace and Key: The unique identifiers for the metafield. You can use namespaces to group similar metafields, but each namespace and key must be unique. For example, “custom.color”.
- Description (optional): Provides descriptive information, such as the values to be entered for the metafield.
- dataType: The type of data the metafield will store, such as text, document, or URL. Configuration of single or multiple dataTypes is supported.
-
The creation is completed.
After the metafield is created, you can assign values to the metafield.
Assigning Values to Metafields
-
Select the module you want to assign values to. In the previous process, we created a metafield for the product module. Therefore, we will go to the Product page in the SHOPLINE admin panel to assign values. Choose the specific product you want to assign values to. In this example, we will select the first product and go to the detail page.
-
At the bottom of the page, locate the Metafields module and select the metafield for assigning values. The type of value you can input depends on the data type of the metafield.
Complete the process of assigning values to metafields.
Configuring Metafields in Theme Design
Inserting Metafield Dynamic Sources in the Editor
Please refer to the specific operating instructions: Metafields | Configuring Metafields in Theme Design.
Inserting Call Codes in the Layout Engine
After creating and assigning values to metafields, you can find the corresponding call code for the fields in the SHOPLINE admin panel under Settings > Metafields. Copying this code allows you to apply it in the Layout Engine online code editor to meet your customization needs.
Note: To access the online code editor, please contact SHOPLINE’s online customer service or website consultants. |
Recommended Practices
Extending Fields Independently for Flexible Customization of Product Detail Pages
A well-crafted product detail page plays a crucial role in guiding customers toward a purchasing decision. In the fiercely competitive landscape of cross-border e-commerce, the devil often lies in the details. By showcasing unique and relevant information on their product detail pages, sellers not only earn the trust and goodwill of potential customers but also establish a distinctive competitive edge, enabling them to outshine their rivals.
For instance, consider a scenario where a merchant wishes to include washing instructions for a product. By creating an extended field specifically for washing information, customers can easily access these details on the product detail page. This not only enhances their confidence and trust in the product but also reduces the likelihood of returns resulting from washing-related mistakes.
Aside from washing instructions, merchants have the flexibility to include additional details like material composition, origin, and size on the product detail page using metafields as required.
Implementing Personalized Feature Requirements through Simple Code Customization
In addition to flexibly displaying more information, metafields can also be utilized to customize personalized feature requirements tailored to specific business scenarios. This can effectively mitigate the technical costs and barriers that merchants encounter when customizing their stores.
For instance, implementing TAB switching for product descriptions, adding a section for downloading related materials, or integrating a related product recommendation section.
Tab switching for product descriptions
Sometimes, the product detail page may need to present a wealth of information. However, if all this information is cluttered onto the page, it can overwhelm customers, making it challenging for them to find what they need promptly. This can lead to a subpar shopping experience and potential customer dissatisfaction.
To address this issue, merchants can utilize a tab-switching template to categorize and organize information effectively. This template allows merchants to present various categories of information within a single content box, enabling customers to navigate through different tabs to access the desired information. This approach ensures that the product detail page remains comprehensive while maintaining a visually appealing layout.
Previously, implementing such a feature required merchants to invest additional resources in hiring technical personnel for development, which was inconvenient. However, with the Metafields management tool, merchants can now independently create new extended fields and easily integrate a basic tab-switching template by copying and pasting the code. This simplifies the process of setting up a product description tab-switching template and displaying it on the product detail page.
Adding a download section for related materials
Not all information can be conveniently displayed directly on the product detail page. Some extensive material descriptions, such as installation manuals and material composition details, are better presented to customers in the form of documents.
With metafields, merchants can easily add download links for relevant materials to their products. This allows customers to click on the links and download the documents for local viewing, ensuring they have access to comprehensive information about the products.
Adding a Related Product Recommendation Section
Data shows that incorporating related product recommendations on individual product detail pages not only effectively increases customers' browsing time on the page but also enhances the average transaction value of the store.
Previously, merchants required specific plugins to implement related product recommendations. However, with the Metafields management tools, merchants can easily create a related product recommendation module anytime, anywhere.
In addition to allowing merchants to create extended fields for resources such as products, categories, customers, orders, blogs, pages, and stores to store specific information, metafields can also facilitate data transmission and interaction with other e-commerce systems (CRM/IMS/ERP) through the Admin API. This enables Shopline stores to integrate more seamlessly with other systems, allowing merchants to conveniently manage and view various data.
Comments