Primero hay que elegir el lugar en que queremos que aparezca nuestra caja con los botones de smileys, por ejemplo en el comments.php usualmente hay una parte comentada con el siguiente código html:

<!--<p><small><strong>XHTML:</strong> <?php printf(__('You can use these tags: %s'), allowed_tags()); ?></small></p>-->

Podemos incluir nuestras Smileys debajo de este texto, de la siguiente manera:

<!--<p><small><strong>XHTML:</strong> <?php printf(__('You can use these tags: %s'), allowed_tags()); ?></small></p>-->

 <div id="smileys">
 <?php $caritas="http://www.geeklion.com/leon/wp-includes/images/smilies/" ?>
 <a href="javascript:carita(':)')"><img src="<?php echo $caritas ?>icon_smile.gif" alt="sonrisa" /></a>
 <a href="javascript:carita(':(')"><img src="<?php echo $caritas ?>icon_sad.gif" alt="triste" /></a>
 <a href="javascript:carita(':D')"><img src="<?php echo $caritas ?>icon_biggrin.gif" alt="contento" /></a>
 <a href="javascript:carita(':P')"><img src="<?php echo $caritas ?>icon_razz.gif" alt="lengua" /></a>
 <a href="javascript:carita(':o')"><img src="<?php echo $caritas ?>icon_surprised.gif" alt="sorprendido" /></a>
 <a href="javascript:carita(';)')"><img src="<?php echo $caritas ?>icon_wink.gif" alt="guiño" /></a>
 <a href="javascript:carita(':cry:')"><img src="<?php echo $caritas ?>icon_cry.gif" alt="llorar" /></a>
 <a href="javascript:carita(':cool:')"><img src="<?php echo $caritas ?>icon_cool.gif" alt="cool" /></a>
 <a href="javascript:carita(':lol:')"><img src="<?php echo $caritas ?>icon_lol.gif" alt="lol" /></a>
 <a href="javascript:carita('x3')"><img src="<?php echo $caritas ?>icon_x3.gif" alt="x3" /></a>
 <a href="javascript:carita(':3')"><img src="<?php echo $caritas ?>icon_tierno.gif" alt=":3" /></a>
 <a href="javascript:carita('T_T')"><img src="<?php echo $caritas ?>icon_T_T.gif" alt="T_T" /></a>
 <a href="javascript:carita('xD')"><img src="<?php echo $caritas ?>icon_xD.gif" alt="xD" /></a>
 <a href="javascript:carita(':neutral:')"><img src="<?php echo $caritas ?>icon_neutral.gif" alt="neutral" /></a>
 </div>

Como en ese ejemplo podemos agregarle un id al div por si deseamos agregarle algún estilo a nuestra caja con los botones de smileys. Use un poco de PHP para no escribir toda la url de la localización de los iconos gestuales, en su caso tendrían que editar la variable $caritas=”SU_URL_DE_WORDPRES/wp-includes/images/smilies/”.

El código que he puesto arriba es el que uso para mi caja, pero por ejemplo “icon_tierno.gif”, “icon_T_T.gif”, entre otros no aparecen por default en WordPress. Pueden checar mi otro post sobre Edición de Smileys para información sobre los directorios y cambios que pueden hacer a los smileys.

Ya que tienen este código solo queda agregar unas cuantas lineas de javascript en el header.php de este modo:

<script type="text/javascript">
function carita(texto){ document.getElementById('Formulario').comment.value=document.getElementById('Formulario').comment.value+texto; }
</script>

Deben poner atención en el id que tengan en su formulario en el comments.php, por ejemplo si su form tiene como id “Formulario”, entonces en su javascript debe de decir getElementById(‘Formulario’) tanto antes del signo de igual como después, y luego seguido del punto el name del textarea en mi caso comment también tanto antes como después del signo de igual.

RewriteEngine On
RewriteRule ^([0-9]+)$ ?p=$1 [R=301,L]

De este modo podrán acceder mediante una URL corta a cada Post del blog, tendrá el formato de www.sitioweb.com/ID_del_post, esto es muy útil por ejemplo para usarse en Twitter, ahora solo tenemos que agregar esa URL Corta a nuestro tema, colocamos el siguiente código:

Link Corto: <?php bloginfo('url'); ?>/<?php the_ID(); ?>

