Xem demo
Chèn đoạn CSS sau phía trên thẻ </b:skin> trong template:
#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/AVvXsEixrAXB5hqsK7ij8mp0yS0z_sJoskTf71haijDe7Sy4Avex8z8DxJGZuyOL053tqL4bq4WGR7DJhtIuY8bpYta-hAvaq-eI4SlciQLAcJOtCs9aegzsWQ0izr1v39JTfoWW7bnDJtdJbjM/) 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}
<script type='text/javascript'>
$(document).ready(function(){$(".btn-slide").click(function(){$("#slide-panel").slideToggle("slow");});});
</script>
<div id='slide-panel'><div class='loginform'><div class='formdetails'>
<form action='https://www.google.com/accounts/ServiceLogin?service=blogger&continue=https%3A%2F%2Fwww.blogger.com%2Floginz%3Fd%3Dhttp%253A%252F%252Fwww.blogger.com%252Fhome%26a%3DADD_SERVICE_FLAG&passive=true&alinsu=0&aplinsu=0&alwf=true&ltmpl=start&skipvpage=true&rm=false&showra=1&fpui=2&naui=8#s01' method='post'>
<label for='log'>Username : </label><input id='Email' name='Email' size='20' type='text'/>
<label for='pwd'>Password : </label><input id='Passwd' name='Passwd' size='20' type='password'/>
<input id='signIn' name='signIn' type='submit' value='Đăng nhập'/>
<label for='rememberme'><input checked='checked' id='rememberme' name='rememberme' type='checkbox' value='forever'/> Ghi nhớ</label>
</form></div>
<div class='loginregister'>
<a href='https://www.blogger.com/signup.g' target='_blank'>Đăng kí</a> | <a href='http://www.blogger.com/forgot.g' target='_blank'>Quên mật khẩu ?</a>
</div></div></div>
<div class='slide'><a class='btn-slide' href='#'>Login </a></div>
.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/AVvXsEixrAXB5hqsK7ij8mp0yS0z_sJoskTf71haijDe7Sy4Avex8z8DxJGZuyOL053tqL4bq4WGR7DJhtIuY8bpYta-hAvaq-eI4SlciQLAcJOtCs9aegzsWQ0izr1v39JTfoWW7bnDJtdJbjM/) 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 ngay bên dưới </head>:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/><script type='text/javascript'>
$(document).ready(function(){$(".btn-slide").click(function(){$("#slide-panel").slideToggle("slow");});});
</script>
<div id='slide-panel'><div class='loginform'><div class='formdetails'>
<form action='https://www.google.com/accounts/ServiceLogin?service=blogger&continue=https%3A%2F%2Fwww.blogger.com%2Floginz%3Fd%3Dhttp%253A%252F%252Fwww.blogger.com%252Fhome%26a%3DADD_SERVICE_FLAG&passive=true&alinsu=0&aplinsu=0&alwf=true&ltmpl=start&skipvpage=true&rm=false&showra=1&fpui=2&naui=8#s01' method='post'>
<label for='log'>Username : </label><input id='Email' name='Email' size='20' type='text'/>
<label for='pwd'>Password : </label><input id='Passwd' name='Passwd' size='20' type='password'/>
<input id='signIn' name='signIn' type='submit' value='Đăng nhập'/>
<label for='rememberme'><input checked='checked' id='rememberme' name='rememberme' type='checkbox' value='forever'/> Ghi nhớ</label>
</form></div>
<div class='loginregister'>
<a href='https://www.blogger.com/signup.g' target='_blank'>Đăng kí</a> | <a href='http://www.blogger.com/forgot.g' target='_blank'>Quên mật khẩu ?</a>
</div></div></div>
<div class='slide'><a class='btn-slide' href='#'>Login </a></div>
Save template và xem thành quả.
Theo: http://noct-land.blogspot.com
8 nhận xét | Viết lời bình
Đã add blog bạn rồi đó...
Title: Share2Vn - Share Anything
Link: http://share2vn.blogspot.com
Blog bạn load hơi chậm ...
Nhanh hơn chưa bạn! mình thấy tải cũng nhanh mà! nhờ bạn góp ý thêm!:D)
Minh thông báo: Người bình luận có tên Nặc danh/Anonymous không được phép bình luận tại đây.
Vẫn chạy bình thường mà bạn nặc danh!:4)
Minh thông báo: Người bình luận có tên Nặc danh/Anonymous không được phép bình luận tại đây.
Bạn làm lại đi! mình kiểm tra rồi vẫn chạy bình thường mà! Bạn nên để lại tên tuổi để dể liên hệ!
bạn cho mình hỏi sao đăng nhập nó báo lỗi bạn à
blog mình đây, bạn xem hộ mình nhé
http://truyenthegioiao.blogspot.com