Como agregar una marca de agua a las imágenes en WordPress
February 23, 2010 by Fedelosa · 8 Comments
Hace unos días me encontraba creando (que se note que no digo diseñando porque NO SOY diseñador) la web de una discoteca, para la que use WordPress como para casi todas las webs que armo, ya que lo encuentro sumamente flexible para crear cualquier tipo de sitio, no solo blogs.
En ese momento me surgió la inquietud de agregarle una marca de agua a las fotos de la disco. para de esta forma reforzar la marca y evitar plagios y difusión de las fotos en redes sociales, ya que en muchas de ellas (la mayoría) aparecerían rostros de personas. Probé varios plugins para WordPress pero ninguno me satisfizo, así que decidí que lo haría sin usar plugins. Luego de buscar alternativas y algunos códigos (tampoco soy programador), me encontré con que tenía dos maneras de lograr “imprimirle” marcas de agua a las fotos, sin contar claro esta, las alternativas offline como Photoshop y otros softwares específicos para esta tarea. Las dos alternativas eran:
1.- Modificar la foto original agregándole la marca.
2.- Dejar intacta la foto original y superponerle la marca solo cuando es necesario.

Por algún motivo me decidí por este último método que encontré en wpglamour.com, aunque luego Martín me explicó que era mucho mejor el primero, aunque tuviera que duplicar las fotos en el servidor para no perder las originales intactas, así que supongo que mas adelante cambiare el método y estaré publicando la nueva solución por aquí.
Superponer marca de agua
Debemos tener acceso al servidor donde esta hosteado nuestro blog, para poder editar en primer lugar el archivo .htaccess al que debemos agregarle la siguiente línea:
RewriteRule ^(.*)wp-content/uploads/(.*) $1watermark.php?src=wp-content/uploads/$2
Para que quede de esta forma:
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
RewriteRule ^(.*)wp-content/uploads/(.*) $1watermark.php?src=wp-content/uploads/$2
</IfModule>
# END WordPress
Lo que hace esa línea agregada al .htaccess es que cada vez que una imagen es llamada para mostrarse en el navegador, va a redireccionar ese llamado al archivo watermark.php que crearemos a continuación y que sera el encargado de superponer la marca de agua. En la raíz de nuestro sitio, en el mismo directorio donde estan wp-admin, wp-content, wp-config.php, creamos un archivo llamado watermark.php con el siguiente contenido:
<?php
$src = $_GET['src'];
header('Content-type: image/jpeg');
//this will prevent the watermark from showing up in the thumbnail images
if (eregi("150x150", $src)) {
$watermark = imagecreatefrompng('empty.png');
} else {
$watermark = imagecreatefrompng('watermark.png');
}
$watermark_width = imagesx($watermark);
$watermark_height = imagesy($watermark);
$image = imagecreatetruecolor($watermark_width, $watermark_height);
if(eregi('.gif',$src)) {
$image = imagecreatefromgif($src);
}
elseif(eregi('.jpeg',$src)||eregi('.jpg',$src)) {
$image = imagecreatefromjpeg($src);
}
elseif(eregi('.png',$src)) {
$image = imagecreatefrompng($src);
}
else {
exit("Your image is not a gif, jpeg or png image. Sorry.");
}
$size = getimagesize($src);
$dest_x = $size[0] - $watermark_width - 0;
$dest_y = $size[1] - $watermark_height - 0;
imagecolortransparent($watermark,imagecolorat($watermark,0,0));
imagecopyresampled($image, $watermark, $dest_x, $dest_y, 0, 0, $watermark_width, $watermark_height, $watermark_width, $watermark_height);
imagejpeg($image, "", 95);
imagedestroy($image);
imagedestroy($watermark);
?>
Una vez llegamos a este punto, debemos crear la marca de agua que queremos superponer, esto es muy fácil de hacer en Photoshop por ejemplo, por lo que no diré como hacerlo, tengan en cuenta hacerla lo suficientemente opaca como para que no sobresalga demasiado, pero que tampoco pase desapercibida.
Cuando tengamos pronta la imagen, la subiremos también a la raíz de nuestro blog, con el nombre watermark.png, y también debemos crear y subir, una imagen transparente de 1px x 1px con el nombre de empty.png
ESO ES TODO!! Cada vez que alguien solicite ver una imagen, esta se verá con la marca de agua superpuesta, y funciona incluso con el link directo a la imagen o sea que de esta forma quienes nos hagan hotlink de las fotos, se las llevaran con nuestra marca incluida
Sobrevivir gracias a la tecnología
February 5, 2010 by Fedelosa · 3 Comments
Cada vez mas nuestras vidas offline y online se mezclan y confunden, ya son varias las personas de mi generación que han hecho muchos amigos gracias a Internet, y seguramente las generaciones siguientes seguirán esta tendencia quizás hasta que un día la interacción social nazca exclusivamente por Internet.
Hace unos días se conoció el caso de un director de cine que fue rescatado en Haití gracias a su iPhone, Dan Woolley pudo sobrevivir gracias a una aplicación que le enseñaba primeros auxilios. Varias veces aunque en distintas condiciones me ha ayudado tener Internet en el celular, me he perdido en lugares desconocidos y he podido encontrar lo que buscaba gracias al GPS en el celular.
Ahora hace un par de días, un turista Alemán se perdió en el norte de su país mientras tomaba fotos del atardecer en St Peter-Ording, una zona totalmente cubierta de nieve, pero al ser una zona turística la municipalidad local tiene un sitio web con webcams que muestran al mundo el lugar. Por suerte una mujer que miraba el atardecer a cientos de kilómetros a través de la webcam, pudo observar que el hombre se encontraba perdido en la nieve, con lo que dio aviso a la policía quien pudo ayudarlo a salir del lugar.
Fuente: http://news.bbc.co.uk/2/hi/europe/8496586.stm
GPS Garmin con tu propia voz

