Overrides the frontend.php file of core BB modules with custom plugin

Overrides frontend.php file of Core BB Modules

You created a custom plugin and wanting to edit the frontend.php file of core BB module from there. In this tutorial I am introducing it.

Assuming that you are wanting to edit the frontend.php file of Heading module. Then follow my instruction at below:

Filter the Module Template Slug

At first I am filtering the module template slug. Core BB plugin have a filter ‘fl_builder_module_template_slug’. With it I am replacing the Heading module slug. Add the following PHP snippet in your plugin’s file.

Filter Module Template Slug

add_filter( 'fl_builder_module_template_slug', function( $empty, $module ) {
	if( $module->slug == 'heading' )
		return $module->slug;

	return $empty;
}, 1009, 2 );

If you will edit another module like HTML then above code will be like this

add_filter( 'fl_builder_module_template_slug', function( $empty, $module ) {
	if( $module->slug == 'heading' )
		return $module->slug;
	
	if( $module->slug == 'html' )
		return $module->slug;

	return $empty;
}, 1009, 2 );

Replacing the Template Path

Frontend.php file of Heading module is calling from BB plugin’s folder. I am replacing this path with custom path. I choose fl_builder_template_path hook and replacing the template path of Heading module only (template path of rest of the modules will be unchanged). Add the following PHP snippet in your plugin’s file.

Replacing the Template Path

add_action( 'fl_builder_template_path', 'probb_module_template_path', 20, 3 );
function probb_module_template_path( $template_path, $template_base, $slug )
{
	$modules = array( 'heading', 'html' ); // modules slug
	if( in_array( $slug, $modules ) )
	{
		$template_path = 'YOUR PLUGIN PATH/modules/' . $slug . '/frontend.php';
	}

	return $template_path;
}

Creating own Frontend.php file

Creating the new frontend.php file of Heading  module with following PHP snippet and saving it in customplugin/modules/heading folder.

frontend.php file

>

Now copy the full code of frontend.php file of Heading module from core BB plugin and paste at line number 6 (above code). Later you will edit the code as per your requirement.

So newly frontend.php file of my Heading module is looking like this:

Modified frontend.php file of my heading module


Now you will activate your custom plugin and edit your page/post with Beaver Page Builder. Drag&Drop the Heading module and it will load the frontend.php file from your plugin’s folder.

Posted in