Contact Form 7 Shortcode

Below, you’ll find a detailed guide on how to add the Contact Form 7 Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Contact Form 7 Plugin shortcode not to show or not to work correctly.

Before starting, here is an overview of the Contact Form 7 Plugin and the shortcodes it provides:

Plugin Icon
Contact Form 7

"Contact Form 7 is a versatile WordPress plugin that allows users to create and manage multiple contact forms. Its user-friendly interface and customization options make it a top choice for all website styles."

★★★★✩ (2055) Active Installs: 5000000+ Tested with: 6.3.2 PHP Version: 7.4
Included Shortcodes:
  • [contact-form-7]

Contact Form 7 [contact-form-7] Shortcode

The Contact Form 7 shortcode is used to embed a specific contact form into your WordPress pages or posts. It retrieves a contact form by its hash, ID, or title, and displays it on the frontend. If no form is found, it returns an error message.

Shortcode: [contact-form-7]

Parameters

Here is a list of all possible contact-form-7 shortcode parameters and attributes:

  • id – A unique identifier of the contact form. When using the shortcode, this ID helps the plugin to find and display the correct form.
  • title – The name of the contact form. If the shortcode can’t find a form using the provided ID, it will search for a form with this title.
  • html_id – The HTML ‘id’ attribute for the form. This is useful for styling or scripting purposes, as it allows you to target the form with CSS or JavaScript.
  • html_name – The HTML ‘name’ attribute for the form. Similar to ‘html_id’, this attribute can be used to reference the form in scripts.
  • html_title – The HTML ‘title’ attribute for the form. This can be used to provide additional information about the form when a user hovers over it with their mouse.
  • html_class – The HTML ‘class’ attribute for the form. This allows you to apply a CSS class to the form, which can be used to style it in a specific way.
  • output – Determines the type of output that the shortcode will produce. By default, this is set to ‘form’, which means the shortcode will output the HTML code for the contact form.

Examples and Usage

Basic example – Use the shortcode to display a contact form by its ID. Simply replace ‘123’ with your contact form’s ID.

[contact-form-7 id="123" /]

Advanced examples

Display a contact form by referencing both ID and title. The form will first try to load by ID, but if not found, it will try to load by title. Replace ‘123’ with your form’s ID and ‘Contact Us’ with your form’s title.

[contact-form-7 id="123" title="Contact Us" /]

You can also add custom HTML attributes to your contact form, such as ‘html_class’ for additional styling. Here’s an example with a custom class named ‘my-form’.

[contact-form-7 id="123" title="Contact Us" html_class="my-form" /]

Lastly, you can control the output of the form. By default, the form’s HTML is output. But if you want to output the form’s fields, you can use the ‘output’ parameter. Here’s how to show only the fields:

[contact-form-7 id="123" output="fields" /]

PHP Function Code

In case you have difficulties debugging what causing issues with [contact-form-7] shortcode, check below the related PHP functions code.

Shortcode line:

add_shortcode( 'contact-form-7', 'wpcf7_contact_form_tag_func' );

Shortcode PHP function:

function wpcf7_contact_form_tag_func( $atts, $content = null, $code = '' ) {
	if ( is_feed() ) {
		return '[contact-form-7]';
	}

	if ( 'contact-form-7' === $code ) {
		$atts = shortcode_atts(
			array(
				'id' => '',
				'title' => '',
				'html_id' => '',
				'html_name' => '',
				'html_title' => '',
				'html_class' => '',
				'output' => 'form',
			),
			$atts, 'wpcf7'
		);

		$id = trim( $atts['id'] );
		$title = trim( $atts['title'] );

		$contact_form = wpcf7_get_contact_form_by_hash( $id );

		if ( ! $contact_form ) {
			$contact_form = wpcf7_contact_form( $id );
		}

		if ( ! $contact_form ) {
			$contact_form = wpcf7_get_contact_form_by_title( $title );
		}

	} else {
		if ( is_string( $atts ) ) {
			$atts = explode( ' ', $atts, 2 );
		}

		$id = (int) array_shift( $atts );
		$contact_form = wpcf7_get_contact_form_by_old_id( $id );
	}

	if ( ! $contact_form ) {
		return sprintf(
			'<p class="wpcf7-contact-form-not-found"><strong>%1$s</strong> %2$s</p>',
			esc_html( __( 'Error:', 'contact-form-7' ) ),
			esc_html( __( "Contact form not found.", 'contact-form-7' ) )
		);
	}

	$callback = static function ( $contact_form, $atts ) {
		return $contact_form->form_html( $atts );
	};

	$output = wpcf7_switch_locale(
		$contact_form->locale(),
		$callback,
		$contact_form, $atts
	);

	do_action( 'wpcf7_shortcode_callback', $contact_form, $atts );

	return $output;
}

Code file location:

contact-form-7/contact-form-7/load.php

Conclusion

Now that you’ve learned how to embed the Contact Form 7 Plugin shortcode, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *