Programo Web

Buee, no se como empezar, luego de casi un mes sin escribir algo me siento raro, pero debo decir que tenía el diseño final de la página de error desde hace 20 días :S.

Ahora, este es el post final sobre la creación de la página de Error 404, podemos decir que ya hicimos todo lo difícil, ahora sólo nos falta mejorar un poco nuestro primer intento con un poco de CSS e imaginación

Habíamos dicho que la página de error llevaría los últimos posts y suscripción al feed, eso es algo simple de hacer.

Para los últimos posts ya hemos visto varios ejemplos de como hacerlo, el más estable y seguro de usar en WordPress es este, que usa funciones nativas de WP para funcionar, pero en el ejemplo voy a usar el método con FeedBurner, fue más simple y además el diseño lo tengo hecho en una plantilla HTML básica.

En el post sobre FeedBurner se explica claramente como encontrar el código para usarlo (las imágenes ya no están por problemas de hosting, pero voy a intentar arreglarlas), se trata de un simple javaScript que obtiene los últimos posts, en mi caso elegí que se mostraran 7.

Lo hacemos de esta forma:

Seguir Leyendo esta Entrada

Como hablabamos en el post anterior, la página de Error 404 debe ser muy simple y funcional, evitando sobrecargarla para que sea fácil la navegación y uso de la misma.

Ahora haremos nuetro primer intento creando una y, como dijimos en el otro post, sólo incluíremos el logo, un texto de aviso y una caja de busqueda. El diseño de la misma la veremos en otro post, por ahora me baso en los colores de mi blog (no son muy bonitos, pero vamos, es el primer intento ).

Para hacer una caja de busqueda, podemos basarnos en la que trae nuestro theme, que se encuentra, normalmente, en el archivo searchform.php. Copiamos el contenido en nuestro archivo 404.php, que debería ser algo así:

Ahora ya tenemos nuestro buscador hecho. Este paso es muy importante (todos lo son), ya que con el buscador estamos invitando a los usuarios a mantenerse dentro de nuestra página cuando se encuentren con este error.

Entonces sólo nos falta darle estilos a nuestra página. Para eso abriremos nuestro archivo style.css y usaremos los siguientes divs:

Seguir Leyendo esta Entrada

El error 404, muy conocido en internet, aparece cuando llegamos a una página que no existe, ya sea porque la borraron o porque escribimos mal la url de la misma.

Algunos creen que no es muy necesario crearla, pero realmente sirve, tanto para el webmaster como para el usuario que llegó a ella. Al webmaster le sirve porque puede utilizarla para conectar toda su página, normalmente con un buscador y al usuario le sirve por lo mismo, ya que puede seguir buscando en la página, sin necesidad de volver a la portada.

Nosotros nos dedicaremos a crear una página de error que sea aceptable y funcional para nuestros usuarios, que contendrá lo siguiente:

• El logo de la página (o sólo el nombre si no usan un logo).
• Un mensaje avisando del error.
• Un buscador.

Hasta eso es lo común dentro de esta página, pero nosotros agregaremos esto:

• Los últimos posts usando las funciones de WordPress.
• Posibilidad de suscripción: esto es algo que ayudará mucho. Agregaremos un enlace al feed y un formulario de suscripción por mail para que los usuarios se mantengan al tanto de nuestro blog.

Con eso será suficiente, la idea es hacer que no se vea muy sobrecargada, por lo que utilizaremos una página especial, sin la sidebar ni el footer ni nada, solo lo mencionado.

Para hacerlo en WordPress debemos crear un archivo llamado 404.php y lo subimos junto a nuestro theme.

Para hacerlo en una página estática es necesario configurar el .htaccess para que sepa cual es nuestra página, de esta forma:

En el próximo post veremos un ejemplo, sólo con lo mencionado al principio, sin los últimos posts ni la suscripción. Lo haremos de a poco para no cometer errores.

Un día tuve que buscar una solución para un diseño que estaba armando. El problema era que en Google Chrome se veía mal mi diseño, pero en IE y Firefox se veía sin problemas, la solución que encontré fue la siguiente:

CSS Browser Selector, un excelente script que nos permite utilizar distinto CSS en cada navegador.

Dependiendo del navegador podremos utilizar distintos diseños y lo único que necesitamos es agregar un script a nuestra página.

Copia y pega el siguiente código dentro de <head> y </head> de tu  página:

Modo de uso:

En este ejemplo usaremos el div #nav.

CSS distinto en Google Chrome:

CSS distinto en Opera:

CSS distinto en Safari:

Es muy simple de aplicar y no necesita mayor conocimiento, sólo debemos agregar un "class" antes de cada "div" que queramos cambiar, en nuestra hoja de estilos.

Puedes ver más ejemplos en la web oficial:

Enlace: CSS Browser Selector