Thứ Ba, 5 tháng 1, 2016

Tạo form đăng nhập cho Blogger (Blogspot)



Thực tế thì Blogger không hề có phần đăng nhập hay đăng kí cho khách truy cập. Form đăng nhập này chỉ là đăng nhập qua tài khoản Google, tuy nhiên nó sẽ giúp blog của bạn có cái nhìn chuyên nghiệp hơn.

Cách làm:
Đăng nhập Blogger ~> Vào Mẫu ~> Chỉnh sửa HTML
Thêm đoạn css này vào trước thẻ ]]>
#slide-panel{background-color:#000;border-bottom:2px solid #838383;display:none;height:80px;margin:auto;padding-top:20px}
.slide{width:950px;margin:auto}
.btn-slide:link,.btn-slide:visited{color:#fff;float:right;display:block;font-size:14px;text-transform:uppercase;font-weight:bold;height:28px;padding:3px 0 3px 0;line-height:28px;text-align:center;text-decoration:none;width:80px;font-family:Arial;background:#000;margin-top:-2px}
.loginform{width:950px;margin:0 auto;color:#999;font-family:Arial,Helvetica,sans-serif}
.formdetails{color:#FFF;font-size:12px;padding:5px}
.formdetails input{border:none;padding:2px 5px;background-color:#EFEFEF}
.loginregister{color:#999;padding:5px}
.loginregister a:link,.loginregister a:visited{color:#90fff6;font-size:12px}
.loginregister a:hover{color:#fff}
.loginform h2{padding:10px 10px 10px 0;font-size:18px;font-weight:normal;text-transform:uppercase}
.loginform ul li{display:inline}
.loginform ul li a:link,.loginform ul li a:visited{color:#FFF;font-size:12px;text-decoration:underline}
input#signIn{color:#fff;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhK84RkoQqxE9UQ9_YQsU8RxA01BMCMk5aEAlX7CmxcwVAt049pbrcXfsRbVP-sjySidfBm53UBHBrxTHlTUrnDBi-d_P45voP6Rt7rwxsQhJEOY1pK5JoBbZY5_OXtU8F7ACcDsjFAA1M/) no-repeat;width:94px;height:25px;cursor:pointer;padding-bottom:5px}
input#Email,input#Passwd{background:#414141;color:#fff}
input:focus#Email,input:focus#Passwd{background:#545454}

Tiếp theo, chèn đoạn code sau vào bên dưới thẻ 



Lưu mẫu lại và xem thành quả nhé.

Tác giả: Noct
Nguồn: http://noct-land.blogspot.com/2011/03/form-ang-nhap-cho-blogspot.html

0 nhận xét: