Do you want to allow peoples to add their products to your eCommerce website without giving access them to site backend. Adding and managing WooCommerce products from frontend is indeed a very good idea. Frontend posting and editing of products is a more user friendly idea when it comes to your product editing staff with a mere knowledge of WordPress backend.
In other words, WordPress backend is not all about WooCommerce. If one of your editor doesn’t have enough experience with WordPress, they might get their mind messed up with scattered options in backend panel. So, to make thing easier, better to set up a frontend posting editing system for their staff dedicated to product editing.
In this tutorial, I will tell you how to post WooCommerce Products this with the help of Formidable Pro plugin and CRED plugin
Setting up WooCommerce frontend posting with the help of Formidable Pro
- Web Hosting
- Self Hosted WordPress
- Formidable Pro
After installing and activating both WooCommerce and Formidable Pro;
- Go to Formidable Pro > Forms > Add New form
- Add a form with following fields;
- Product Title (text field)
- Product Description (Rich text field)
- Product Tags (tag field)
- Product Category (a dropdown field)
- Product Price (text field)
- Featured Image (file upload field – specify file types JPG, PNG or any other picture format)
- On creating the form, you need to customize form settings
- Go to form settings > Actions > Add New action > Create Post
See the post settings carefully in the image given below
You can map many WooCommerce custom fields to the product form fields and this will gather the submitted data to the attached custom field such as price, featured image, regular price, sale price etc. You can also asign created post status to “draft”, “published” or even “pending review”.
Some important WooCommerce-Product-related custom fields
|Custom field||Value for form field|
|_stock_status||in stock, out of stock|
|_price||(use numeric field)|
|_stock||(use numeric field)|
|_sale_price_dates_from||(use date field)|
|_sale_price_dates_to||(use date field)|
Setting up WooCommerce frontend posting using CRED plugin
- Web Hosting
- Self Hosted WordPress
With CRED, you need not to find out product related custom fields
CRED is another incredible plugin that lets you create WordPress posts and custom post types. Even you can find and map custom fields from any other plugin developed by somebody else and gather data for that custom field.
Here is how CRED work
- Install and activate CRED plugin
- If you want to generate a WooCommerce product form automatically, then go to CRED > New Post Form > Created content
- Choose Post Type > Product
- Set status whatever you like
- Go to WordPress admin menu > CRED > Custom fields
- Choose “Product” from dropdown, select option “show hidden fields”. It will display all WooCommerce Product
- On Edit CRED Form page, click on the “Auto Generate Form” button. It will generate shortcodes automatically and you can insert and modify added code as desired.
- Save the created form and then Go to WordPress pages > Add New page. Here insert created form using the “CRED Form” button placed just above the text editor
- Auto generated product form will add following fields (as shown in the given image);
If you are looking forward to map custom fields manually and want more data to get submitted via frontend, then see the video to learn how to map custom fields to form fields
You can map available custom field to appropriate type of form field type. For example map _price custom field to a numeric form field and so on.
I hope this post will have given you the basic idea to setup not only WooCommerce product frontend posting but also you can get it working for any post type.
Next thing is editing products on frontend. I have written a detailed post on it. You can access it here