Enabling Field Connection Option To The Id & Class Fields

How do you add field connection option to the Id and class fields under Advanced tab of any settings forms (module, row and column)? I am sharing the small PHP snippet which will enable the connection option. So you can put the custom field key there and control the value from the post,page,cpts add/edit screen or theme options page.

Minimum Requirements

• Beaver Builder Plugin
• Beaver Themer Add-on

Open the functions.php file of your active theme and add this PHP code at end of the file

/**
 * Adding connection field to the ID & Class fields
 */
add_filter( 'fl_builder_register_settings_form', 'paulc_filter_settings_from', 1052, 2 );
function paulc_filter_settings_from( $form, $slug )
{
	if( $slug === "module_advanced" )
	{
		$form['sections']['css_selectors']['fields']['id']['connections'] = [ 'custom' ];
		$form['sections']['css_selectors']['fields']['class']['connections'] = [ 'custom' ];
	}

	if( $slug === "row" || $slug === "col" )
	{
		$form['tabs']['advanced']['sections']['css_selectors']['fields']['id']['connections'] = [ 'custom' ];
		$form['tabs']['advanced']['sections']['css_selectors']['fields']['class']['connections'] = [ 'custom' ];
	}

	return $form;
}

Now you will get a “plus” icon button at right side of Id & Class fields under Advanced tab. You will map the field with your custom field key.