Updated and tested with WooCommerce 4.9.2 and Product Vendors 2.1.47.
With Product Vendors 2.0 being released a while ago, the developers added many new features, including the vendor registration form which you requested so many times.
By using the shortcode [wcpv_registration] in a page, the user will see a form to register an account and a vendor account, if not logged in, or only the fields to register the vendor account if they are already logged in.
The form anyway, could not be enough for someone. You may want to add more fields to the vendor, like their social profiles. Like always, there’s a way, with some custom code, to do it.
The example code adds two new fields to the Vendor taxonomy and the registration form to allow vendors to specify their Facebook and Twitter URLs.
Open your functions.php file in wp-content/themes/your-child-theme-name/ and add this code at the end of the file:
| /** | |
| * Register term fields | |
| */ | |
| add_action( 'init', 'register_vendor_custom_fields' ); | |
| function register_vendor_custom_fields() { | |
| add_action( WC_PRODUCT_VENDORS_TAXONOMY . '_add_form_fields', 'add_vendor_custom_fields' ); | |
| add_action( WC_PRODUCT_VENDORS_TAXONOMY . '_edit_form_fields', 'edit_vendor_custom_fields', 10 ); | |
| add_action( 'edited_' . WC_PRODUCT_VENDORS_TAXONOMY, 'save_vendor_custom_fields' ); | |
| add_action( 'created_' . WC_PRODUCT_VENDORS_TAXONOMY, 'save_vendor_custom_fields' ); | |
| } | |
| /** | |
| * Add term fields form | |
| */ | |
| function add_vendor_custom_fields() { | |
| wp_nonce_field( basename( __FILE__ ), 'vendor_custom_fields_nonce' ); | |
| ?> | |
| <div class="form-field"> | |
| <label for="facebook"><?php _e( 'Facebook', 'domain' ); ?></label> | |
| <input type="url" name="facebook" id="facebook" value="" /> | |
| </div> | |
| <div class="form-field"> | |
| <label for="twitter"><?php _e( 'Twitter', 'domain' ); ?></label> | |
| <input type="url" name="twitter" id="twitter" value="" /> | |
| </div> | |
| <?php | |
| } | |
| /** | |
| * Edit term fields form | |
| */ | |
| function edit_vendor_custom_fields( $term ) { | |
| wp_nonce_field( basename( __FILE__ ), 'vendor_custom_fields_nonce' ); | |
| ?> | |
| <tr class="form-field"> | |
| <th scope="row" valign="top"><label for="facebook"><?php _e( 'Facebook', 'domain' ); ?></label></th> | |
| <td> | |
| <input type="url" name="facebook" id="facebook" value="<?php echo esc_url( get_term_meta( $term->term_id, 'facebook', true ) ); ?>" /> | |
| </td> | |
| </tr> | |
| <tr class="form-field"> | |
| <th scope="row" valign="top"><label for="twitter"><?php _e( 'Twitter', 'domain' ); ?></label></th> | |
| <td> | |
| <input type="url" name="twitter" id="twitter" value="<?php echo esc_url( get_term_meta( $term->term_id, 'twitter', true ) ); ?>" /> | |
| </td> | |
| </tr> | |
| <?php | |
| } | |
| /** | |
| * Save term fields | |
| */ | |
| function save_vendor_custom_fields( $term_id ) { | |
| if ( ! wp_verify_nonce( $_POST['vendor_custom_fields_nonce'], basename( __FILE__ ) ) ) { | |
| return; | |
| } | |
| $old_fb = get_term_meta( $term_id, 'facebook', true ); | |
| $old_twitter = get_term_meta( $term_id, 'twitter', true ); | |
| $new_fb = esc_url( $_POST['facebook'] ); | |
| $new_twitter = esc_url( $_POST['twitter'] ); | |
| if ( ! empty( $old_fb ) && $new_fb === '' ) { | |
| delete_term_meta( $term_id, 'facebook' ); | |
| } else if ( $old_fb !== $new_fb ) { | |
| update_term_meta( $term_id, 'facebook', $new_fb, $old_fb ); | |
| } | |
| if ( ! empty( $old_twitter ) && $new_twitter === '' ) { | |
| delete_term_meta( $term_id, 'twitter' ); | |
| } else if ( $old_twitter !== $new_twitter ) { | |
| update_term_meta( $term_id, 'twitter', $new_twitter, $old_twitter ); | |
| } | |
| } | |
| add_action( 'wcpv_registration_form', 'vendors_reg_custom_fields' ); | |
| function vendors_reg_custom_fields() { | |
| ?> | |
| <p class="form-row form-row-first"> | |
| <label for="wcpv-facebook"><?php esc_html_e( 'Facebook', 'domain' ); ?></label> | |
| <input type="text" class="input-text" name="facebook" id="wcpv-facebook" value="<?php if ( ! empty( $_POST['facebook'] ) ) echo esc_attr( trim( $_POST['facebook'] ) ); ?>" /> | |
| </p> | |
| <p class="form-row form-row-last"> | |
| <label for="wcpv-twitter"><?php esc_html_e( 'Twitter', 'woocommerce-product-vendors' ); ?></label> | |
| <input type="text" class="input-text" name="twitter" id="wcpv-twitter" value="<?php if ( ! empty( $_POST['twitter'] ) ) echo esc_attr( trim( $_POST['twitter'] ) ); ?>" /> | |
| </p> | |
| <?php | |
| } | |
| add_filter( 'wcpv_shortcode_registration_form_validation_errors', 'vendors_reg_custom_fields_validation', 10, 2 ); | |
| function vendors_reg_custom_fields_validation( $errors, $form_items ) { | |
| if ( filter_var( $form_items['facebook'], FILTER_VALIDATE_URL ) === false ) { | |
| $errors['facebook'] = __( 'Facebook field format is not correct. Please enter your Facebook page URL.', 'domain' ); | |
| } | |
| if ( filter_var( $form_items['twitter'], FILTER_VALIDATE_URL ) === false ) { | |
| $errors['twitter'] = __( 'Twitter field format is not correct. Please enter your Twitter profile URL.', 'domain' ); | |
| } | |
| return $errors; | |
| } | |
| add_action( 'wcpv_shortcode_registration_form_process', 'vendors_reg_custom_fields_save', 10, 2 ); | |
| function vendors_reg_custom_fields_save( $args, $items ) { | |
| $term = get_term_by( 'name', $items['vendor_name'], WC_PRODUCT_VENDORS_TAXONOMY ); | |
| if ( isset( $items['facebook'] ) && ! empty( $items['facebook'] ) ) { | |
| $fb = esc_url( $items['facebook'] ); | |
| update_term_meta( $term->term_id, 'facebook', $fb ); | |
| } | |
| if ( isset( $items['twitter'] ) && ! empty( $items['twitter'] ) ) { | |
| $twitter = esc_url( $items['twitter'] ); | |
| update_term_meta( $term->term_id, 'twitter', $twitter ); | |
| } | |
| } |
Let’s break it down to understand what it does.
From line 1 to line 50, the code adds the two new fields to the taxonomy. This way, when as an admin you want to manually create or edit a vendor, you can specify their FB and Twitter URLs in the Dashboard.
From line 51 to 76 it validates and saves the fields in the Dashboard, so until now, the code is all to manage the fields in the backend, for administrators.
From line 78 to line 105, it adds the same field to the registration form that you can show on a page by using the shortcode [wcpv_registration]. The fields will appear after the Vendor Description fields, which is a default field shown at the end of the form, before the Submit button.
The last part of the code, from line 107 to the end, saves the fields in the vendor taxonomy.
This is just a simple example with two text fields, as you can imagine you can add any kind of fields, and as many as you want.
One thing that I didn’t mention in the article is how to validate custom fields. I didn’t validate them here because it was not required, but by using the hook wcpv_shortcode_registration_form_validation you can validate the fields before the vendor is created. In example, if you want mandatory fields, you can check if they are empty, and eventually stop the registration and return an error message to the user.
The hook wcpv_shortcode_registration_form_validation accepts two parameters, the first is an array of error messages, the second is an array with all the form fields submitted by the user.
Make a one-time donation
Make a monthly donation
Make a yearly donation
Choose an amount
Or enter a custom amount
Your contribution is appreciated.
Your contribution is appreciated.
Your contribution is appreciated.
DonateDonate monthlyDonate yearly
Leave a Reply