Download Now Download Themes Gratis WordPress Responsive!

Cara Merubah Desain Tombol Submit Contact Form7

contact form7Contact Form7 adalah plugin untuk membuat Formulir, plugin ini adalah salah satu plugin pembuat form yang paling populer dan salah satu yang saya gunakan di situs ini situs yang lain. Hal yang saya senangi dari plugin ini karena mudahnya custom dan pesan AJAX yang memberikan informasi kepada pengguna tanpa refresh halaman.

Saat menggunakan Contact Form7 anda pasti melihat tombol submit default dari contact form7 ini sangatlah tidak menarik, banyak sekali orang bingung bagaimana cara merubah desain Tombol atau button dari Contact Form7 ini, Pada artikel kali ini saya akan menunjukkan kepada anda cara merubah desain button contact form7, cukup copy code css dibawah ini kedalam file style.css theme wordpress yang anda gunakan.

Baca : Cara Install Contact Form7 WordPress

input.wpcf7-submit {
	background:#38B7EE ! important;
	border:1px;
	color:white ! important;
	font-weight: bold ! important;
	font-size: 12px ! important;
	border-radius: 2px;
	height: 32px ! important;
	text-transform:uppercase;
	behavior:url(border-radius.htc);
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	-khtml-border-radius: 2px;
	transition:all 0.2s linear 0s;
	cursor:pointer;
}
input.wpcf7-submit:hover{
	background:#2a2a2a ! important;
}

Class diatas diambil dari contact Form7 itu sendiri, karena css bawaan terdapat bersamaan plugins, jadi dengan solusi memasukkan code tersebut di file style.css maka setiap update baru contact form7 tidak akan mengalami perubahan seperti semula atau defaultnya lagi. Silahkan kreasikan desain tombol submit sesuai dengan keinginan anda. Lihat hasil perubahan button dibawah ini atau ke contact centerklik.

button contact form7

Baca : Membuat Formulir Konfirmasi Pembayaran dengan Contact Form7

Anda Terbantu artikel ini? Silahkan bergabung dengan centerklik di Twitter dan Google+.

Daftar isi Tutorial Wordpress Terlengkap Gratis
10 top hosting!

Register Now: TOP 10 Hosting

Dapatkan Hosting Murah dengan Kualitas Terbaik. For Serious Blogger! View Deals

Bluehost Hosting

$2.95/Month Free Domain, Unlimited Space & Bandwidth Get Host

iPage Hosting

$1.99/Month Free Domain, Unlimited Space & Bandwidth Get Host

SiteGround Hosting

$3.45/Month Free Domain, Unlimited Space & Bandwidth Get Host

WebHostingPad

$1.99/Month Free Domain, Unlimited Space & Bandwidth Get Host

Hostgator

$3.95/Month Free Domain, Unlimited Space & Bandwidth Get Host

  • Deny Andreawan

    thanks soB Buat infonya,
    Dituggu kunjunganya diBlog saya..

    • Sama-sama gan, kunjunginblog ane terus ya. 😀

  • Makasih informasinya ya sob,
    jangan bosan2 share ilmu ya.. hehehe

    • Mkasih kembali gan. Selamat Nggosip ya gan. 😀

Must Read...!
Cara Menghilangkan Logo WordPress Di Admin Toolbar

Pada artikel kali ini saya akan memberikan tutorial tentang cara menghilangkan logo wordpress di...

Cara Disable Admin Toolbar WordPress

Setelah sebelumnya saya memberikan Tutorial Cara Menghilangkan Admin Toolbar Wordpress dengan code functions dan...

Close