Select2 for Profile Builder

Razvan Mocanu

Last Updated: 21/11/16

Table of Contents

1 Selecting the new field
2 Setting up the options
3 Multiple Select
4 What users see
5 Advanced customization using code
6 Ready to use

Profile Builder has a new add-on, called Select2, and it brings out to play a new type of field. This add-on enables you to add an improved select box, with search and filter capabilities.

Selecting the new field

After installing this plugin, you will find that 2 new types of fields has been added to the fields list in the Manage Fields tab: Select2 and Select2 (Multiple).

Setting up the options

There aren’t any special steps compared to a regular Select field. According to your needs, you can choose a field title, a description, the options you want your user to select and even a default selection.

Multiple Select

Let’s add a new Select2 (Multiple) field. You’ll notice that you can now add multiple default options and also have a new settings: Maximum selections and User Inputted options.

*NOTE: When WooCommerce plugin is activated, user inputted options are not visible in WordPress Default Edit Profile. On Profile Builder forms, user inputted options work as expected.

What users see

You can see the fields we just created, in action on this register form.

When users start typing in the select box, the list is filtered automatically.

Now, let’s add a new option in the “Topics of interest” field.

You can see the warning message when I try to enter a fourth option.

Advanced customization using code

If you have a large set of data or want to load it from local or external database you can use the filters for single select:

wppb_select2_options
wppb_select2_labels

and for multiple select:

wppb_select2_multiple_options
wppb_select2_multiple_labels

Here is an example:

/* Load select data using custom code */
add_filter('wppb_select2_options', 'wppbc_data_for_select2', 10, 6);
function wppbc_data_for_select2( $select2_data, $form_location, $field, $user_id, $field_check_errors, $request_data ) {
    $select2_data="Red, Green, Blue, Yellow"; // add your own data as comma separated values
    return $select2_data;
}

Select2 add-on is implemented using an open-source library. So far, Profile Builder’s user interface lets you use some of its features, but you can implement more features such as templating. The PHP code you need to create for further customization should be hooked to one of the available filters:

wppb_select2_arguments
wppb_select2_multiple_arguments

Here is a link to some examples of what can be done using Select2 library.

Ready to use

At this point, the field is set up and ready to be used. Get the add-on now by following the link below.

Get Profile Builder Select2 Add-On

From the blog

WordPress User Registration

Author: Cristian Antohe

Last Updated: February 24th, 2020

Have you hit a road block when it comes to WordPress user registration? You probably would like to have new users register before being able to take certain actions (for example, posting reviews or commenting) but do not want them to have access to the WordPress Dashboard? Truth is, WordPress User Registration doesn't have to […]

How to Create WordPress Redirects to Another Page, External URLs, or a Subdomain

Author: Rishi Lodha

Last Updated: June 6th, 2024

There are different reasons WordPress site owners want to create WordPress redirects to another page, external URL, or a subdomain. The redirect can be based on an important user action or set up to redirect all users landing on a particular page. Whatever the type or need of your redirect, WordPress offers the flexibility to […]

How To Create a bbPress Private Forum and Restrict it Based on Membership Subscription

Author: Patricia Borlovan

Last Updated: September 13th, 2021

In order to build a successful paid membership community with a discussion area, you may want to create a bbPress private forum and restrict access to some content areas, based on subscription plan. If you use both Paid Member Subscriptions and Profile Builder Pro, you have to know that bbPress is fully integrated with both […]

15 thoughts on “Select2 for Profile Builder”

Do we need a separate database application for it or is it enough?

Hi Todd,

This is a WordPress plugin that adds extra functionality to the Profile Builder plugin for WordPress. So no, you simply need a normal WordPress installation with Profile Builder plugin also installed.

I have downloaded and activated the ‘profile builder’ plugin and I am not able to get any of the shortcodes to work. I am using the latest WordPress and my theme is Tesseract.
I really would appreciate it if anyone can help me.
Belinda

Hi Belinda,
I have tested Profile Builder with a standard Tesseract theme and everything seems to work properly.
Please provide us more details so we can try to solve your issue by opening a support ticket at http://www.cozmoslabs.com/support/ .

Did you ever wanted to have some admin only fields attached to your user profiles?

Hi Ted,
You can do that using another add-on of Profile Builder called Field Visibility: http://www.cozmoslabs.com/add-ons/field-visibility/ .

Is there any way to allow users to input their location without manually adding it to the list of options? I am trying to develop a facet to my site where users are shown to other users in terms of distance from each other, so having that location option and having it be functional instead of simply for show is very very important.

Hi Ellis,
Such a localization field is not available at the moment with Profile Builder.

How can I default the CSS to the WPPB CSS, i cannot get the select box to line up with the label, it drops below whereas all the other fields in the PB line up and use my default theme….Sorry if this question is basic as I have limited programming skills.

Hi Kirt,
The way a page looks is the result of processing inline styling and multiple CSS files, including the CSS from Select2, Profile Builder and your active theme’s stylesheet.
In order to help you align the Select2 field, you will have to provide me with a link to your page.
As this is very specific to your case, it would be great if we could continue this conversation in a support ticket.

Hello, i am trying to use select2 to allow users to tag themselves with their interests so others could use a search function to find them, so far i havent had any luck. is this possible?

Hello,
Yes, it’s possible for users to select interests in a custom field of type select.
The field will be searchable in the User listing.
We are currently working on more advanced searching and filtering in User Listing.
You can tell me exactly what issues are you having with it, so I can help you further, by submitting a support ticket.

how to use the value of select2 field ??

Hello,
If you are trying to retrieve the value submitted by a particular user you can use get_user_meta PHP function. Use the meta_key configured in Profile Builder->Manage fields.

If this is not what you need, please submit a support ticket with more details on what you are trying to achieve.

I have Created Select2 & populate Custom Taxonomy through add filter.. but when i’m Creating Another Select2 Control it shows same data..