en donde deseamos que se muestre pero debe de estar dentro del código del post para que obtenga el ID del post, por ejemplo dentro de el Loop que es el ciclo que muestra cada post podríamos ponerlos antes de cada cierre del ciclo que usualmente termina con un:

<?php endwhile; ?>

Y con esto se imprimirá la URL Corta en cada Post, por ejemplo en este post es http://www.geeklion.com/719 .

Primero descargamos la versión mas reciente de la Página de XAMPP (click para ir a la página). Posteriormente descomprimimos en el directorio /opt, supongamos que al abrir la consola estamos en la carpeta de tu usuario /home/tu_usuario, debemos posicionarnos en el directorio en el que se descargo XAMPP, supongamos que esta en Descargas y que la versión es 1.7.3a, escribimos lo siguiente:

cd Descargas
sudo tar xvfz xampp-linux-1.7.3a.tar.gz -C /opt

Si esta en otro directorio debemos posicionarnos en dicho directorio y posteriormente descomprimir, si la versión es otra diferente a la 1.7.3a lo indicará en el nombre, así que solo sustituimos 1.7.3a por la versión indicada en el nombre justo entre xampp-linux- y .tar.gz

Una vez terminado el proceso de descompresión ya podremos iniciar el LAMPP de este modo:

sudo /opt/lampp/lampp start

y administrar MySQL por consola de este modo:

sudo /opt/lampp/bin/mysql -u el_usuario -p

(el_usuario por default es root y de contraseña solo den enter no tiene ninguna asignada por default)

ya con esto podrán iniciar LAMPP y Administrar vía consola MySQL pero si queremos acortarlo podemos agregar los directorios /opt/lampp y /opt/lampp/bin a la variable $PATH permanentemente así:

sudo su -
echo 'export PATH=$PATH:/opt/lampp:/opt/lampp/bin' >> /etc/profile

luego cerramos la terminal, la volvemos a abrir y ahora ya podemos iniciar de este modo LAMPP:

sudo su -
lampp start

Y de esta manera MySQL:

mysql -u usuario -p

De hecho con el directorio /opt/lampp/bin que agregamos a $PATH podremos abrir directamente los otros ejecutables del LAMPP además de MySQL.

Una vez que esta ejecutándose LAMPP podemos acceder a nuestro servidor para ver los archivos escribiendo en el navegador localhost o 127.0.0.1. Para agregar o eliminar archivos lo hacemos en el directorio /opt/lampp/htdocs, pero por default y seguridad necesitas acceder como ROOT al directorio. Otra forma de administrar los archivos sería vía FTP escribiendo como dirección localhost con el usuario nobody por default y contraseña lampp por default.

Al acceder mediante el navegador a localhost entrarás directamente a la administración de XAMPP, si gustas puedes mover el contenido que esta en la carpeta /opt/lampp/htdocs al subdirectorio /opt/lampp/htdocs/xampp y de este modo poner tus archivos en /opt/lampp/htdocs como tu propio index sin que entre al panel de administración de XAMPP al escribir localhost. De este modo si quieres acceder al panel de administración solo escribes en el navegador localhost/xampp o 127.0.0.1/xampp. O si gustas puedes dejar las cosas como están y crearte una carpeta diferente para cada uno de tus proyectos por ejemplo: /opt/lampp/htdocs/nombre_de_la_nueva_carpeta y acceder a su contenido en el navegador escribiendo localhost/nombre_de_la_nueva_carpeta o 127.0.0.1/nombre_de_la_nueva_carpeta.

Ahora mismo debería de visualizarse bien al menos en Firefox (Ubuntu y Windows), Google Chrome y Chromium (Ubuntu), e Internet Explorer 8 (Windows) que es donde lo he probado y me han pasado screenshots para ver que funcione correctamente, el sitio sigue los estándares del W3C para el !Doctype XHTML Estricto. Este diseño es líquido con ancho máximo de 1350px (después de eso aparece centrado), anchos mínimos de 780px (menores ya aparece barra de desplazamiento). Para límites se usaron medidas absolutas pero en lo demás se trato de usar medidas relativas de modo que es un diseño líquido-elástico con anchos máximos y mínimos estáticos xD lo cual puede ser un poco confuso, el punto es que se auto-ajusta al tamaño del monitor.

