Contact Form 7 Integration

Control Contact Form 7 script loading and display to optimize performance and user experience.

Configuration Options

Configure Contact Form 7 integration in your config.yml file:

1
cf7:
2
blocks: false # Blocks where CF7 is showing
3
archives: false # Archives where CF7 is showing
4
taxonomies: false # Taxonomies where CF7 is showing
5
singles: false # Singles where CF7 is showing
6
scripts: # Scripts to load
7
- 'google-recaptcha'
8
- 'wpcf7-recaptcha'
9
- 'wpcf7cf-scripts'
10
- 'cf7msm'
11
styles: # Styles to load
12
- 'wpcf7-recaptcha'
13
- 'atcf7-style'
14
- 'cf7cf-style'
15
always_load_default_js: false # Always load default JS
16
always_load_default_css: false # Always load default CSS

Options

  • blocks: Array of block names where CF7 forms are displayed.
  • archives: Array of archive types where CF7 forms are displayed.
  • taxonomies: Array of taxonomy types where CF7 forms are displayed.
  • singles: Array of post types where CF7 forms are displayed.
  • scripts: Array of CF7 scripts to load.
  • styles: Array of CF7 styles to load.
  • always_load_default_js: Whether to always load the default CF7 JavaScript.
  • always_load_default_css: Whether to always load the default CF7 CSS.

Performance Optimization

By default, Contact Form 7 loads its scripts and styles on every page, even if no forms are present. Combo optimizes this by loading these assets only on pages where forms are actually displayed.

Specifying Form Locations

Specify where forms are displayed to optimize script loading:

1
cf7:
2
blocks:
3
- 'acf/contact-form'
4
- 'acf/newsletter'
5
singles:
6
- 'page'
7
- 'contact'
8
archives:
9
- 'category'
10
taxonomies:
11
- 'product_cat'

With this configuration, CF7 scripts and styles will only be loaded on:

  • Pages containing the 'acf/contact-form' or 'acf/newsletter' blocks
  • Single 'page' or 'contact' post types
  • Category archive pages
  • Product category taxonomy pages

Controlling Script and Style Loading

Specify which CF7 scripts and styles to load:

1
cf7:
2
scripts:
3
- 'google-recaptcha'
4
- 'wpcf7-recaptcha'
5
- 'wpcf7cf-scripts'
6
- 'cf7msm'
7
styles:
8
- 'wpcf7-recaptcha'
9
- 'atcf7-style'
10
- 'cf7cf-style'

If you need to always load the default CF7 scripts and styles, regardless of whether forms are present:

1
cf7:
2
always_load_default_js: true
3
always_load_default_css: true