Crea un panel de acceso en tu blog de Blogger

Blogger Publicado por Claudia en Junio 25, 2009

BoyProdx (vía Viet Blog Guide) nos enseña a añadir un sencillo widget de acceso/login para los blogs de Blogger, similar en apariencia a los que podemos poner en WordPress.

El código, para el widget en español, sería:

<div id="loginform"><form action="https://www.google.com/accounts/ServiceLoginBoxAuth" method="post" onsubmit="onlogin()">
<input value="http://draft.blogger.com/loginz?d=%2Fhome&p=http%3A%2F%2Fdraft.blogger.com%2F" name="continue" type="hidden"/>
<br/>
<div>
<label for="Email"> Cuenta: 
<br/><input id="Email" tabindex="1" name="Email" size="20" type="text"/>
</label>
</div>
<br/>
<div>
<label for="Passwd"> Contraseña: (<a href="https://www.blogger.com/forgot.g" target="_top" title="Olvidé mi contraseña">?</a>) 
<br/>
</label>
<input id="Passwd" tabindex="2" autocomplete="off" name="Passwd" size="20" type="password"/>
</div>
<br/><br/>
<input id="signin-btn-ns" tabindex="0" value="Enviar" class="ubtn ubtn-block" name="submit" type="submit"/>
</form></div>

Debes pegar digo código en en un nuevo gadget de HTML/Javascript de la sección Diseño/Elementos de tu blog. Si quieres darle un poco más de “estilo”, puedes añadir un poco de CSS básico a tu plantilla:

#Email, #Passwd{
border: 1px solid #ff0084;
}
 
#signin-btn-ns { 
color: #FFF;
background: #FF55AA;
border: 1px solid #ff0084;
}

¿Simpático? A mí me parece una monería, pero puede ser bastante útil además de cómodo. El formulario trabaja en base al panel de acceso de Blogger, y como es posible darse cuenta, redirecciona al panel de Blogger in Draft. Ahora, si lo que quieres es que te lleve al panel tradicional de Blogger, deberás cambiar la url del input escondido que hace la redirección (mira el código del widget), quitando los dos “draft.” que aparecen allí para que en vez de ir a draft.blogger.com vayas a blogger.com.
Si no pudiste acceder a tu cuenta, ingresa tu e-mail de Gmail en “Cuenta” y tu contraseña en los campos correspondientes. Es un formulario que puedes usar tranquilamente, porque no almacena tus datos de acceso.

Compártelo!
  • Pingback: Bitacoras.com()

  • Excelente widget!
    Ya lo he agregado a mi blog 😀
    Muchas gracias, Claudia!

  • Céfiro

    Tengo una interesane pregunta, digamos que quiero utilizar este widget para, por ejemplo poner un acceso a una parte restringida de una web o para acceder a una simple página donde la gente puede hacer alguna acción. ¿Se podría hacer? ^_^ .

    Un abrazo y me encanta tu trabajo

  • Alo!

    Algo así andaba buscando, me hubiera gustado mas en forma horizontal jejeje

    una duda, donde pego el codigo

    #Email, #Passwd{
    border: 1px solid #ff0084;
    }

    #signin-btn-ns {
    color: #FFF;
    background: #FF55AA;
    border: 1px solid #ff0084;
    }

    gracias de antemano, por cierto, ya vote por ti en Señorita Twitter 😀 tu vas a ganar!!!

  • Claudia

    @Viry: Wow, quedó bien! 🙂

    @Céfiro: Lamentablemente, no puedes hacer eso en Blogger :(. Gracias por el abrazo, seguro me llega 😉

    @Isaías: Mira tu plantilla (Edición de HTML). Verás muchos códigos parecidos a esos. Añade esos ahí, al final de los demás códigos del mismo tipo o antes de body {. Muchas gracias por el voto (jeje :P).

  • Pingback: Crear un acceso al panel Blogger directamente en la plantilla | Blogs Bazaar()

  • Hola Claudia quiero felicitarte por este post me ha sido de gran ayuda para mis blogs.

    Soy un fiel seguidor de tu blog me sorprende que alguien tan joven y linda sea tan buena blogger.

    Esto le facilitara la vida a los que participan en mi blog de http://www.corporativa24.com y mi nuevo blog yo invent.

    De verdad mil gracias ya iba a hacer una huelga a blogger por que me encanta el panel de wordpress jeje

  • uhhhhhhhh quiero aplicarlo pero quiero ponerlo no como elemneto elemento de pagina si no dentro de la plantilla, se puede entre que etiquetas tengo que hacerlo disculpa????

  • Claudia

    Palmo: Depende del lugar de la plantilla donde lo quieras poner 😉

  • Alicia

    Una pregunta, cómo puedo hacer para qu cuendo entre la pgina de blogger se abra en una nueva ventana o pestaña?

    Gracias por todo

  • Una pregunta, como te registras ?…

  • hola komo estas

  • q vio

    q voleta de parsonas en ese blog especialmente claudia0

  • Not Found
    Error 404

    al poner el codigo quite draft.

    y con el igual marca ese error de google?
    26 julio2011

  • Leo.

    Se agradece muy buen aporte. xD

  • Martacv84

    Buenos días, es posible que este código ya no funcione?? Cuando entro con mi cuenta sale Page not found. Que ocurre?

    Gracias un saludo

  • Maxwellcordero

    hola tengo una duda es cierto que para crear un menu desplegable tengo que tener otras cuentas de blogger?? es que quiero que mi blog tenga aparte la seccion para ver videos informacion u otra cosa para no verlo todo junro

  • diego

    oie cuando pongo la contraseña y el nombre entro y despues me sale una pag ke dise error 404 porke?

  • HOLA, #Email, #Passwd{
    border: 1px solid #ff0084;
    }
    #signin-btn-ns {
    color: #FFF;
    background: #FF55AA;
    border: 1px solid #ff0084;
    } se coloca antes de la etiqueta ]]>

  • Jessy

    Niko, (xologin.blogspot.com), muy interesante tu blog, intente acceder desde tu panel de acceso y el comentario tuyo de arriba funciona perfectamente, agan lo que dice él, funciona fantástico!!!

  • Jessy

    Ha, una pregunta, ¿el botón submit que dice Enviar se puede cambiar por una imagen?, como por ejemplo esta: http://2.bp.blogspot.com/-NozViwg8uq8/UqgJGg24q7I/AAAAAAAAAKI/NpRm9Thf1pw/s1600/button.png o esta: http://4.bp.blogspot.com/-5SUOyRMTCGM/UqgJIanYRiI/AAAAAAAAAKQ/h292mPV2Emc/s1600/button+(1).png