Como convertir fotos en portada de revista
¿Quieres convertir una fotografía tuya en la portada de las revistas más famosas del momento? No hay problema.
Emezeta foto-revista es una aplicación web que se encarga de transformar la foto que selecciones en la portada de la revista que tu marques como opción.
Podrás elegir entra una amplia gama de revistas (que están en proceso de ampliación y acepto peticiones en los comentarios para ir aumentando la lista) para transformar la fotografía que desees y convertirte en el famoso de portada.
¡Además, esta aplicación web es la pionera en incorporar la primera edición impresa de menéame!
Gravatar: Imagen o foto en los comentarios
Muchas personas me han preguntado como pueden colocar una foto o imagen en los comentarios. Para ello sólo hay que registrarse en Gravatar.
Gravatar en realidad es un acrónimo, Globally Recognized Avatar que significa algo así como Imagen de reconocimiento global y sirve para identificarse en cualquier sitio que soporte este sistema.
Es un sistema muy ingenioso, puesto que evita la necesidad de múltiples registros (sólo lo haces una vez y sirve para todas las webs que lo integren) y protege la privacidad del usuario, puesto que usa el algoritmo MD5 para no dar a conocer el e-mail de usuario de ninguna forma (a no ser que el autor del blog o foro lo haga público por su propia cuenta) evitando así spam o mensajes no deseados.
PASO 1: Registrarse en Gravatar
Sólo tienes que acceder a la página Gravatar e introducir tu email y clave deseada en el siguiente formulario:
Ten presente que el registro es sensible a mayúsculas y minúsculas por lo tanto si te registras como PeriKo@palotes.com si luego vas a dejar un comentario deberás hacerlo exactamente con el mismo e-mail, periko@palotes.com o perikO@palotes.com no funcionaran.
PASO 2: Activar cuenta en Gravatar
Una vez realizado el registro, Gravatar te enviará un e-mail a tu cuenta de email para comprobar que es tuya. Basta con abrir el correo y hacer clic en el enlace del e-mail que recibirás.
PASO 3: Escoger nuestra imagen
En la zona Change your gravatar haremos clic en Examinar para escoger la fotografía que vamos a usar.
Es importante tener en cuenta que las imagenes deben estar en formato JPG, PNG o GIF y no ocupar más de 100kb de tamaño. Las transparencias en formatos GIF o PNG serán conservadas. El tamaño de dicha foto o imagen debe ser de 80 pixels de ancho y alto como máximo. Si una foto es más grande de esas dimensiones, será automáticamente redimensionada.
NOTA: Este proceso tarda un poco, ya que el servicio revisa todas las fotos para etiquetarlas de modo que sean aptas para todos los públicos, así que es probable que tarde algún tiempo.
PASO 4: Enlace a la imagen
Actualmente, Gravatar está implementado en una gran mayoría de blogs como por ejemplo minid, ALT1040 o servicios tan populares como meneame, de modo que si te registras y añades una foto, podrás ver tu foto en todos estos blogs. Además, también puedes usar el gravatar en foros de discusión u otros, ya que gravatar también te da el enlace de la imagen:
PASO 5: Añadir varios emails
Es posible, mediante el simple pago adicional de 5$ dotar a nuestro gravatar la posibilidad de insertar varias cuentas de email con la misma fotografía. Un pequeño detalle que no nos va a arruinar y ayudará a mejorar el servicio ;-).
Saludos y ¡Quiero veros a todos con Gravatar!
EDITADO: Hace algunos días, Liamngls había editado un manual sobre gravatar pero hasta la fecha de hoy no lo había visto...
Imagen al azar para nuestra web
Muchas personas me han preguntado como pueden hacer una cabecera de logotipo al estilo de Emezeta.com que vaya variando al azar, para mostrar una distinta en cada carga de la página.
Como ya es hora de dejar de hacerse el remolón, voy a intentar explicarlo de forma sencilla para que todos aquellos sin conocimientos de programación puedan usarlo en su web sin problemas.
Lo primero es tener las imagenes preparadas. Después de diseñarlas las ubicaremos todas en nuestra página web con un mismo nombre, pero variando el número del final: imagen1.jpg, imagen2.jpg, imagen3.jpg... Asi pues, éstas imagenes estarán disponibles en una hipotética dirección de nuestra web: http://www.paginaweb.com/img/imagenX.jpg.
PHP
Ya tenemos todo preparado, solo nos falta realizar el código para cargarlas aleatoriamente. El lenguaje HTML no nos brinda ninguna posibilidad para hacer esto, asi que necesitaremos otro lenguaje. El ideal -que la mayoría de servidores lo soportan- es el lenguaje PHP. El código sería algo tan sencillo como incluir el siguiente trozo de HTML:
<img src="http://www.paginaweb.com/img/mz/imagen<?php echo rand(1,3); ?>.jpg" alt="Pagina web">
Con este código estamos consiguiendo que se cargue una imagen al azar entre 1 y 3, es decir, imagen1.jpg, imagen2.jpg o imagen3.jpg. Solo debemos incrementar este número al de imagenes que tengamos.
Javascript
Pero puede ocurrir que nuestro servidor sea más decentito, y no tenga soporte de PHP. No hay problema, el javascript puede hacernos salir del paso ya que es un lenguaje a nivel de cliente y no de servidor como PHP, lo que significa que todo usuario con un navegador moderno lo podrá interpretar. Bastaría con incluir el siguiente código en la parte donde queremos ubicar la imagen:
<script type="text/javascript">
num = Math.round(Math.random()*3)
document.write('<img src="http://www.paginaweb.com/img/imagen' + num + '.jpg" alt="Pagina web">');
</script>
Este código realizado en Javascript, hace lo mismo que el anterior, con alguna diferencia aparente pero mismo efecto.
CSS
Por último, puede ocurrir que nosotros la imagen que queremos variar la tengamos incluida en un fichero CSS externo (hojas de estilo). En este caso tendremos algo parecido a esto:
En el fichero HTML:
<div id="logo"></div>
En el fichero CSS externo:
div#logo {
width : 500px;
height : 180px;
background : url(http://www.paginaweb.com/img/imagen1.jpg);
}
En este caso lo que haremos es combinar una de las dos opciones anteriores, pero con algunos cambios. Lo primero será buscar en el código HTML la sección de cabecera, (entre los tags head):
<script type="text/javascript">
num = Math.round(Math.random()*3)
document.write('<style type="text/css">');
document.write('div#logo { background: url(http://www.paginaweb.com/img/imagen' + num + '.jpg)!important }');
document.write('</style>');
</script>
Este último ejemplo -el más complejo- lo que hace es sobreescribir la hoja de estilo externa, generando automáticamente por javascript el código al azar necesario. Habría que andar cuidadosos con el nombre de la capa div (en este caso logo) que quizás se llame de otra forma, no sea una capa sino otro elemento, etc...
Espero que así haya echado una mano y sirva de ayuda a todos aquellos que le haya interesado el tema de colocar una imagen al azar en nuestra página web.
Páginas: 1