Lo estructuré de tal manera que aún sin CSS sea legible el sitio (o al menos eso creo) por cualquier cosa .

La fuente que debe de visualizarse es Ubuntu sin embargo al parecer en Windows muestra la Helvética (solo si la tienen instalada) o en su defecto Lucida Sans Unicode, y si no esta incluida entonces Sans-Serif. Al parecer aún batallaré para arreglar esto en Windows pero por lo menos en Ubuntu ya debe de verse bien. Espero les guste y cualquier sugerencia es bien recibida y será evaluada para ver si se edita más el theme.

Un screenshot desde Ubuntu (denle click para verla grande):

Click en la imagen para no quedar ciego

Otra comunidad a la que me acabo de unir recientemente es la Comunidad de Programadores de PHP, el sábado pasado se realizó la primera reunión de Programadores PHP, toda persona interesada en PHP puede unirse a la Comunidad de Programadores PHP, no es necesario que sean programadores, simplemente con que estés interesado en formar parte de la comunidad aunque no sepas mucho de PHP o realmente no sepas, por ejemplo también se han unido diseñadores a la comunidad y esto nos ayuda a complementar el trabajo del programador proporcionando por ejemplo logos y una mejor interfaz para un determinado sistema, elaboración de plantillas, iconos, etc. Aquí les dejo el link a la página de la Comunidad de Programadores de PHP, el twitter de la comunidad @ProgramasPHP y el twitter del fundador de la comunidad @pronuer. Por último hay que mencionar que estaremos trabajando en la creación de un CMS para el portal de la Comunidad de Programadores PHP, este CMS se llama Nazep, mediante el cual es gestionado el contenido de la página de Programadores PHP. Se estarán realizando cambios para el registro de usuarios en el Portal, rediseño de las plantillas y el sistema, etc. Aquí el link de la página de Nazep

Primero que nada debes de crear una página en facebook para que a la gente le pueda gustar (click aquí para ir a facebook a crear tu página).

Ya que tienes tu página en facebook podrás insertar tu botón de me gusta, para esto te proporcionan 2 maneras para insertarlo:

• Con un trozo de código que usa iframes que es una forma medio invasiba para el sitio y además los spiders y bots que indexan tu sitio pueden tener problemas por lo mismo del uso de iframes.
• La otra es integrar una etiqueta propia que hizo facebook pero para esto además debes de incluir un javascript para que funcione correctamente

La solución para tener un buen código es hacer unas pequeñas modificaciones al primer código, en lugar de usar un iframe usaremos la etiqueta object. Click aquí para ir a la página de facebook por tu código del botón Like (me gusta).

Al proporcionar los datos para la creación de tu botón te pide “Facebook Page URL” esto es la “Dirección de tu página de Facebook” la cual tiene un formato como este:

http://www.facebook.com/pages/[Nombre-de-tu-pagina]/[numerote enorme]

Por ejemplo la mía es:

http://www.facebook.com/pages/Web-de-Leon/155393707821925

Una vez que introduces todos tus datos solo das click en Get Code y ahora solo copias el código del iframe (el primero que sale, el de arriba).

El código del iframe tiene el siguiente formato:

<iframe src="[dirección larga como del tamaño del universo en milímetros]" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:[ancho en píxeles]; height:[alto en píxeles];" allowTransparency="true"></iframe>

Acomodamos en la etiqueta object los valores de la siguiente manera. El src del iframe osea [dirección larga como del tamaño del universo en milímetros] en el atributo data y el style es mas o menos el mismo, solo hay que poner [ancho en píxeles] y [alto en píxeles] de acuerdo a el espacio que le vayamos a dar, les muestro el nuevo formato:

<object style="border:none; overflow:hidden; width:[ancho en píxeles]; height:[alto en píxeles];"  data="[dirección larga como del tamaño del universo en milímetros]"></object>

y un ejemplo (este es el mio por si me quieren promocionar xD )

<object style="border:none; overflow: hidden; width:200px; height: 255px;"  data="http://www.facebook.com/plugins/likebox.php?id=62473189912&width=300&height=255&connections=10&header=false"></object>

Y listo solo pégalo en donde gustes que aparezca en tu página.

Fuente: Un poco de investigación por mi cuenta y claro el código válido gracias a ““Mukesh Chapagain’s Blog”

