Custom fields on product pages

davidegiorgetta
Shopify Partner
6 0 0

Hi there, I need to add some custom fields on the product pages such as technical specifications and tabs displaying different kinds of descriptions. For now I added them as sections and blocks on the product page and I upload content through the Customize area of Shopify. The problem is that when I add some content to a product this is uploaded at the same time on all the products of the shop, but of course different products need different content.

 

A solution I found is to create a product page template for each product but this seems crazy to me as the structure of the page is the same on all the products and the content is the only thing that should change (and this should be what a template is supposed to do, at least in the majority of CMSs). And also the client doesn't want to deal with Liquid templates when adding new products, which completely makes sense.

 

Is there a way to add some custom fields (under any shape: sections, blocks, metafields etc.) to product pages and make sure different content can be uploaded in all of them? Is purchasing an app the only way to achieve this? Any best practices?

Thanks!

Replies 6 (6)
iDoThemes
Trailblazer
197 42 70

If you can get away with using the same template for each, then metafields would be the best way to attach different content to each product individually.  Now that metafields can be created within Shopify without the need for an app it's a bit easier to manage this.

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor
.




Theme Developer -- Drop me a line
davidegiorgetta
Shopify Partner
6 0 0

Yes, metafields seem to be a really good options. Are they only available on Online Store 2.0  or on the old themekit too? 

 

From what I see with metafields you can only add static fields and not dynamic ones (for instance a repeatable image field). Is that correct?

 

Thanks!

iDoThemes
Trailblazer
197 42 70

Metafields precede Online Store 2.0 so you can use them with any theme. Could you explain what you mean by a repeatable image field?

Developer of Liquify Chrome Extension -- Enhance the Shopify Theme Code Editor
.




Theme Developer -- Drop me a line
davidegiorgetta
Shopify Partner
6 0 0

Is the way to use metafields (pre Online Store 2.0) the one through the URL in which you can have a table in which uploadling content for any product?

 

Basically I need to create a tabs navigation (with a different number of tabs for each product) and a slider alternative to the default one I can create uploading images in the default images field in Shopify.

davidegiorgetta
Shopify Partner
6 0 0

It would be great to have a field which can be repeated multiple times depending on the needs. Like multiple text fields which are displayed through a certain number of tabs or collapses.

 

Is this something that can be done with metafields but without a Online Store 2.0 theme?

 

Thank you!

MetafieldsGuru
Shopify Partner
92 16 45

Hi David,

 

Sasha here from Metafields Guru team.

 

Sure, you can do that, but a theme customization is required. To start with, let's have a brief overview of metafields. The metafields object is a Shopify feature that provides users an extra space to store additional data used in various custom apps and themes. Metafields are used for backend data management only and don’t affect neither storefront nor functionality of a website by default. You can learn more about metafields here. Metafields may be used to store custom attributes for any resource type, however, one will have to customize a store's theme to display them at the storefront. Shopify's got a special markup language called Shopify Liquid that serves this purpose.

When it comes to metafields usage in terms of the custom Liquid code snippets, all you need to know is a metafield consists of four main components: 
1) namespace, 
2) key, 
3) value
4) value type 
Namespaces are used to group different metafields (something like a folder or a logical container), keys are unique identifiers to reference the information stored in metafields, values contain the data itself and value type represents the data type for a specific metafield: string, number, reference etc.  In order to display a metafield at the storefront with Liquid, one should use a specific pattern: 
{{ resource.metafields.namespace.key.value }}
That’s a really important part of custom functionality development as the slightest mismatch between the namespace and key combinations (or even a value type) used by custom Liquid snippet and your actual metafields will prevent them from being grabbed by Liquid code snippet or an API call. As you can see, metafields won’t be used on the storefront unless someone adds a custom code snippet for this purpose. Luckily for you, we've got a couple of neat tutorials on displaying metafields on the product page: here and here. Also, you may want to apply some proper CSS rules to the code you’ve added to make it fit into your theme's styling.

 

If you feel uncomfortable with customizing your theme and would like to have someone to do it for you, you may want to consider hiring a Shopify expert and delegating the job to this person. These guys are Shopify approved developers and are really good at implementing various custom solutions. Having a freelance tech person is a common practice for Shopify store owners who don’t need an in-house developer but would like to have some tech help occasionally.

 

Hope this helps!

 

Best regards,

Sasha Kachkovskyi

Co-founder and CEO

256 Development

Check out Metafields Guru, the #1 ranked metafields app.

Bulk editor | Data import/export | Metafield sets | Browser extension