Pada versi 3.2.2 saya telah mengubah struktur HTML form registrasi menggunakan class-class CSS. Hal ini akan lebih memudahkan anda dalam melakukan perombakan tampilan form, terutama form profil.
Biasanya, theme yg bagus akan menyediakan form khusus untuk memasukkan custom CSS. Namun, jika tidak ada, anda bisa memasukkan kode CSS langsung ke file style.css theme tersebut. Kalau mau lebih aman ya anda buat child theme dulu sebelum mengubah style.css-nya.
Ok, saya akan berikan contoh kode CSS yang bisa dipakai sebagai acuan. Nanti nilai-nilainya dapat anda ubah2 sendiri sesuai dengan theme yang anda miliki
.form-info {
text-align:left;
font-weight:700;
padding:10px
}
.form-row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-bottom:13px;
width:100%;
vertical-align:middle;
}
.form-label {
display:block;
float:left;
width:30%;
text-align:right;
padding-right:5px;
font-weight:700;
}
.form-field {
margin-top:-8px;
width:70%;
text-align:left;
}
.form-input {
width:100%;
height:40px;
border: 1px solid #cccccc;
}
.alert-success {
color: #155724;
background-color: #d4edda;
border-color: #c3e6cb;
padding:10px;
margin:10px;
}
.alert-danger {
color: #721c24;
background-color: #f8d7da;
border-color: #f5c6cb;
padding:10px;
margin:10px;
}
Jika ada pertanyaan atau komentar soal artikel di atas, silahkan disampaikan di Grup Cafebisnis. Sertakan juga URL Artikel ini: https://cafebisnis.com/tutorial/439-mengubah-tampilan-form-dengan-css
Cafebisnis Online berdiri tahun 2007 dengan materi panduan wordpress saja waktu itu.
Cafebisnis Online
@Cafebisnis
+628970097777
08970097777
lutvicb
PakarBlog
Copyright © Cafebisnis 2016