Comment WordPress đóng một vai trò quan trọng trong việc xây dựng website.Vì thông qua cổng comment thì độc giả có thể chia sẽ suy nghĩ , bình luận và góp ý cho Webmaster điều chỉnh trong bài viết của mình.Chính vì thế mà Harry cũng rất muốn sau mỗi bài viết các bạn để lại comment bình luận cho các bài viết Harry đã biên tập.Đó cũng chính là nguồn động viên lớn nhất và góp phần xây dựng Blog Học WordPress ngày càng tốt hơn.Có nhiều cách để độc giả comment bài viết của mình.Phần lớn thì nội dung phải hay khiến độc giả có những suy nghĩ về bài viết.Nhưng một phần không quan trọng đó là Form Comment phải hấp dẫn đẹp.Harry sẽ style lại form comment của học Wordpress theo bài viết này,
Bạn copy đoạn code sau vào file style.css trong thư mục themes nhé.
#respond { }
#reply-title { }
#cancel-comment-reply-link { }
#commentform { }
#author { }
#email { }
#url { }
#comment
#submit
.comment-notes { }
.required { }
.comment-form-author { }
.comment-form-email { }
.comment-form-url { }
.comment-form-comment { }
.form-allowed-tags { }
.form-submit
Tuỳ chỉnh CSS, bạn hoàn toàn có thể thay đổi giao diện của form comment wordpress. Bây giờ ta tuỳ chỉnh lại khi click vào từng text-field thì nó sẽ sáng lên giống hình.
Copy đoạn css sau :
#respond {
background: #ececec;
padding:0 5px 0 5px;
}/* Highlight active form field */
#respond input[type=text], textarea {
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
outline: none;
padding: 3px 0px 3px 3px;
margin: 5px 1px 3px 0px;
border: 1px solid #DDDDDD;
}#respond input[type=text]:focus, textarea:focus {
box-shadow: 0 0 5px rgba(81, 203, 238, 1);
margin: 5px 1px 3px 0px;
border: 1px solid rgba(81, 203, 238, 1);
}
Bây giờ ta tuỳ chỉnh font chữ cho hai ô tên và url
#author {
font-family: Lobster, “Lobster 1.4″, “Droid Sans”, Arial;
font-size: 16px;
color:#1d1d1d;
letter-spacing:.1em;
}#url {
color: #21759b;
font-family: “Luicida Console”, “Courier New”, “Courier”, monospace;
}
Làm đẹp nút gửi bình luận:
#submit {
font-family: Arial;
color: #ffffff;
font-size: 20px;
padding: 10px;
text-decoration: none;
box-shadow: 0px 1px 3px #666666;
-webkit-box-shadow: 0px 1px 3px #666666;
-moz-box-shadow: 0px 1px 3px #666666;
text-shadow: 1px 1px 3px #666666;
background: -webkit-gradient(linear, 0 0, 0 100%, from(#006ad4), to(#003366));
background: -moz-linear-gradient(top, #006ad4, #003366);
}#submit:hover {
background: -webkit-gradient(linear, 0 0, 0 100%, from(#003366), to(#006ad4));
background: -moz-linear-gradient(top, #003366, #006ad4)
}
Như vậy bạn đã style xong form comment wordpress rồi nhé.chúc bạn thành công