Se me pidió que realice un retoque fotográfico sobre una foto y pueden ver el antes y después en la imagen principal de ésta entrada. Me gusta jugar con Photoshop pero no soy un profesional de la materia por lo que quien sepa usar ésta herramienta como se debe sabrán marcarme los errores… siempre se aprende, ¿verdad?

Estimados escasos lectores en éste nuevo post les voy a mostrar un shortcode el cual les permitirá insertar mapas de google en las entradas o páginas de su blog en WordPress.

El código en cuestión es sencillo:

//  permite insertar mapa de google en entradas o páginas
function gmaps_sc( $atts, $content = null ) {
extract( shortcode_atts( array(
'width' => $width,
'height' => $height,
'latlon' => $latlon,
'zoom' => ($zoom) ? $zoom : 14
), $atts ) );

if ($width || $height || $latlon)
return "<iframe width='{$width}' height='{$height}' frameborder='0' scrolling='no' marginheight='0' marginwidth='0' src='http://maps.google.com/maps?q={$latlon}&amp;num=1&amp;ie=UTF8&amp;t=m&amp;z={$zoom}&amp;ll={$latlon}&amp;output=embed'></iframe>";
}
add_shortcode( 'gmaps', 'gmaps_sc' );

Ahora bien, cuando estén escribiendo una página o entrada, agregan el siguiente shortcode:

[+gmaps width="620" height="350" latlon="-54.791778,-68.245955" zoom="8"+]

Nota: quitar los símbolos “+” en el código anterior para que funcione.

Las opciones son las que ven:

• width, que define el ancho del mapa.
• height, define el alto del mapa.
• latlon, la latitud y longitud de la posición del mapa,
• zoom, que tan lejos o cerca se verá el objetivo. (opcional, por defecto: 14)

Hasta acá todo muy lindo, pero… ¿de donde capturamos la latitud y longitud?. Pues bien, acá los pasos:

1. Ingresan a Google Maps: maps.google.com
2. Buscan la locación en el mismo utilizando las opciones de desplazamiento y zoom.
3. En el mapa, click con el botón derecho del mouse y elejir la opción “¿Qué hay aquí?…”
4. Copiar las coordenadas arrojadas en el buscador del Google Maps.
5. ¡Voilá! Esas serán las coordenadas utilizadas en la opción “latlon” del shortcode.

Sencillo, ¿verdad?.

La historia de hoy se basa en un sueño; pero no uno cualquiera, sino uno de esos que se te hacen tan reales que al despertar sentís el corazón acelerado, tu cuerpo tiembla y aún corre adrenalina por todo tu ser. Básicamente el sueño se resume en un evento apocalíptico que no puedo dejar de imaginar tanto en sueño como en vida: el impacto de un asteroide contra la tierra. Siempre me pregunté como sería ésto y como reaccionaria ante tal desastre, la respuesta vino en forma de sueño.

Era un día normal, estábamos paseando con la familia (mi hno menor, mis viejos y otras personas que desconocía totalmente); charlas normales; situación normal; el paisaje no era del todo parecido a la ciudad pero tenía ese toque que me hacía sentir en mi hogar; en fin, todo muy lindo. De un momento a otro vemos una pequeña esfera de fuego que dejaba un rastro de humo en el cielo y que se dirigía tras las montañas, detrás del glaciar, para ser más específico; quedamos todos impactados por tal imagen, lo cual genero ojos y bocas abiertas sin emitir sonido alguno. Luego de esa roca cayeron más, pero ésta vez distribuidas por la ciudad. El daño que una roca causaba no era del todo catastrófico, pero en cantidades el panorama no era muy bueno. Luego de un par de impactos de estas piedras y de ver los rastros de humo que cruzaban el cielo, dirigimos nuestras miradas hacía el canal Beagle y vimos un asteroide tan inmenso en la distancia que realmente nos dejó atónitos; a esas alturas el miedo que corría por mi cuerpo era tan indescriptible que cada vez que me acuerdo se me eriza la piel. Éste asteroide también se dirigía detrás del glaciar Martial, pero a diferencia de las pequeñas rocas anteriores, éste impactó contra dicho glaciar. Al momento de su impacto, todos atinamos a hacer lo que todo ser vivo hace cuando una amenaza mayor se acerca: nos cubrimos y tiramos lo más al piso que pudimos dentro del auto. Todo se iluminó. Escombros, polvo, árboles; todo volaba a nuestro alrededor. Nuestro auto, al igual que barco de papel, fue empujado varios metros para por último terminar retenidos por una casa.

Luego de unos instantes, y viendo que aún seguíamos con vida, nos levantamos; el escenario era de lo peor: el cielo negro tapado por el humo de los incendios distribuidos por la ciudad más los restos de polvo suspendidos en el aire por el impacto del asteroide. Era terrible, no podía creerlo, todo mi ser desearía que fuese un sueño, pero no, estaba ahí, viviéndolo. Salimos del auto con heridas leves y casi instintivamente nos programamos para sobrevivir; si, de ésto se trataba: sobrevivir. Junto a mi familia comenzamos a correr por las calles mientras mirábamos constantemente hacia arriba para evitar el impacto de más rocas que continuaban cayendo del cielo. Cuadras más adelante, mientras corríamos dentro un barrio parecido a los Intevu pero con departamentos parecidos a las 245, uno de éstos departamentos se desploman frente a nosotros dejándonos a mi hermano conmigo de un lado y a mis padres, del otro. Desesperados y con miedo, decidimos armar un plan de escape. La idea era básica, buscar provisiones, mientras rodeábamos el edificio que nos separó de nuestros padres deseando que aún se encuentren cerca, y tratar de encontrar un lugar retirado de la ciudad tranquilo y que no se encuentre afectado por los desastres ocurridos frente a nuestros ojos: playa larga fue nuestra primera opción, pero lamentablemente no podíamos ver la situación del lugar puesto a que el humo a nuestro alrededor era tan intenso que la visibilidad era muy pobre. Así fue como decidimos continuar según lo planeado y mientras corríamos por nuestras vidas, no pude dejar de pensar en cuestiones personales. En vida suelo pensar que todo ésto del vivir está sobre valorado, pero en ese momento lo único que buscaba era poder sobrevivir. También apareció el sentimiento de preocupación por mi familia, deseaba poder encontrarlos, mientras que con mi hermano menor sentí esa necesidad de no derrumbarme y hacerle saber que todo iba a salir bien. Mis amigos se hicieron presente también. Sabía que, al igual que ellos, cada uno buscaba el bienestar de los suyos, pero me fue inevitable pensar en ellos y desearles lo mejor. Sin dudas el amor también tuvo su momento; no dejaba de pensar en si nos volveríamos a ver, y de lo idiota que fui de no haber dicho nunca lo que sentía.

Despierto de esa tragedia y por un momento fui optimista. Veía todo de otra manera, la vida tenía un buen sabor; el aire limpio; mi cama semi desordenada con la cual me sentí tan a gusto; mi vieja trabajando; Antay y Juje (mis dos amigas canes); Mi viejo, mis hermanos y sus familias; Mis amigos; Ella; Todo tenía tanto sentido, y  muy en el fondo creo que aún todo tiene sentido.

Quería compartir ésto con ustedes, pues sobreviví a una tragedia que me fue tan real y que de cierta forma hizo un click en mi subconsciente; de allí, comienza un gran cambio.

- “¿ Y por qué…”, hace una pausa, mientras se servía un trago de whisky – “… crees haberlo estado?”. Relajado y en confianza con las sombras de mi cuarto contesto, como si casi estuviese confesando un secreto – “Pues… esa sensación de felicidad, ya sabes, el placer que se siente en alma y cuerpo cuando se está con otra persona; poder mirarle a los ojos y no pretender más que el tiempo no corra y permanecer uno al lado del otro; sentir la calidez y suave aroma del cuerpo de tu pareja…”. – “Querer que el tiempo no corra”, me interrumpe – “… es no querer evolucionar; aprender; vivir; experimentar… con esa persona…”. – “Supongo…”, interrumpo y continúo – “… pero creo que cuando dos personas comparten ésto que planteo, no se trata de algo tan físico como suena… el evolucionar; aprender; etc… es algo de mente y cuerpo…”. Levanta la mirada y entrecierra los ojos como si varias ideas ocupasen su cabeza y solo pregunta – “¿Te refieres a algo más espiritual?”. – “¡Claro! Bah, por así decirlo”, concluyo sin mucho entusiasmo, como si no creyese en lo que yo mismo sugería. Aguardamos un momento en silencio mientras repensabamos lo charlado y buscábamos como volver a la conversación. Me sirve un trago y, al terminar de hacerlo, vuelve su mirada a mí y pregunta – “Entonces crees que el amor se trata sobre algo más espiritual pero a su vez necesitas estar físicamente junto a la persona que ‘ames’”. Pienso unos instantes mientras bebía un trago. Miro alrededor como si fuese a hallar una respuesta entre las sombras de mi habitación – “Digo… sin dudas necesitamos de lo físico…”, no conforme con la respuesta, agrego – “…  aún seguimos siendo personas físicas, necesitamos satisfacer las necesidades de mente, corazón y eso…”. Dirijo mi mirada hacia el, pero su sombra había desaparecido. De cierta forma la charla me dejó tranquilo, pues veía un lado de mí que desconocía.

Viktor Hugo Morales
Jueves 19 de Enero del 2012, 1:27hs

De alguna u otra forma todo tiene un final, todo termina, y así fue como se acabó el 2011 y muchos cerramos ese lapso de tiempo como si de un cajón se tratase y lo archivamos en un nuevo estante. De las cosas que quedaron archivadas en ese cajón, muchos archivos fueron cerrados y muchísimos otros aún quedan pendientes.

No me quejo de mi 2011, pero tampoco voy a decir que fue uno glorioso por que estaría mintiendo. En lo profesional, año tras año sigo aprendiendo, creciendo, y eso es algo muy positivo ya que me permite mejorar el servicio de diseño y desarrollo web; en lo personal, el año lo finalicé sin mi familia quienes se fueron de vacaciones y yo me quedé por decisión propia. Pero por otro lado, a las cenas de las fiestas y los respectivos brindis los pasé con Diego y su familia (a quienes agradezco por haberme hecho un lugarcito entre ellos) para  luego continuar brindando y bailando con amigos y bailando.

Debo agradecer a Germán (hermano mayor de Diego) que nos permitió ocupar su departamento en navidad para delirar y, melón de por medio, bailar y pasar un buen rato. Terminamos relativamente temprano, a las 8am nos encontrábamos con Diego en la plaza, frente a su departamento, hablando sobre la vida… y después, o antes, fuimos para mí casa… y… no, nada… no recuerdo.

Para comenzar el año, comenzamos la movida en el departamento de Diego y luego, después de unas vueltas y visitas a varios lugares tarde por la madrugada, terminamos en el boliche local que acostumbramos. Lindo amanecer. La movida terminó tipo 12 del medio día cuando acompañé a mi prima a su casa, después de haber estado jugando al Halo 3 para xbox junto a Jazmín, con quién, de hecho, finalizamos la historia de dicho juego… y no recuerdo nada pues mi estado no era el óptimo.

Obvio que para el cierre, hay que terminar con la misma cursilería de siempre, como para darle ese toque meloso al post. Puedo decir que conocí gente nueva y de ellos han quedado aquellas con las cuales realmente compartimos buenos momentos, ya sea en ámbito laboral, amistades de amigos, gente de la vida.

De la gente que ya conocía, mis amigos siguen compartiendo los limes día a día y agradezco eternamente que aparezcan cuando menos se los necesita

Obvio que también a quienes conocí en ámbito laboral, hoy son parte de un circulo más cercano y también compartí momentos muy lindos.

Ni piensen que voy a nombrar uno por uno por que ni garpa, ustedes saben.

Un año nuevo comenzó y para no pasar “prometiendo” nada, voy a callar y me voy a limitar a actuar… así que agárrense (¿?).

Gracias a todos por haber compartido un lindo año. ¡Hasta el próximo! (que ya arrancó).

Quizás se les habrá planteado más de una vez poder utilizar códigos javascript en sus páginas y/o entradas de WordPress pero nunca pudieron y huyeron buscando otra solución. Ésto me pasó hace poco y en lugar de esquivar éste problema, como lo hice en veces anteriores, se me dio por buscar una solución y me volví a topar con la magia de los shortcodes.

Para lograr agregar códigos javascripts en las páginas o entradas:

