Tạo Form đăng nhập cho Blogspot
Từ trước tới nay blogger và Wordpress luôn ganh đua nhau. Mỗi nền tảng đều có những ưu điểm mà nhà cung cấp không dám đưa vào vì lí do bản quyền nhưng với các bloger thì lại không ai cấm vì chúng ta không phục vụ mục đích thương mại mà. 

Hôm nay namkna sẽ hướng dẫn bạn làm một form đăng nhập (Login Form) trên blog với phong cách của Wordpress. Như vậy sẽ tiết kiệm thời gian cho độc giả khi họ muốn để lại nhận xét kèm avatar trên blog của bạn mà quên chưa đăng nhập, thay vì phải gõ địa chỉ trang chủ của Blogger.

☼ Hướng dẫn chèn Form đăng nhập cho blogpsot:


1- Đăng nhập vào Blog
2- Vào Mẫu (template)
3- Chọn Chỉnh sử HTML (Edit HTML)
4- Thêm đoạn code sau vào trước thẻ  ]]></b:skin> .
#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/AVvXsEjSVnwqfbVG62T4mir5zu5Qo69M-Uj3lhtKVrmtI_oJmNBkSuPRSPPvQ7Np6zoC-5XcxV12GpThViF78y-CRYaiRDoRZdpT7_VTk8BDlPK4nSdPq8f3TdDIJqhz7A2J01_kP3Bs7_NdFbg/)  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}

5. 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(){$(&quot;.btn-slide&quot;).click(function(){$(&quot;#slide-panel&quot;).slideToggle(&quot;slow&quot;);});});
</script>

<div id='slide-panel'><div class='loginform'><div class='formdetails'>
<form  action='https://www.google.com/accounts/ServiceLogin?service=blogger&amp;continue=https%3A%2F%2Fwww.blogger.com%2Floginz%3Fd%3Dhttp%253A%252F%252Fwww.blogger.com%252Fhome%26a%3DADD_SERVICE_FLAG&amp;passive=true&amp;alinsu=0&amp;aplinsu=0&amp;alwf=true&amp;ltmpl=start&amp;skipvpage=true&amp;rm=false&amp;showra=1&amp;fpui=2&amp;naui=8#s01'  method='post'>
<label for='log'>Tài khoản : </label><input id='Email' name='Email' size='20' type='text'/>
<label for='pwd'>Mật khẩu : </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>
- Nếu trang của bạn đã chèn thư viện jquery rồi thì hãy xóa đoạn code màu xanh đi nha.

5- Save template và xem thành quả.

- P/s: Nhiều bạn thắc mác sau khi đăng nhập lại chuyển sang của blogger. Nhưng các bạn yên tâm nguyên tắc hoạt động của tiện ích này là như thế. Như từ đầu mình đã nói là để độc giả không mất công ngồi gõ địa chỉ đăng nhập blog thôi, vì nhiều người còn chưa biết cách vào blog mà.