> Bootstrap for Contact Form 7 wordpress plugin resources analysis

Bootstrap for Contact Form 7 wordpress plugin resources analysis

Download This Plugin
Download Elegant Themes
Name Bootstrap for Contact Form 7
Version 1.1.0
Author Felix Arntz
Rating 90
Last updated 2015-02-24 09:10:00
Downloads
4282
Download Plugins Speed Test plugin for Wordpress

Home page

Delta: 0%

Post page

Delta: 0%
Bootstrap for Contact Form 7 plugin has no negative impact on PageSpeed score.

Home page PageSpeed score has been degraded by 0%, while Post page PageSpeed score has been degraded by 0%

Bootstrap for Contact Form 7 plugin added 6 bytes of resources to the Home page and 0 bytes of resources to the sample Post page.

Bootstrap for Contact Form 7 plugin added 0 new host(s) to the Home page and 0 new host(s) to the sample Post page.

Great! Bootstrap for Contact Form 7 plugin ads no tables to your Wordpress blog database.

Bootstrap for Contact Form 7 modifies all the output of the popular Contact Form 7 plugin to be fully compatible with the current version 3 of the popular CSS framework Bootstrap. What this means to you as a Bootstrap user: No additional CSS rules necessary - from now on, Contact Form 7 integrates seamlessly with the overall Bootstrap design. It is even possible to use different form layouts via an easy-to-use filter.

This plugin is actually an addon to another plugin, so it requires Contact Form 7 to work. Furthermore you have to be using it in conjunction with a Bootstrap-based WordPress theme, otherwise the forms might look weird.

Usage

Bootstrap for Contact Form 7 does not provide additional options itself, so you can continue using Contact Form 7 (almost) the same way you did before.

The plugin will not break your form's appearance, however it is recommended to adjust the contact form shortcodes to achieve perfect results: The most important thing you need to know is that form field labels are now integrated in the field shortcodes, so you don't need to wrap them into paragraphs when editing the form shortcode. If you want to use a label for a specific field, you should instead make the shortcode enclosing (by default, all Contact Form 7 shortcodes are self-closing) and put the label in between. Make sure that, if your field should be required, you add the asterisk to the closing tag as well.

Generally, you should not be using HTML tags any longer to wrap the field shortcodes. The new shortcodes are automatically printed out with wrapping div elements, so an additional wrapper is neither necessary nor recommended. As of version 1.1 of this plugin, the submit button is also automatically positioned according to the form layout. You can specify its alignment using a new 'align' attribute, for example align:right. Of course you can still use HTML code to separate parts of your form, for example using the fieldset tag.

An additional feature of this plugin is the possibility to predefine field values for your forms using GET parameters which allows you to bring an improved user experience to your visitors by creating custom links. Simply use the field name as the parameter key and the desired value as value. This works with checkboxes, date fields, number fields, select fields, text fields and text areas. To create such a URL, you need to use the plugin function cf7bs_add_get_parameter() where you provide parameters similarly to the WordPress Core function add_query_arg.

For additional information, please read the FAQ.

Basic Idea behind the Plugin

Lots of WordPress Themes are based on Bootstrap - and while it is the general approach to use CSS rules to style your HTML content, it is also possible the other way around - with many benefits.

When using a well-known framework which provides general styles for all the important components of a website, it can be time-consuming to apply the same styles to third-party plugins which (obviously) have not been written with a framework in mind. This is perfectly fine, but if you're using Bootstrap for your WordPress theme, you will certainly love the fact that you do not need to write CSS rules for the Contact Form 7 plugin any longer. It will all look like Bootstrap from the beginning so that it fits into your website design. If you're not using Bootstrap, this plugin is useless for you - but maybe you're just having an idea how you can adjust another popular WordPress plugin to integrate with another well-written CSS framework.

Screenshots

Resources added by plugin to Home page/Post page in kB
Total size of resources for Home page/Post page in kB
Random Theme Tests
Capoverso screenshot

Capoverso

by: automattic

1689
0%
CollerAnge screenshot

CollerAnge

by: rohitink

12351
0%