Para editar los smileys de wordpress primero hay que localizar el directorio en donde se encuentran, este está dentro del directorio donde esta tu instalación de wordpress en /wp-includes/images/smilies. Antes de continuar es recomendable hacer un respaldo de esta carpeta, por si borramos algún smiley que no queríamos cambiar.

Ahora solo procedemos a editar cualquier smiley que deseemos cambiar su aspecto, podremos además reemplazar un smiley por otro que nos guste de un pack de smileys o podemos cambiar TODOS los smileys, solo hay que reemplazarlos poniéndoles el mismo nombre y subiéndolos al servidor en el directorio /wp-includes/images/smilies, de este modo ya tendremos otros smileys. Recuerden sobreescribir las que ya existen para que se reemplacen.

Den click en la imagen para no quedarse ciegos antes de tiempo


Aquí una lista de todos los iconos que hay en WordPress (los mios ya están modificados), por default son 22.

1. es “:mrgreen:”
2. es “:neutral:”, “:-|” y “:|”
3. es “:twisted:”
4. es “:arrow:”
5. es “:shock:”, “8-O” y “8O”
6. es “:smile:”, “:-)” y “:)”
7. es “:???:”, “:-?” y “:?”
8. es “:cool:”, “8-)” y “8)”
9. es “:evil:”
10. es “:grin:”, “:-D” y “:D”
11. es “:idea:”
12. es “:oops:”
13. es “:razz:”, “:-P” y “:P”
14. es “:roll:”
15. es “:wink:”, “;-)” y “;)”
16. es “:cry:”
17. es “:eek:”, “:-o” y “:o”
18. es “:lol:”
19. es “:mad:”, “:-x” y “:x”
20. es “:sad:”, “:-(” y “:(“
21. es “:!:”
22. es “:?:”

Bueno eso fue solo para Editarlos o Cambiarlos, ahora algo un poco mas complicado es Agregar otros smileys pero se los explicare detalladamente (o al menos lo intentaré), esto se puede hacer mediante plugins pero ya que queremos (o por lo menos yo) evitar jalar mas memoria a nuestro servidor con plugins innecesarios, explicaré como hacerlo manualmente.

Agregando Smileys en WordPress

Básicamente para añadir otros smileys necesitamos hacer 2 cosas: agregar el GIF que deseamos a la carpeta /wp-includes/images/smilies y editar el archivo functions.php localizado en /wp-includes.

Nota: El archivo functions.php es un archivo que requiere WordPress para su funcionamiento, es recomendable respaldarlo antes de hacer cualquier edición por pequeña que esta sea. Aún así las modificaciones que haremos a continuación son bastante sencillas y con un poco de práctica será trivial agregar más iconos.

Como hacerlo:

Por ejemplo si queremos agregar un smiley para “XD”, “x3″ o “T_T” que sería riéndose con unos ojos de cruz, emocionado con ojos de cruz y boca de gato y llorando respectivamente. Hacemos lo siguiente:

Primero seleccionamos un archivo GIF para el smiley que vamos a crear y lo renombramos por icon_[descripción].gif donde [descripción] es cualquier texto que se parezca a nuestro GIF o que lo describa, les recomiendo que la [descripción] sea de preferencia el texto o atajo con el cual quieren que aparezca ese smiley aunque no necesariamente con ese texto aparecerá.

Ejemplos de nombres:

icon_xD.gif
icon_x3.gif
icon_T_T.gif

o bien:

icon_risa.gif
icon_emocionado.gif
icon_llorando.gif

En lo personal prefiero los primeros, ya que es mas corto y al menos yo los entiendo xD .

Nota: En las [descripción]es eviten los acentos ‘, comillas ‘ y comillas dobles “, podrían causar problemas. Recuerden que al asignar un nombre a un archivo tampoco pueden poner ciertos caracteres como la barra inclinada / o los dos puntos :

Una vez renombrados procedemos a subirlos a la carpeta /wp-includes/images/smilies.

Por ejemplo yo subí 3 archivos: icon_xD.gif, icon_x3.gif, icon_T_T.gif

Eso fue fácil ahora a editar un poco de código, tenemos que editar el functions.php localizado en el directorio/wp-includes, ábranlo con su editor de texto plano o código (x)html/php favorito y vamos a trabajar entre la línea 2857 y la línea 2904:

	if ( !isset( $wpsmiliestrans ) ) {
		$wpsmiliestrans = array(
		':mrgreen:' => 'icon_mrgreen.gif',
		':neutral:' => 'icon_neutral.gif',
		':twisted:' => 'icon_twisted.gif',
		  ':arrow:' => 'icon_arrow.gif',
		  ':shock:' => 'icon_eek.gif',
		  ':smile:' => 'icon_smile.gif',
		    ':???:' => 'icon_confused.gif',
		   ':cool:' => 'icon_cool.gif',
		   ':evil:' => 'icon_evil.gif',
		   ':grin:' => 'icon_biggrin.gif',
		   ':idea:' => 'icon_idea.gif',
		   ':oops:' => 'icon_redface.gif',
		   ':razz:' => 'icon_razz.gif',
		   ':roll:' => 'icon_rolleyes.gif',
		   ':wink:' => 'icon_wink.gif',
		    ':cry:' => 'icon_cry.gif',
		    ':eek:' => 'icon_surprised.gif',
		    ':lol:' => 'icon_lol.gif',
		    ':mad:' => 'icon_mad.gif',
		    ':sad:' => 'icon_sad.gif',
		      '8-)' => 'icon_cool.gif',
		      '8-O' => 'icon_eek.gif',
		      ':-(' => 'icon_sad.gif',
		      ':-)' => 'icon_smile.gif',
		      ':-?' => 'icon_confused.gif',
		      ':-D' => 'icon_biggrin.gif',
		      ':-P' => 'icon_razz.gif',
		      ':-o' => 'icon_surprised.gif',
		      ':-x' => 'icon_mad.gif',
		      ':-|' => 'icon_neutral.gif',
		      ';-)' => 'icon_wink.gif',
		       '8)' => 'icon_cool.gif',
		       '8O' => 'icon_eek.gif',
		       ':(' => 'icon_sad.gif',
		       ':)' => 'icon_smile.gif',
		       ':?' => 'icon_confused.gif',
		       ':D' => 'icon_biggrin.gif',
		       ':P' => 'icon_razz.gif',
		       ':o' => 'icon_surprised.gif',
		       ':x' => 'icon_mad.gif',
		       ':|' => 'icon_neutral.gif',
		       ';)' => 'icon_wink.gif',
		      ':!:' => 'icon_exclaim.gif',
		      ':?:' => 'icon_question.gif',    //comentario: línea en la que nos posicionaremos
        );
    }

Nos posicionamos en la línea 2902, y daremos enter, posteriormente vamos a escribir con el siguiente formato:

		      '[texto_disparador]' => '[nombre_del_GIF]',

El [texto_disparador] es la combinación de carácteres que usaremos para que se muestre el smiley.
El [nombre_del_GIF] es el nombre de nuestro archivo con la extensión .gif, ese que subimos a nuestro servidor con el formato icon_[descripción].gif

Ejemplos:

		      'xD' => 'icon_xD.gif',
		      'xD' => 'icon_chistoso.gif',
		      'xD' => 'icon_risa.gif',

Ahora solo queda realizar las modificaciones que sean necesarias, en mi caso agregué lo siguiente para mis 3 smileys que creé:

		      'xD' => 'icon_xD.gif',
		      'T_T' => 'icon_T_T.gif',
		      'x3' => 'icon_x3.gif',

Para que lo vean mas detalladamente incluyo las líneas antes mencionadas con la edición que acabo de realizar:

	if ( !isset( $wpsmiliestrans ) ) {
		$wpsmiliestrans = array(
		':mrgreen:' => 'icon_mrgreen.gif',
		':neutral:' => 'icon_neutral.gif',
		':twisted:' => 'icon_twisted.gif',
		  ':arrow:' => 'icon_arrow.gif',
		  ':shock:' => 'icon_eek.gif',
		  ':smile:' => 'icon_smile.gif',
		    ':???:' => 'icon_confused.gif',
		   ':cool:' => 'icon_cool.gif',
		   ':evil:' => 'icon_evil.gif',
		   ':grin:' => 'icon_biggrin.gif',
		   ':idea:' => 'icon_idea.gif',
		   ':oops:' => 'icon_redface.gif',
		   ':razz:' => 'icon_razz.gif',
		   ':roll:' => 'icon_rolleyes.gif',
		   ':wink:' => 'icon_wink.gif',
		    ':cry:' => 'icon_cry.gif',
		    ':eek:' => 'icon_surprised.gif',
		    ':lol:' => 'icon_lol.gif',
		    ':mad:' => 'icon_mad.gif',
		    ':sad:' => 'icon_sad.gif',
		      '8-)' => 'icon_cool.gif',
		      '8-O' => 'icon_eek.gif',
		      ':-(' => 'icon_sad.gif',
		      ':-)' => 'icon_smile.gif',
		      ':-?' => 'icon_confused.gif',
		      ':-D' => 'icon_biggrin.gif',
		      ':-P' => 'icon_razz.gif',
		      ':-o' => 'icon_surprised.gif',
		      ':-x' => 'icon_mad.gif',
		      ':-|' => 'icon_neutral.gif',
		      ';-)' => 'icon_wink.gif',
		       '8)' => 'icon_cool.gif',
		       '8O' => 'icon_eek.gif',
		       ':(' => 'icon_sad.gif',
		       ':)' => 'icon_smile.gif',
		       ':?' => 'icon_confused.gif',
		       ':D' => 'icon_biggrin.gif',
		       ':P' => 'icon_razz.gif',
		       ':o' => 'icon_surprised.gif',
		       ':x' => 'icon_mad.gif',
		       ':|' => 'icon_neutral.gif',
		       ';)' => 'icon_wink.gif',
		      ':!:' => 'icon_exclaim.gif',
		      ':?:' => 'icon_question.gif',
		      'xD' => 'icon_xD.gif',	//esta línea fue agregada
		      'T_T' => 'icon_T_T.gif',	//esta línea fue agregada
		      'x3' => 'icon_x3.gif',	//esta línea fue agregada
        );
    }

Ya solo queda guardar los cambios realizados en el archivo y subir este functions.php editado al directorio /wp-includes, sobreescribiendo el functions.php que ya existe en su servidor.

Como pueden observar, los “textos disparadores” en mi caso son “xD” “T_T” y “x3″ y ahora mismo podemos ver que escribiendo eso (sin las comillas claro) aparecen en mi blog xD T_T x3 .

Ahora si lo que quieren es solamente modificar un texto disparador ya tienen el formato que funciona igual para todos los iconos que vienen por default en WordPress:

		      '[texto_disparador]' => '[nombre_del_GIF]',

Por ejemplo para que un icono como “:)” aparezca con el texto disparador “=)” EN LUGAR DE CON “:)” solo habría que editar la línea correspondiente:

		       ':)' => 'icon_smile.gif',