1. Agregar el siguiente código en el archivo functions.php

   function vhm_sc_html( $atts, $content = null ) {
   $str1 = array("<", ">", '&', ''', '"','<', '>', "”", "″");
   $str2 = array("<", ">",'&','\'','"','<','>', '"', '"');
   $content = str_replace($str1, $str2, $content); return $content;
   }
   add_shortcode( 'html', 'vhm_sc_html' );

2. Ahora en las páginas o entradas, y donde queramos que haya código javascript, hay que encerrar el mismo en las etiquetas “[ html ] [ / html ]” (sin espacios)

Ahí la solución, sean creativos.

De pronto se me viene a la mente, mientras escuchaba una suave lluvia de fondo, tener la posibilidad de encolumnar información en las páginas o entradas de un blog en WordPress. Ante ésta inquietud, pienso unos instantes:

Mediate CSS podría hacer que los items de las listas dentro del post tengan el atributo “float: left” y con un ancho específico. Ésto haría lo que necesito.

Entonces empiezo a trabajar con el código CSS

.clear { clear: both; }
.post ol { margin: 0 auto; padding: 0; list-style-type: none; }
.post ol li { float: left; width: 300px; }

Luego, en la entrada o página, creo una lista y ¡Voilá! Me crea las columnas.

Esto resultaría según lo esperado, el problema es que nunca podría crear una lista normal, ya saben, una lista en la que quiera listar – valga la redundancia –  productos, servicios, o lo que fuese. Entonces descarto ésta opción.

Pienso un poco más y me acuerdo de los “shortcodes” de wordpress:

¡Ah! Cierto que introdujeron los Shortcodes desde wordpress 2.5 que son un set de funciones para crear macro códigos para usarlo en los contenidos de páginas o entradas.

Empiezo a estudiar sobre como crear shortcodes usando la guía oficial de wordpress. Error va, error viene, me topo con la solución:

1. Crear un archivo .php y guardarlo en una carpeta del theme (plantilla). Para éste ejemplo yo cree “shortcodes.php” y lo guardé en la carpeta “incs” dentro de mi plantilla.
2. Copiar y pegar el siguiente código dentro del archivo creado en el paso anterior:

   // [cols] crea una capa <div> con la clase "cols" function
   vhm_sc_cols( $atts, $content = null ) {
   return '<div class="cols">' . do_shortcode($content) . '</div><div class="clear"></div>';
    }
    add_shortcode( 'cols', 'vhm_sc_cols' );
   

3. Abrir el archivo “functions.php” y añadir el siguiente código:

   include(TEMPLATEPATH . '/incs/shortcodes.php'); // Recuerden cambiar /incs/shortcodes.php por la ruta de su archivo.
   

4. Ahora vamos con el código CSS

   .cols ol { margin: 0 auto; padding: 0; list-style-type: none;  }
   .cols ol li { float: left; width: 300px; margin: 0 2px; }
   

Ya con ésto tenemos todo listo. Ahora vamos a crear una nueva página o entrada en wordpress y en un párrafo a parte, donde queramos encolumnar la información:

1. Iniciamos la etiqueta [cols].
2. Clickeamos el botón de “Lista sin ordenar (Alt + Shit + U)” del panel de botones del editor de texto.
3. Escribimos la información en cada item, los cuales harán las veces de columnas – ver CSS -.
4. Cerramos la etiqueta [/cols]

Al publicar ésta entrada o página y verla en funcionamiento, debería funcionar sin problemas – ver la imagen del post para apreciar el ejemplo -

En un nuevo trabajo con un cliente me surgieron más inquietudes/soluciones que de seguro las iré compartiendo.

Hace un tiempito decidí cambiar el theme de mi web por uno más acorde a las fechas que se nos aproximan: Navidad y año nuevo. Empiezo a jugar con Photoshop y termino en una idea que me gustó bastante y era momento de empezar a recortar elementos y ubicarlos en HTML y CSS… hasta acá todo lindo. La duda existencial se me plantea cuando comienzo a trabajar con la imagen de fondo: ¿Podré utilizar una imagen de fondo que ocupe toda la pantalla sin dejarme espacios en blanco? Probando posicionamientos con varias imágenes en CSS y demás, concluyo en buscar por internet la solución y caigo con la magia de “background-size”

El uso es sencillo y derecho a lo que nos interesa:

html {
background: url(images/bg.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

No hay mucho para explicar, éste código, así como lo ven, está preparado para trabajar en:

• Safari 3+
• Chrome
• IE 9+
• Opera 10+
• Firefox 3.6+

Y algunas de las ventajas:

• Llena la página con la imagen, sin espacios en blanco,
• Escala la imagen sin importar el monitor,
• Mantiene las proporciones de la imagen,
• La imagen se centra,
• No produce las barras de desplazamiento.

Una técnica ultra sencilla y de la mano de puro código CSS.

A mí me sirvió y es la técnica que actualmente utilizo en mi plantilla.

Viktor Hugo Morales
Domingo 11 de Noviembre del 2011, 18:29hs