Skip to content

BF WP Forms

Form builder screenshot
Form builder screenshot

Features

  • Wordpress Block Editor based form builder that integrates with the Brown-Forman APIs
  • Age Gate
  • Reuseable legal footer

Installation

Plugin can be downloaded from this URL and installed manually

https://wp-plugins.b-fonline.com/bf-wp-forms/bf-wp-forms.latest-stable.zip
Or install via WP-CLI
wp plugin install --force https://wp-plugins.b-fonline.com/bf-wp-forms/bf-wp-forms.latest-stable.zip

Integration

Dealing With Classic Editor Sites

If the site is using the Classic Editor (or worse, a 3rd party page builder), I've found the best way to integrate the forms is via a shortcode. The Reusable Blocks Extended plugin allows us to create a reusable block containing a form, which can then be embedded into a page via shortcode.

Enable Age Gate Functionality

This is enabled via a constant that is set in wp-config.php. I wrote it this way so that sites that have a legacy age gate plugin already integrated won't end up with this feature getting accidentally activated.

1
2
3
4
5
6
7
<?php
// wp-config.php

/**
 * Add Local site configs here (e.g. Google Maps API Key)
 */
define('BFWPF_ENABLE_AGE_GATE', true);

Styles

By placing the following directory structure in the root of your theme the plugin will load extra.css if a plugin component is being rendered.

1
2
3
bf-wp-forms
`-- css
    `-- extra.css

Block Templates

If absolutely necessary, you can override a form element block template. Copy the template from the plugin into the following directory structure in the root of your theme.

Warning

We do not recommend doing this. Doing everything via CSS is best.

bf-wp-forms
`-- templates
    `-- blocks
        |-- birthdate-input.php
        |-- checkbox-input.php
        |-- contact-form-container.php
        |-- country-input.php
        |-- crm-form-container.php
        |-- select-element.php
        |-- state-input.php
        |-- submit-input.php
        |-- text-input.php
        |-- unsubscribe-form-container.php
        `-- xola-button.php

Age Gate Hooks

The age gate template bf-wp-forms/templates/age-gate/age-gate.php features several hooks that can allow you to inject HTML into it.

  • bfwpf_age_gate_before
  • bfwpf_age_gate_main_before
  • bfwpf_age_gate_main_after
  • bfwpf_age_gate_after

Example With Template

<?php
// Theme functions.php
function my_agegate_heading(){
  ob_start();
  include get_template_directory(). '/bf-wp-forms/templates/bfwpf_age_gate_main_before.php';
  $file = ob_get_contents();
  ob_end_clean();
  echo $file;
}

add_action('bfwpf_age_gate_main_before', 'my_agegate_heading');
1
2
3
4
5
<?php
// <your_theme>/bf-wp-forms/templates/bfwpf_age_gate_main_before.php
<div class="my-age-gate-heading">
    <img src="img/super-cool-logo.png" alt="My Super Cool Logo">
</div>

Example Without Template

1
2
3
4
5
6
7
<?
// Theme functions.php
function my_agegate_heading(){
    echo '<h1 class="my-agegate-heading">Hello World!</h1>';
}

add_action('bfwpf_age_gate_main_before', 'my_agegate_heading');

Short Codes

There are a few shortcodes that allow some templates to be rendered in various places.

  • [bfwpf_legal_footer]
    • Outputs the templated legal footer
  • [bfwpf_year]
    • Simply renders the current year. This is used in the copyright field of the footer.
  • [bfwpf_list_sites]
    • MULTISITE AGE GATE ONLY: Lists all sites as links to the root of every site
  • [bfwpf_list_other_sites]
    • MULTISITE AGE GATE ONLY: Lists all sites other than the current as links to the root of every site