la cambiamos por esto:

		       '=)' => 'icon_smile.gif',

Ahora que si lo que queremos es que aparezca con AMBOS textos disparadores entonces vamos a la línea 2893, damos enter y escribimos a continuación el otro texto disparador con el que queremos que salga:

		       ':)' => 'icon_smile.gif',
		       '=)' => 'icon_smile.gif',

De este modo tanto “:)” como “=)” mostrarían

Espero les sirva, cualquier cosa dejen su opinión, sugerencia, aportación… en la sección de comentarios.

Nota: Recuerden tener activada la opción para que WordPress convierta el texto a caritas. Settings→Writing→Formating↑Activar la Casilla→Convert emoticons like ‘:-)’ and ‘:-P’ to graphics on display.

Den click a la imagen si no quieren recurrir a un trasplante de cornea.

Fuente: Aprendí moviéndole a lo loco al código de mi WordPress

A finales de octubre se estrenará Saw 7 en 3D, mientras llega la fecha esperada les dejo un poster 3D de la película y el trailer desde el canal oficial de lionsgate:

Click aquí para ver el poster

Da click para ver el vídeo

Pueden verlo en mayor calidad desde el sitio oficial de Saw 7 3D (click aquí)

Les dejo su canal de youtube, en el cual también viene un poco de artwork de la película (click aquí)

En Saw 7 volverá el Doctor Gordon que salio en la primera película, además de el aparecerá también Chester Bennington vocalista de Linkin Park. Espero ver Saw 7 y que no pase como Saw 6 que nunca apareció en los cines.