12 Mei 2009

Membuat Form Login ke Draft Blogger

Tak seperti pada wordpress yang mempunyai halaman login di sidebar, login pada blogger hanya tertera pada navigationbar yaitu pada bar yang terpampang di ujung atas halaman blogger. Bagaimana kalau kita ingin membuat form login blogger di sidebar? Berarti kita harus membuat form yang bisa ditanamkan pada gadget blogger. Duh...padahal penguasaan bahasa html javascript penulis sangat minim dan hanya berbekal pengamatan saja, akhirnya ada ide juga yaitu kenapa tak copy paste saja dari halaman login yang sudah ada misalnya pada http://draft.blogger.com tentunya memakai akun di google. Akhirnya setelah tercopy, maka kodenya dapat dilihat dan diambil untuk kode formnya saja, beberapa kode yang tidak perlu disingkirkan, dan didapat tampilan form seperti gambar berikut ini, dan setelah ujicoba untuk login ternyata berhasil!, ya udah saya posting saja, siapa tahu ada blogger yang berminat. Oh ya, contoh formnya juga sudah ada di sidebar blog ini pada form blogger account,
Di bawah ini kodenya (teks warna biru) yang hasil dari cutpas tadi, bisa anda copas deh, silahkan...



<form id="gaia_loginform" action="https://www.google.com/accounts/ServiceLoginAuth?service=blogger" method="post" onsubmit= "return(gaia_onLoginSubmit());" >
<div id="gaia_loginbox">
<table class="form-noindent" cellspacing="0" cellpadding="5" width="100%" border="0">
<tr> <td valign="top" style="text-align:center" nowrap="nowrap" bgcolor="#e8eefa">
<input type="hidden" name="ltmpl" value="draft">
<div class="loginBox">
<table id="gaia_table" align="center" border="0" cellpadding="1" cellspacing="0">
<tr><td colspan="2" align="center">
<table> <tr> <td valign="top">
<img src="http://kodehexa.googlepages.com/google_transparent.gif" alt="Google">
</img>
</td>
<td valign="middle">
<font size="+0">
<b>Akun</b>
</font>
</td>
</tr>
</table>
<font size="-1">
</font></td>
</tr>
<script type="text/javascript">
<!-- function onPreCreateAccount() { return true; } function onPreLogin() { if (window["onlogin"] != null) { return onlogin(); } else { return true; } } -->
</script>
<tr>
<td colspan="2" align="center">
</td>
</tr>
<tr>
<td nowrap="nowrap">
<div align="right">
<span class="gaia le lbl">
Email:
</span>
</div>
</td>
<td>
<input type="hidden" name="continue" id="continue" value="https://draft.blogger.com/loginz?d=%2Fhome&amp;a=ADD_SERVICE_FLAG" />
<input type="hidden" name="service" id="service" value="blogger" />
<input type="hidden" name="naui" id="naui" value="8" />
<input type="hidden" name="fpui" id="fpui" value="2" />
<input type="hidden" name="skipvpage" id="skipvpage" value="true" />
<input type="hidden" name="rm" id="rm" value="false" />
<input type="hidden" name="ltmpl" id="ltmpl" value="draft" />
<input type="hidden" name="hl" id="hl" value="in" />
<input type="hidden" name="alwf" id="alwf" value="true" />
<input type="hidden" name="alinsu" id="alinsu" value="0" />
<input type="hidden" name="ltmpl" id="ltmpl" value="draft" />
<input type="hidden" name="GALX" value="Ie2nThzvHSI" />
<input type="text" name="Email" id="Email" size="18" value="" class='gaia le val' />
</td>
</tr>
<tr>
<td>
</td>
<td align="left">
</td>
</tr>
<tr>
<td align="right">
<span class="gaia le lbl">
Sandi:
</span>
</td>
<td>
<input type="password" name="Passwd" id="Passwd" size="18" class="gaia le val" />
</td>
</tr>
<tr>
<td>
</td>
<td align="left">
</td>
</tr>
<tr>
<td align="right" valign="top">
<input type="checkbox" name="PersistentCookie" id="PersistentCookie" value="yes" />
<input type="hidden" name='rmShown' value="1" />
</td>
<td>
<label for="PersistentCookie" class="gaia le rem">
Ingat saya di komputer ini
</label>
</td>
</tr>
<tr>
<td>
</td>
<td align="left">
<input type="submit" class="gaia le button" name="signIn" value="Masuk" />
</td>
</tr>
<tr id="ga-fprow">
<td colspan="2" height="33.0" class="gaia le fpwd" align="center" valign="bottom">
<a href="https://www.blogger.com/forgot.g" target=_top>
Anda lupa sandi?
<br/>Modif by:
<a href="http://yoyokr.purworejo.asia" target=_top>
Blogger Modif
</a>
</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
<input type="hidden" name="asts" id="asts" value="">
</form>
<form id="gaia_universallogin" action="https://www.google.com/accounts/ServiceLoginAuth?service=blogger" method="post" onsubmit="return(gaia_onLoginSubmit());">
<input type="hidden" name="continue" id="continue" value="https://draft.blogger.com/loginz?d=%2Fhome&amp;a=ADD_SERVICE_FLAG" />
<input type="hidden" name="service" id="service" value="blogger" />
<input type="hidden" name="naui" id="naui" value="8" />
<input type="hidden" name="fpui" id="fpui" value="2" />
<input type="hidden" name="skipvpage" id="skipvpage" value="true" />
<input type="hidden" name="rm" id="rm" value="false" />
<input type="hidden" name="ltmpl" id="ltmpl" value="draft" />
<input type="hidden" name="hl" id="hl" value="in" />
<input type="hidden" name="alwf" id="alwf" value="true" />
<input type="hidden" name="alinsu" id="alinsu" value="0" />
<input type="hidden" name="ltmpl" id="ltmpl" value="draft" />
<input type="hidden" name="ltmpl" id="ltmpl" value="draft" />
</form>


Selamat menikmati mencoba...

14 Komentar:

  1. sama-sama sob, saling berbagi info n pengalaman...

    BalasHapus
  2. Unik sekali, terus bayarnya lewat apa yaaa

    BalasHapus
  3. bos punyaku kok jadinya kok gede banget sih

    BalasHapus
  4. mas unek2 mungkin naruhnyadi bawah posting jadi lebar, karena sifatnya form ini lebarnya menyesuaikan

    BalasHapus
  5. itu bagi yg suka GAYA kek aku...coba kalau beginih...kita jadiin simpel, kt jadiin link...ambil form dr kode diatas terus tulis deh kek kt membuat link...saran ajah ^^
    kalo mo gaya kek aku ini yaaa pake kek ini...hauhauhauhauhauhau

    BalasHapus
  6. wah thanks infonya.....

    BalasHapus
  7. Aku taruh di sidebar kok tombol "Masuk"-nya kecil? Gimana tu bos?

    BalasHapus
  8. @blog download: memang mengikuti bentuk sidebarnya

    BalasHapus
  9. punya saya kok gak bisa langsung log in ke blogger... apa yang salah ya?

    BalasHapus
  10. Lebih unik kalo bisa di gunakan untuk semua mail atau multi input

    BalasHapus

 
Copyright © . Yoyok Rohani - Posts · Comments
Tanks to BT Designer · Blogger