Shopify Metafields: How to Add Custom Fields in Shopify (Online Store 2.0)

Поделиться
HTML-код
  • Опубликовано: 3 дек 2024

Комментарии • 138

  • @dejaeo.4827
    @dejaeo.4827 2 года назад

    The video I've been searching for and the ONLY ONE that ACTUALLY helped!!!!!!

  • @dukeofcambridge9240
    @dukeofcambridge9240 2 года назад +1

    Thanks Chris , found your channel after i reached out to Shopify support and they could not help me with this issue.Your tutorial saved the day.Easy and very helpful, well explained in plain English that even non techies like me can easily understand!!

  • @monsurrahman8773
    @monsurrahman8773 3 года назад +12

    Thanks Chris, great video. Can you please make a video on how to create a dynamic product tab like additional info, weight, height, etc, or provide me a guideline that makes me able to do it. Thanks again. Love and Support from BD.

  • @Watchstrapworld
    @Watchstrapworld 3 года назад +2

    Excellent tutorial - super explanation on how to use metafields. This is my first play with Shopify and this was so easy to make the customised changes to my product pages! Thanks, Chris!

  • @argoagencia7821
    @argoagencia7821 2 года назад

    Thank you so much my friend. Literally, I never write in the comments, but you help me a lot with this !! God Bless you

  • @harveyy7
    @harveyy7 2 года назад +1

    Thanks, this was helpful. I was keen to see a demo on the variants metafields but this was good. I'm not a coder at all, just building my own website with Shopify! Thanks again 😊

  • @jordihoven2349
    @jordihoven2349 2 года назад

    Clear video. Finally able to get rid of a Shopify App, which in turn got rid of a lot of manual input!

  • @взлзциявизуализациядлятренеров

    Many thank Chris! Really helpful and absolutely clear!

  • @JahJuZmu
    @JahJuZmu 3 года назад +3

    Great quality & depth in your videos!
    Building Custom Template - FAQ page would be helpful to open the concept of block and template building on the normal (non-product) pages. Personally would be interested to understand how you would build new custom block/section with accordion menu that can be edited from the "theme customizer".

  • @mrtwomore
    @mrtwomore 2 года назад

    Great explanation! Thanks for the time spent making this!

  • @Metis1971
    @Metis1971 3 года назад

    So clearly explained. Thank you!

  • @rowbyrowby
    @rowbyrowby 3 года назад

    Great tutorial. Excellent that you are showing the logic and underlining code if this fantastic Shopify update. …Rowby.

  • @fryrdbrainz
    @fryrdbrainz 3 года назад

    very helpful and easy to follow - thanks brotha!

    • @fryrdbrainz
      @fryrdbrainz 3 года назад

      ...except the image coding section at the end lol

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      Image coding section?

    • @fryrdbrainz
      @fryrdbrainz 3 года назад

      @@CodewithChristheFreelancer Yeah, but it's not need for me at the moment. I'm not too well-versed with coding so I got lost, but if I do need held in the future I'll reach back out. Appreciate it, man!

  • @karinleung6269
    @karinleung6269 Год назад

    hello, i love your video with steps instruction!! May I know if you can take a video to instruct the coding of creating a hyperlink button in product page? I think many people will need it, especially those product that are open for cutomization. thanks

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  Год назад

      Hi Karin. You can find the code for the product template in product.json where you'll find reference to the sections that are to be loaded. Within one of those sections you can add the link tag Text here

  • @Iamprashantsirohi
    @Iamprashantsirohi 2 года назад

    I was looking for a video to understand the metafields and how it works and how can we use it. Video was really helpful. Now I understand the metafields. Only problem is the coding. Please make a video on more metafield briefly for the noobs, like me, for people who have no background in coding.

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад +1

      Hey Prashant. Have a look at my previous video on Metafields and let me know if that helps.

  • @ArsalanKhan-iu5kw
    @ArsalanKhan-iu5kw 3 года назад

    keep it up nice work

  • @taylorpage8648
    @taylorpage8648 3 года назад +1

    Great video Chris!
    Was disappointed that the metafields don't show up on product export but hoping Shopify does catch up to that. Otherwise, products with large number of SKUs will be really difficult to manage.

  • @softinaction
    @softinaction 3 года назад

    Keep Up the Nice Work 🙂

  • @dsb5417
    @dsb5417 2 года назад

    thank you so much

  • @sanspeccollection7925
    @sanspeccollection7925 3 года назад

    I am not an expert on meta fields. I have a Debut Theme. Why would we use the Meta will be useful to us who is stuck in the Stupid Mode. Can it be use to add Social Medias to your product pages?

  • @NadeemGorsi
    @NadeemGorsi 3 года назад

    Many thanks and likes!!

  • @clementeen
    @clementeen 3 года назад

    I tried adding a URL type meta field to the product page titled Back to Shop so that it can act as a way to navigate back to the shop. It didn’t work though

  • @ShahinKhan-fe9wz
    @ShahinKhan-fe9wz Год назад

    Great way you have talked on what I needed to hear. Unfortunately, youtube is filled with missleading info. Can I get your direct help with my shopify theme (Dawn). I understand you are a busy person. I use stock sync to update feed and it doesnt upload dimensions. I have tried adding metafields following your video but I may need some coding which I am BS at. Shahin.

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  Год назад

      Hey Shahin. No problem! I have a Patreon for this kind of service.
      www.patreon.com/shopifydeveloper
      Feel free to shoot me a message there and I will help you through that.

  • @teamarkovik4901
    @teamarkovik4901 2 года назад

    Hi Chris, thanks for the tutorial. I have a very important question, please take a look and let me know if you know the answer.
    Why is the video file metafiled not working when I try to add different videos to each product page? I can only pull dynamic source for the cover image and the alt text but the video on its own does not give the opportunity to be pulled from a dynamic file source even though I have already uploaded and assigned videos to every product from their respective product page.
    Thank you in advance.

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      Not sure Tea but if you wanna message me on Patreon, we can troubleshoot it.
      www.patreon.com/shopifydeveloper

  • @katobaron
    @katobaron 2 года назад

    Thanks for the great video! One question, is there a way to add custom HTML to a multi-line text metafield? I want to hyperlink certain bits of text but it displays the raw HTML when I add it to the metafield.

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      Have a look at the metafield filters. Might be something in there for you.
      shopify.dev/api/liquid/filters#metafield-filters

  • @skm3774
    @skm3774 3 года назад

    You can show us how to get rid of one sided discription and create tabs and put discription and reviews side by side

  • @mutualrespect4411
    @mutualrespect4411 2 года назад

    Hey Chris, can we use metafield to give customer option to upload images/videos to personalise the product? I couldn't find documentation that explains this in details. Also, is there a video or link to doco for using GraphQL shopfront api to upload images into metafield when customer buys product? **not looking for code :D, link to information or doc will be good too. Cheers!

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      Hi Mutual Respect. The only way to add data to your Shopify store (minus a few limited scenarios that Shopify allow such as creating an order at checkout or submitting a contact form) is through the Admin interface or Admin API.
      I think this would still be possible but you'd need to create a custom app/API that runs on your Shopify theme. This app or API would either store the file in your own app's database or connect to Shopify via the Admin API to place the file in your store's 'files' folder.

    • @mutualrespect4411
      @mutualrespect4411 2 года назад

      @@CodewithChristheFreelancer gotcha, thanks mate! I did saw Admin API...but wouldn't be a good idea to expose that on my iOS app. I might just have to upload to Firebase Storage and add URL as part of custom attribute to my line items. Thanks for validating this! I was excited to use Metafields for this... :D

  • @AngelaJasmina
    @AngelaJasmina 3 года назад

    Thank you for this video! Is there a way to add a personalization section to a product for example if they want there name added to a product?

  • @jillturnbullbeauty
    @jillturnbullbeauty 3 года назад

    Hi Chris thank you for the videos, awesome information - I have a question I am upgrading my website from Debut to a 2.0 theme and need to recreate makeup colour swatches - can I do that using metafields and how do I attached a color swatch I have or should I use an app?

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      Can you describe how you want these 'makeup colour swatches' to operate? Not sure what you're trying to achieve at this stage.

  • @topshelftequilaaustralia1709
    @topshelftequilaaustralia1709 2 года назад

    Is it possible to add a metafield filter where a product has multiple values. for example if a product was made from "glass" and "meta". I want a filter called "Materials" and I want that product to filter on both "glass" and "Metal"

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      Should be. 'Metafields' are listed on the the documentation as eligible for storefront filtering. Give it a go and see if it works ;)

  • @vaydamaher
    @vaydamaher 3 года назад

    Hey Chris!
    I'm trying to create custom colour swatches on my website, and I wondering if this is how I do it or if I do it in the variant section, I'm very lost, thankyou for your time.

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      I've seen it done with variants and I've seen it done in product sets (separate products linked together via a collection). In terms of metafields, you could create a metafield for 'Color' but then you'd need to figure out how to use it.

  • @VincentandbarnCoUk
    @VincentandbarnCoUk 3 года назад

    Great video, do you know if metafields work in theme TRIAL mode?

  • @GershonBenYitzhak
    @GershonBenYitzhak 3 года назад

    I'm using Debut, and I made my store in 2018. Doesn't seem like I have any of the options you do in the theme editor. For my default product page, I can't change much except enabling image zoom, show vendor, show variant labels, and show quantity selector. That's all.
    Edit: cause everything is still in .liquid files.

  • @kimmiies2548
    @kimmiies2548 3 года назад

    Hey Chris! Any advice for adding metafields to the Blog Object?

  • @fernandopacheco7025
    @fernandopacheco7025 3 года назад

    Hi Chris! I’m trying to change the color of the product title by using a metafield, I’ve created the metafield and linked it to the product. However, I’m confused on how to link it in the customizer/theme editor as there isn’t a way to link the metafield I created. Can you please help?

  • @klokkerholm1993
    @klokkerholm1993 3 года назад

    Does this only work with Dawn theme i can change or get block components on the product page (is locked) i use prestige theme?

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      I'm assuming you're referring to the 'section everywhere' functionality. This is now available on any template that uses the JSON format (as apposed to Liquid)

  • @infoportroque2256
    @infoportroque2256 3 года назад

    Hi Chris, great video! I am trying to use metafields for the new 2.0 filters but having trouble with only one value being allowed per metafield per product. Have you seen a way to add more than one value to a metafield? For example if my namespace.key is Products.Style and I want to show single line text describing the style of a dress. This dress can be "flowy" and "one-shoulder" so I would like to have two values in products.style .. one as flowy and one as one-shoulder so this dress shows up under either filter option. Any idea?

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      hmm no I haven't come across this issue yet but thanks for letting me know. I'm planning a video on the new 2.0 filters so I'll take a look into it.

  • @Wayf0R
    @Wayf0R 3 года назад

    Hey Chris, at 2min28sec you are showing the product page in the Theme editor with all the components. If I go there, I can't drill down to the elements. I only have the "Product Information" and nothing on the lower level.
    Any Idea?
    ruclips.net/video/aEemVBqS3Yk/видео.html

  • @abdullahghani6691
    @abdullahghani6691 3 года назад

    i create new store as mentioned in your last video , but no new Dawn theme, even in a shopify theme store. it still show old default theme (Debut)

  • @mdshakilmiah3061
    @mdshakilmiah3061 3 года назад

    sir please make a video how to track shopify enhanced e-commerce with dynamic value via google tag manager.
    like product name, product quantity, product price, transaction id, total price, shipping info, payment info, etc

  • @curiousdog1207
    @curiousdog1207 2 года назад

    How do you make them LINKS from the product page to display all that are within that Meta field?

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      Not sure what you're trying to say here. Maybe include a timecode to the part of the video your question relates and I'll understand better.

    • @curiousdog1207
      @curiousdog1207 2 года назад

      @@CodewithChristheFreelancer 3:05 you changed the Vendor to Brand. I would like to be able to have customers link on that Brand name "Nike" as a link, which would then show them all the products with the "Nike" brand name.

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      Ah I see. So you'd like to see a collection page filtered by a certain metafiled value. Before Storefront filtering, you could only filter by tag but with the new Storefront filtering, I think you can do it.
      Refer to the documentation and let us know how you go
      shopify.dev/themes/navigation-search/filtering/storefront-filtering

  • @godwinbanang0914
    @godwinbanang0914 Год назад

    Metafields on product are limited in 20. How can I add more pins?

  • @kaigeertsma6139
    @kaigeertsma6139 2 года назад

    Can these metafields be added to regular pages as well?

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      As in the content section of a Shopify Page? If so, the answer is no. You can't insert liquid code in the admin, has to be in the theme. Although, you could possibly hack it so that you create a shortcode (similar to Wordpress) and then in the theme, split the content either side of the shortcode, insert the metafield and then put it all back together again.

    • @kaigeertsma6139
      @kaigeertsma6139 2 года назад

      @@CodewithChristheFreelancer Thanks for your reply. I'll just hope that shopify will release this feature.

  • @ohed4597
    @ohed4597 2 года назад

    Can I add metafield from liquid file for customer while creating registration form?

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      Metafield's aren't form fields that can take user input from your store customers. Metafields can be only be modified on the admin side.

    • @ohed4597
      @ohed4597 2 года назад

      @@CodewithChristheFreelancer thanks for ur reply, will it be possible anyway to update it from storefront API for customer so that we can use it from user profile?

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      The Storefront API doesn't create any data. It only returns data. Except in the case of the customer object. That is the only part of the API that accepts input.

    • @ohed4597
      @ohed4597 2 года назад

      @@CodewithChristheFreelancer Thanks, so basically i want to send a json data to customer metafield while creating from page level, either create new user or purchasing order. So that I can show those data later to user profile from the metafield. I tried to use graphql which is working from graphql app but I am looking for some ajax api or something to achieve this. Please let me know if there is any way..

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      You probably need to build an app or API that leverages the Admin API in order to do that.

  • @254numbers21
    @254numbers21 3 года назад

    Hi Chris. Is it possible to do a mass upload to metafields? I have an excel spreadsheet with a ton of information that I'll be putting into the new Shopify metafields and I'm hoping there is a way I can do a mass upload. I've already created the metafields (approx 35 of them for about 200 products). Can't seem to find any documentation on whether this is possible or not. If not I'll have a ton of data entry to do...

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      Hi Jonathon. I'm not sure either but it should be possible with an app.

    • @clementvaisques
      @clementvaisques 2 года назад

      I'm facing the same issue. Did you find a way to import it in csv ?

    • @254numbers21
      @254numbers21 2 года назад +1

      @@clementvaisques no. Unfortunately the new online store 2.0 doesn’t allow for mass editing of metafields in the bulk editor or via csv file.

    • @clementvaisques
      @clementvaisques 2 года назад

      @@254numbers21 hey ! Thanks for the quick reply.
      I’m currently trying to use the import/export tool made by MetaGuru.
      Not so easy but I’m getting closer and closer 👌

  • @westcoastdoglover
    @westcoastdoglover 3 года назад

    Is it possible to add two or more image metafields? So far I can't figure out how to do this, but I'm also not a developer.

    • @westcoastdoglover
      @westcoastdoglover 3 года назад

      Also, so glad I found your videos. Even though I'm not a coder, I'm finding them VERY helpful!

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      hmm I haven't tried it but I would assume so. Is the 'image' option missing when you go to create the second metafield definition?

  • @talfrei
    @talfrei 2 года назад

    How do you render a metafield that has a Page as reference?

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      There's a liquid filter for that. See here: shopify.dev/api/liquid/filters/metafield-filters

  • @nissanm77
    @nissanm77 3 года назад

    can i upload bulk products cvs with metafields?

  • @trime33
    @trime33 3 года назад

    awsome video dude, loved it.
    Im using a new custom theme so I dont have the Product.json files :(

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад +1

      haha no need for the sad face. It's easy to migrate. I'll be releasing a tutorial on how to do so shortly. Stay tuned!

  • @chrstphrcr
    @chrstphrcr 3 года назад

    Newb here, is it possible to add an image to a collapsible tab using metafields?

  • @giant_joe
    @giant_joe 2 года назад

    This doesnt work on some older themes. I use Minimal theme and although you can input all the info in the Shopify CMS, Metafields don't appear on the Default Product Page. I guess this is becasue the older themes like Minimal are .liquid files and Metafields require .json themes.

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      You wrote that you "can input all the info in the Shopify CMS" so there is no error here. You just need to code your metafields into that theme if you want their values to be displayed. Themes don't automatically read metafields. You need to utilise them using Liquid.

    • @giant_joe
      @giant_joe 2 года назад

      @@CodewithChristheFreelancer OK, thank you for the guidance. I will have to research that step and I hope it isn’t too tricky. I’m no liquid code expert! lol

  • @sushilyadav-dm5rr
    @sushilyadav-dm5rr 3 года назад

    Can you please tell me
    How to use cart api in shopify

  • @thisquietplace
    @thisquietplace 3 года назад

    Hoping Shopify will add an option to change the order of the metafields, any new field end up on the top of the list, kind of annoying if you're trying to keep the product page presentable for a client. Also hoping that they will add a dynamic table to the field types

  • @gaurangamin6827
    @gaurangamin6827 3 года назад

    How do I add Rich Text Editor to metafeilds

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      'Rich Text' does not appear to be one of the available metafield content types.

    • @gaurangamin6827
      @gaurangamin6827 3 года назад

      @@CodewithChristheFreelancer so please can you advise solution as I have description, key feature and specification tab and I want to add WYSIWYG or rich text content

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      How about using HTML? You can insert HTML into a plain text field.

    • @gaurangamin6827
      @gaurangamin6827 3 года назад

      @@CodewithChristheFreelancer yes that work but the who does data entry on our website they do not know HTML
      I am surprised Shopify has this basic limitation!

  • @alex-suciu
    @alex-suciu 2 года назад

    great video!
    such a shame, that after 6 months the rest of the metafields are still on "coming soon" status quo. you still have to rely on apps for those metafields.

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  2 года назад

      Depends. I don't use any apps for metafields. Check out my other video on metafields for an alternative way of doing it (no app required)

    • @alex-suciu
      @alex-suciu 2 года назад

      @@CodewithChristheFreelancer that was actually quite helpful, although for the final client I still found it easier for him to manage his metafields using an app.
      btw, looks like the rest of the metafields ( collections, customers, orders ) seems to be now available.

  • @dylantucker7951
    @dylantucker7951 3 года назад

    Cheers. One big thing for me is there seems to be no way to include the meta field in the bulk editor or product importing or exporting. Am I missing something or is that a huge oversight from Shopify?

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      Think it might be an oversight by Shopify as another viewer (Taylor) has noticed the same thing.

    • @threeworlds
      @threeworlds 2 года назад

      just came across bulk editing meta fields in a vid ruclips.net/video/n-JnSDrDt-4/видео.html

  • @TJ-TJ
    @TJ-TJ 3 года назад

    They still haven't rolled out metafield display on variants :-(

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      Oh really? I can see 'Variants' in the list of possible metafields in my metafield settings

    • @TJ-TJ
      @TJ-TJ 3 года назад +1

      @@CodewithChristheFreelancer they are there in the backend. But then take it to the next step: displaying the variant data (value) in the theme editor data connector.
      Or am I missing something??

    • @Sebastian089M
      @Sebastian089M 3 года назад

      @@TJ-TJ same problem here. I can add a product metafield easily. If I create a variant metafield it will not show up when I want to add it.

  • @Mr-Flo
    @Mr-Flo 3 года назад +1

    Stupid Q, what are now the benefits?
    Or you can add a picture , could be done earlier as well.
    Why doing new brands? Just type in in Vendor.
    Additional text / specific page, also old.
    🤷‍♂️ don’t get the excitement

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад +1

      The ‘brand’ field was just a proof of concept. The ‘big deal’ is that we can now add and edit Metafields in the admin.

  • @prassistant4286
    @prassistant4286 3 года назад

    Hi, what email can I send you a business offer?

  • @elTioPepe
    @elTioPepe 3 года назад

    Can't really see the benefits for non devs users.

    • @CodewithChristheFreelancer
      @CodewithChristheFreelancer  3 года назад

      Admins can now set up a metafield in their store settings, update the metafield in the admin via the edit product page and then dynamically link the field in the customiser. No dev required.

  • @prakashpatel5397
    @prakashpatel5397 Год назад

    actually 20 metafield add. sir

  • @STPG568
    @STPG568 3 года назад

    yOU HAD ME AT UNTIL YOU CALLED THOSE SHOES NIKE WHICH THEY ARE NOT

  • @chenjoey7142
    @chenjoey7142 2 года назад

    OMG, Post Malone?

  • @apollomarconi
    @apollomarconi 2 года назад

    Thanks for showing how pathetic Shopify still is. What a disappointment. All this coding looks laborious and not exactly 2.0 as promised. I'm just changing themes to Dawn (had a vintage Debut until now) so I can use a newer generation of APO [advanced product options] & now I see Shopify is still leaving us in the weeds if we want something remotely outside of the envelope.

  • @dawns9364
    @dawns9364 Год назад

    You go way too fast lol. Im having the hardest time finding a video that goes slower and more detailed

  • @fibsniper786
    @fibsniper786 2 года назад

    you lost me at ''add-i-dass''