Lehel Szilard Marosi

Greetings,

First of all we are very sorry for this late response and thank you for your opinion.

After a deeper research we came to the following conclusion:
– there may be a styling reset for your fields in the theme you are using, or this reset may come from the plugin itself, where the “bakcground:inherit;” style is added to the frontend.css
So on the :focus pseudo class of your field the styling is reset and it may cause it to disappear.

To fix this issue, you need to set a style for the :focus pseudo class of your fields. In our current version of the Contact Form 7 Style plugin this can be achieved at the CSS Editor tab (which is under the Add new style menu), where you can add the following CSS snippet:

body .cf7-style input[type="text"]:focus,
body .cf7-style input[type="email"]:focus,
body .cf7-style textarea:focus {
	background: #000000;
}

In our example we added a black background color to our fields, but you can change that to another color used on your fields in normal state.

The :focus pseudo class can be customized with CSS in modern browsers, and it points out the moment when a user click the desired element. You can read more about this at the: https://css-tricks.com/almanac/selectors/f/focus/

If our answer resolved your problem or you enjoyed using the Contact Form 7 Style add-on please consider donating or add a five star review(which can be done here: https://www.ads-software.com/support/plugin/contact-form-7-style/reviews/#new-post ). Your opinion means a lot for us and it will help this Add-on out for further development.

Best Regards,
Lehel

Greetings,

Have You installed the Contact Form 7 plugin?
Please be aware that our plugin is an add-on for the famous Contact Form 7 plugin. You need that in order to get styling to work properly.
You can see an example in the following presentation: https://www.youtube.com/watch?v=dByaDeVlmAc

If you enjoy our add-on pease give us a five star review, this will help our add-on out.
You can do that here: https://www.ads-software.com/support/plugin/contact-form-7-style/reviews/#new-post

Or if you want to help further development on this plugin, please consider donating.

Regards,

Greetings,

Yes it is possible.

Please watch this example video: https://www.youtube.com/watch?v=58BBXGlyG1I and try to play around with the settings to achieve your desired layout.

The main idea is you could add a background-image to your contact form and after that you could position your image to the top of the form. As a final touch please add a top padding to move the content down, so it won’t overlay your new top background heading image.

If your really liked our plugin please consider to give us a five star rating review on the link below: https://www.ads-software.com/support/plugin/contact-form-7-style/reviews/#new-post , it would really help this add-on out, or you can donate to support Us.

We really appreciate every opinion for this add-on, so if you have any idea on how to make this plugin better, please feel free to share your idea and we will try to implement it in the near future.

Regards,

Greetings,

Our add-on is an extension for the Contact Form 7 plugin.
Please watch this video to understand the steps of installing our plugin: https://www.youtube.com/watch?v=dByaDeVlmAc.

Also do not forget to download the Contact Form 7 plugin, which you can do from the link below:
https://www.ads-software.com/plugins/contact-form-7/

After that you can setup your contact form and there you will have your shortcode for the form. If you want to style your Contact Form 7 form, you can achieve a great look with our add-on.

If you like our add-on consider donating or give us a five star review here:
https://www.ads-software.com/support/plugin/contact-form-7-style/reviews/#new-post
This will help us concentrate on this great add-on, if you have some great ideeas we will try to implement them in the near future.

Thanks,

Greetings,

Yes, it can be customized via the custom templates provided by the Contact Form 7 Style plugin. Please take a look at this video: https://www.youtube.com/watch?v=dByaDeVlmAc

Creating a new style and adding some values to the width property in the form tab should do the job for reducing the size of the form. Eventually you could adjust the height of the elements in the input tab of the custom style. Don’t forget to check the form, on which you would like to activate this custom style.

As for your second we have tested this functionality in our environment, and the on_sent_ok works correctly.

Please consider rating our plugin, or donate via the donation form if satisfied with our product.

If your form looks ok in the preview form, but it’s not ok on the website it means that the theme used on your website is overriding the styling of the Contact Form 7 Style settings.

As a test, can you select a default WordPress theme like twenty-fifteen or twentysixteen to test the same setup?

If it works with the default theme, than you should style your textarea with the CSS editor implemented in the Contact Form 7 Style plugin after activating your custom WordPress theme.

As an alternative you could try to add this snippet to the CSS editor of the Contact Form 7 Style plugin:

body .cf7-style .wpcf7-form-control-wrap input {
  width: 200px;
}
body .cf7-style .wpcf7-form-control-wrap textarea {
  width: 330px;
}

Thank You for using our plugin, if you consider this answer was a good solution to your problem, please feel free to rate our plugin, because we consider that every oppinion is very important, and a great help for this community.

Hello Ajoh00n,

We will add this feature in our next updates. Till than try to use the live-preview feature of the Contact Form 7 Style plugin.

We will keep you updated about this.

Hey akwa770,

Can You be more specific about yout issue? Is there any Javascript error on your page?

Eventually could you please fill out our Support form, which is available in Your WordPress dashboard at Contact Style -> System Status ?

Thanks,

Greetings,

This feature will be available in our future updates for the Contact Form 7 Style. We are currently working on this.

We will keep you updated about this update.

Greetings bithelp,

Can You be more specific about this hover state issue? Which element does not allow you to set it’s background image?

Thanks,

Greetings,

Are you using a cache plugin(WP total cache)?
Can you disable some of the other plugins to see if these errors still remain?
For now we can’t be sure that the Contact Form 7 Style plugin is causing the problem above.

Thanks for this detailed information, keep in touch,

Greetings dFactory,

same problem here, the following error message after updating:

Update Failed: Plugin update failed.

Thank You,
Lehel

All You need from the link above is:

define( 'WP_DEBUG', true );

Greetings derrreck,

Can you turn on debugging on your website?
This can be done like here
You should search for this constant in your wp-config file, for this you will have to open that file on your FTP server.

It would really help us if You paste us the error messages which will appear after you complete the process explained above.

Thank You in advance,
Lehel

Hey headknocker,

If you ever need to add some styling, or you need to customzie your Contact Form 7 form in a fast, easy way please feel free to use our Contact Form 7 Style plugin.

More information about this add-on can be found on our website at:

https://cf7style.com/

Best Wishes,
Contact Form 7 Style Team