Para los que como yo son usuarios de GPS Garmin, ya sea en el celular o con un GPS propiamente dicho, y además les gusta personalizar las voces con las que el equipo nos da las instrucciones de navegación, acá les traigo un regalito.
Garmin Voice Studio es un software para Windows, hecho por Garmin que te permite grabar tus propias voces para usar en tu GPS, ahora podrás cambiar la voz de tu GPS a lo que tu quieras.
Imágenes en movimiento en nuestro blog
January 22, 2010 by Fedelosa · 4 Comments
Si has llegado a este blog a través de un link roto, o queriendo encontrar una página que no existe, te habrás dado cuenta de la hermosisima (?) página de error 404 que tenemos, es muy fácil de lograr una página así, o hablando en serio, una linda página de error.
El efecto de las nubes moviéndose, inspirado en lo explicado por Gema, lo logramos fácilmente con un poco de código en la plantilla de nuestro blog:
Para que las nubes puedan moverse, debemos descargar jquery.easing.1.3.js y subirlo a nuestro servidor.
Agregar el siguiente código al header.php entre las etiquetas HEAD:
<script src='RUTA_DONDE_ALOJE_JQUERY/jquery.easing.1.3.js' type='text/javascript'/></script>
<script src='http://jqueryjs.googlecode.com/files/jquery-1.3.2.js' type='text/javascript'/></script>
<script type='text/javascript'>
$(document).ready(function() {
setTimeout("animation()",300);
});
function animation(){
nube1();
nubes2();
nubes3();
nubes4();
}
function nube1(){
$("#nube1").animate({left:"+=85%"},30000).animate({left:"-0px"}, 30000)
setTimeout("nube1()",5000);
}
function nubes2(){
$("#nubes2").animate({left:"+=85%"},40000).animate({left:"-0px"}, 60000)
setTimeout("nubes2()",5000);
}
function nubes3(){
$("#nubes3").animate({left:"+=85%"},50000).animate({left:"-0px"}, 40000)
setTimeout("nubes3()",5000);
}
function nubes4(){
$("#nubes4").animate({left:"+=85%"},60000).animate({left:"-0px"}, 50000)
setTimeout("nubes4()",5000);
}
</script>
Allí podemos jugar un poco con los valores para determinar la velocidad de movimiento de las nubes por ejemplo.
Agregamos lo siguiente a nuestro archivo de CSS:
#nube1{ position:absolute; top:220px; left: 0px; z-index:6; }
#nubes2{ position:absolute; top:300px; left: 0px; z-index:5; }
#nubes3{ position:absolute; top:380px; left: 0px; z-index:4; }
#nubes4{ position:absolute; top:470px; left: 0px; z-index:5; }
Y lo siguiente en donde queremos que se muestren las imagenes,
<div id="nube1"> <img src="RUTA_DONDE_ALOJAMOS_IMAGEN/nube1.png"/> </div> <div id="nubes2"> <img src="RUTA_DONDE_ALOJAMOS_IMAGEN/nube2.png"/> </div> <div id="nubes3"> <img src="RUTA_DONDE_ALOJAMOS_IMAGEN/nube1.png"/> </div> <div id="nubes4"> <img src="RUTA_DONDE_ALOJAMOS_IMAGEN/nube2.png"/> </div>
Las posibilidades son infinitas, solo queda jugar con la imaginación
Cómo conectar tu móvil a tu cuenta de Twitter
January 21, 2010 by Fedelosa · 9 Comments
Existen varias aplicaciones que nos permiten actualizar nuestra cuenta de Twitter vía SMS, pero todas ellas con números premium que cuestan mas de lo que cuesta un SMS común y corriente, en algunos casos no logro entender como es que sobreviven, dado que sale mas barato actualizar mandando un mensaje de texto a los numeros de Twitter directamente, para esto justamente, hace un mes publicaron un tutorial en Twitter explicando como hacer el proceso.

Es muy simple, y se hace todo desde el celular:
- Envía un mensaje de texto al +447624801423 con la palabra START
- Espera un par de minutos y luego envía tu nombre de usuario (sin @) al mismo numero
- Espera 2 minutos mas y envía tu contraseña
- Luego de un par de minutos, el ultimo paso sera enviar OK al mismo numero tambien
Aprende a hablar Na’Vi el idioma de Avatar
January 16, 2010 by Fedelosa · 3 Comments
![]()
Me encuentro en Chicageek con una interesante guía para aprender a hablar un idioma que no existe (?), si así como lo oyen (aunque en realidad no lo oyen, lo leen, a menos claro esta que estén leyendo el post en voz alta), pero volviendo al punto, el na’vi es un idioma artificial por llamarlo de alguna manera creado especialmente para la película Avatar que viene arrasando con todo en estos días, y como todo en esta vida tiene sus fanáticos, en este caso podrán aprender a hablar el idioma de la pelicula. No puedo dar detalles mas claros ya que aun no la vi, espero hacerlo en estos días, me la recomiendan?
La época de los e-books
January 5, 2010 by Fedelosa · 2 Comments

Desde hace poco menos de un año ha crecido la creación y distribución de libros electrónicos o e-books, y lo que mas abundan son tutoriales, en esta oportunidad les voy a presentar dos libros en español, uno llamado “Como hacer un buen blog“, escrito por Sergio de Actualidad y deporte y el segundo trata sobre Twitter, escrito por Juan Diego Polo de Wwwhatsnew.com y se llama “Twitter para quien no usa twitter“, este libro se puede descargar ahora gratuitamente desde Bubok.





