Custom Spinner for Contact Form 7

Mô tả

For good reason the Contact Form 7 plugin is the most used contact form plugin for WordPress. The downside is that you see the same boring spinning animation on zillions of websites. The CF7 Custom Spinner plugin allows you to customize this loader animation!


Customize the spinner animation in ‘CF7 Custom Spinner’ section of your WordPress Dashboard. That’s it!

Customization Options

This plugin allows you to choose from

  • 12 animations
  • 16 colors
  • 3 sizes

(which gives a total of 576 possible combinations)


The only requirement for this plugin is that you have the Contact Form 7 plugin installed and activated.


Support Forum


How to customize the Loader Animation of Contact Form 7

Do you like this plugin?

I spend a lot of my precious spare time to develop and maintain my free WordPress plugins. You don’t need to make a donation. No money, no beer, no coffee. If you like this plugin then please do me a favor and give it a good rating. Thanks.

Plugin Privacy Information

  • This plugin does not set cookies
  • This plugin does not collect or store any data
  • This plugin does not send any data to external servers

Peters’ Plugins Privacy Information Page


This plugin is compatible with ClassicPress.

More plugins from Peter

Stay up to date

Follow me on Google+
Follow me on Facebook
YouTube Channel


Thanks a lot to Takayuki Miyoshi for the great Contact Form 7 plugin. Thanks a lot to Tobias Ahlin for creating the beautiful CSS only loading spinners.

Ảnh màn hình

  • Customize the spinner
  • Test it live on your site (this shows the spinner animation immediately without the need to click the submit button on your form)
  • The custom spinner in action

Hỏi đáp

Will it work with the theme I’m using?

Of course I can’t guarantee that, but actually the plugin should work with every theme.

What about Web Browser compatibility?

This plugin uses pure CSS animations, which are supported in the latest version of all major browsers. Browsers with support for CSS animations make up about 95% of all usage worldwide. Browsers that do not support CSS animations will display the loader without animation.

What about performance?

The CSS code is not generated each time a page is requested but only when saving the settings, so you don’t have to worry about any negative performance effects.

What about page size?

The plugin only adds some CSS code. It does not use images. It does not generate additional server requests. The size of the CSS code depends on the complexity of the anmiation. The most complex animation generates additional CSS code of about 3 KB. Nothing to worry about.

Is it possible to prevent the CSS code from being loaded on pages where it is not needed?

The CSS code generated by the Contact Form 7 Custom Spinner plugin automatically is not added to a page on which you prevented the Contact Form 7 stylesheet from being loaded. You don’t have to care about this.

Where can I get help?

Please use the Support Forum.

Đánh giá

22 Tháng Năm, 2020
Need an option to add custom HEX color though... It's impossible to match provided swatch with the color of my website design (and many of websights I suppose)
13 Tháng Một, 2019
So incredibly simple. I messed around for a couple of hours trying to change the awful contact 7 spinner. This worked like a charm. It was so easy I was stunned. THANK YOU!!!
Đọc tất cả 6 đánh giá

Người đóng góp & Lập trình viên

“Custom Spinner for Contact Form 7” là mã nguồn mở. Những người sau đã đóng góp vào plugin này.

Những người đóng góp

“Custom Spinner for Contact Form 7” đã được dịch qua 1 ngôn ngữ. Cảm ơn những người tham gia dịch vì đóng góp của họ.

Dịch “Custom Spinner for Contact Form 7” sang ngôn ngữ của bạn.

Muốn tham gia phát triển?

Duyệt code, check out SVN repository, hoặc theo dõi nhật ký phát triển qua RSS.

Nhật ký thay đổi

2 (2019-01-30)

  • Load all the admin stuff only in admin panel for better performance

1 (2018-08-20)

  • Initial Release