lo primero que necesitamos es diseñar nuestro boton, una vez terminado lo almacenaremos ya sea en photobucket, blogger u otros servidores, ahora el codigo:
<a href="URL DE LA PAGINA A LA CUAL TE DIRIGIRA"><img style="display: scroll; position: fixed; top:0px; left: 320px;" src="URL DE TU IMAGEN" ></a></div>este codigo es el mas sensillo, las propiedades que aqui vemos son:
href: url a la cual seras dirigidoAhora si queremos que al pinchar se abra en una ventana emergente o Pop-up agremaremos el siguiente codigo a href
style: propiedades de la imagen
position: posicion
top: la altura a la cual estara la imagen
en este caso podemos cambiarlo a bottom, si deseas que este debajoleft: a que distancia del lado izquierdo
esta propiedad tambien puede cambiar a right si lo queremos a la derechasrc: url de la imagen
<a href="http://www.blogger.com/follow-blog.g?blogID=6641XXXXXXXXXXX"target="_blank" onClick="window.open(this.href, this.target, 'width=500,height=400,top=200px,left=300px'); return false;">Las propiedades utilizadas son:
target_blank : abre el link en otra ventanaasi pues nuestro codigo completo quedaria de la siguiente forma:
onClick: al hacer click que es lo que hara
width: el ancho de la ventana pop-up
height: la altura de la ventana
left: la posicion de la ventana
<a href="URL DE LA PAGINA"target="_blank" onClick="window.open(this.href, this.target, 'width=500,height=400,top=200px,left=300px'); return false;">
<img style="display: scroll; position: fixed; top:0px; left: 320px;" src="URL IMAGEN" ></a></div>Si como yo quieres que el boton te envie a la pagina de subscripcion de blogger solo necesitaremos este link y la ID de tu blog.
http://www.blogger.com/follow-blog.g?blogID=66615XXXXXXXla ID la puedes encontrar facilmente al momento de hacer una entrada, editar tu plantilla y demas:
Ejemplo
<a href="¿donde lo coloco?
http://www.blogger.com/follow-blog.g?blogID=66615XXXXXXX"target="_blank" onClick="window.open(this.href, this.target, 'width=500,height=400,top=200px,left=300px'); return false;">
<img style="display: scroll; position: fixed; top:0px; left: 320px;" src="http://4.bp.blogspot.com/AAAAAAAAA3U/i_Boi/XXX/ejemplo.png"></a></div>
Bueno yo lo coloque antes de las etiquetas
</body>
</html>
que viene siendo al final.
Si tienen dudas, errores o sugieren una forma mas sensilla no duden en comentar
Post a Comment