How to add custom fields to WooCommerce products quickly and easily

[Music] hi in this video we'll be looking at how to add custom fields to woocommerce products we'll look at two types of custom fields first extra data fields these are fields that present extra information to the user about your products second custom add-on fields these allow the user to enter extra information in order to customize the product we'll also cover how to add fields to multiple products in one easy hit and we'll look at how to display fields conditionally based on the values of other fields so let's start by looking at adding custom data fields that present extra information this extra information could be all kinds of stuff technical specs nutritional info for food products extra notes about pricing shipping or lead times whatever you need for your particular products let's look at this demo product for an example of custom product data fields the product is for a computer and we've got some custom fields here that provide the user with technical details you can see that the data is laid out neatly in a nice table there are some optional images for each row of information so now let's look at the easiest way to add custom data fields like this to woocommerce you'll need the woocommerce product add-ons ultimate plugin which is available from pluginrepublic.com now let's look at how to add our field make sure that you've installed and activated add-ons ultimate first then go to the product where you'd like to add your extra data fields click on the product add-ons tab then click add group then add field you can give your group and field a label if you wish you can see that there are multiple different field types that we could be using but because we're just adding an information field we'll choose the information field type you'll see then that you have the option to add row click this to create your first row enter a label and some further data you can enter as much as you want in this field carry on entering as many rows as you like [Music] if you want you can upload an image next to each row but that's optional when you've finished adding your information click update then take a look on the front end you can see the new fields added here and that's how you quickly and easily add extra data fields to your woocommerce products okay that was pretty simple let's now look at how we can add extra data fields to more than one product at a time in our dashboard go to product add-ons global add-ons then click add new global group select from one of these options either to add your extra fields to all products or to specific products or to products in specific categories then you can set your fields up exactly the same as in the previous example this field will now display on all the products you've selected what about if you want to display different information based on selections that the user has made this could be different information based on which variation the user has selected or in this product we've added different types of custom fields using the add-ons ultimate plug-in the user can build their own product and depending on the selections they make we show them different information let's look at how to achieve both these first maybe we want to show the user different information fields depending on the variation selected here we want to show the user different measurements for clothes based on the size selected so you can see we've got our product set up with variations we've also got our custom information fields created [Music] note that there's a different field for each variation to ensure that a field only displays when a variation is selected we simply use the variations field here just enter the variation that should activate this field that's all you need to do now let's look at a slightly different example this product lets a user build their own serial it uses different types of custom field like radio buttons and image swatches in order to allow the user to personalize the product to their own tastes we want to display different nutritional information to the user based on their selections when the user clicks cheerios we show the data for cheerios when the user selects choco balls we show that data and so on if we look at how this product is set up all the custom fields have been added you can see that we've got our custom field for serial base it's actually very similar to the information field with several rows representing different options then below that we've got an information field for each of the options in the image swatch field above and if you see here each information field has a condition set this means that each field will only display if its conditions are met so in this example we'll show this field if the cheerios option is selected in the serial field and we can add multiple conditions if we want so that's how you can add custom data fields to your woocommerce products [Music] now let's look at how to add another type of custom field to woocommerce add-on fields that allow the customer to enter their own information add-on fields can be simple like text fields drop-downs or check boxes or they can be more complex like upload fields they give your customers the ability to personalize your products as an example take a look at this product which allows the user to enter a name to be engraved on an item of jewelry you can't achieve this with standard woocommerce functionality so you'll need the woocommerce product add-ons ultimate plugin let's start by going to our example product in the back end you can see that it's just a standard woocommerce product with price image description etc to add our custom field we'll go to the product add-ons tab here in the product data section click add group then click add field in the field type setting you can see all the different field types available for now we'll select text [Music] then we'll enter a label for our field and that's actually all we need to do to create a simple custom field let's take a look at it on the front end you can see the new text field here now it might be that you want to set some additional parameters for your field let's go back to the edit screen for our demo product let's say that we want to charge an additional cost if the custom field is completed by the user so we can simply add a price here to the field price that means that when the user enters some text in the field this price will be added to the base product price and we can do even more than that maybe you want to charge a percentage of the product price instead of a fixed value if so just check the percentage field this now means that the field price will be one percent of the product price well what about if you only want to charge the extra cost once and not for every item that the customer orders you can just check flat rate here and because this is a text field we've got some special fields for text and pricing for instance we can set a minimum and or maximum number of characters allowed in the field we can also opt to charge per character so if we select price per character then this price will be multiplied by the number of characters entered even more we can allow a certain number of free characters so let's allow the user five free characters before we start charging we can also choose to allow only alphanumeric characters which means that we only accept letters and numbers finally we could also select to only charge for alphanumeric characters so non-alphanumeric characters like spaces are allowed but are free so you can see there are lots of options around pricing now let's have a look at some of the other options for our custom fields what about if you want to ensure that the user completes the field all you need to do is select required field then if the customer forgets to enter something in the field they'll get a notification you can also choose to set a default value for the field if you wish and finally you can set an image to accompany the field plus some additional description to help the customer understand what they need to do for now let's use the following settings we'll charge the user one pound or euro or dollar whatever your site currency is for each character they enter but we'll give them five free characters and only charge for alphanumeric characters we'll also add in some extra description let's update the product and take a look on the front end you can see that if we enter some text into the field the price will start to increase as we go past our free characters only alphanumerics are charged for when you insert your text and add the product to the cart you can see that the custom field data is captured in the cart and this is retained throughout the checkout process so you'll get this data in your order screen and notification email hopefully this gives you an idea of what you can do with custom fields and how simple they are to set up now let's take a look at some other examples using different field types here's a simple checkbox clicking the check box enables another field this is possible using conditional logic in this example an extended version of the product we worked on the customer can select one or more items from a swatch of images each item they select can add to the overall price here customers can build their own pizzas choosing from a number of different options and entering quantities for certain items similarly here the customer can build up bundles of product selecting different quantities of different products to make a composite product this product actually uses other products as custom fields a common type of custom field is an upload field in this product the user can upload one or more images again you can charge for each image if you wish finally these examples show different ways you can calculate the final product price based on the options selected by the customer this product allows a user to enter measurements in this case the dimensions of their room then the plugin calculates the number of rolls of wallpaper they'll need they can also choose some extra options for their order hopefully this gives you some good ideas around using custom fields for your woocommerce products check out the resources section on pluginrepublic.com where you'll find dozens of tutorials on adding custom fields to your products and of course don't forget that you'll need a copy of woocommerce product add-ons ultimate thanks for watching and don't forget to hit the like button and to subscribe to the channel for more helpful videos on woocommerce [Music]

Channel: Plugin Republic

Views: 15,418

Keywords: WooCommerce, Custom Fields, add-ons, ACF, product fields, data fields, WooCommerce product page, WooCommerce custom fields, WooCommerce data fields, WooCommerce product add-ons, WooCommerce product options, Extra product options

Id: NKf6Pnsliu8

Length: 12min 14sec (734 seconds)

Published: Fri Jan 15 2021