04 marzo 2015

Crear página de error en blogger.

error-404

De nuevo regreso con otra página de error-404 pero a diferencia de las anteriores (Generador de página de error 404, o Como crear una página de error 404 personalizada en Blogger ) esta es mucho más fácil añadirla a nuestra plantilla, tan solo copiando y pegando el código mostrado más abajo.

También puedes encontrar otras formas de establecer la página de error 404, entre ellos ( El Potro-Ciudad blogger o Oloman-Oloblogger.)

Pero quizás esta fórmula, sea de entre todas por su sencillez, la más fácil y menos complicada de adaptarla al blog y todo ello realizado en CSS, sin imágenes ni javascript.

La página de error se muestra a pantalla completa con el anuncio "La página que buscas no existe" y con un enlace de regreso a la página principal. Además causa un impacto muy positivo, al no mostrar los elementos de tu blog (cabecera, columnas, menu, etc.)

Colocar el Código

Entra en Diseño | Edición de HTML y antes de </body> pega lo siguiente:
<style type="text/css">
#pagina-error {background-color:#e9e9e9;position:fixed !important;position:absolute;text-align:center;top:0;right:0;bottom:0;left:0;z-index:99999;}
#error-interno {margin:11% auto;}
#error-interno .caja-404 {width:400px;height:200px;background:#b71427;color:#fff;font-size:80px;line-height:200px;border-radius:10px;margin:0 auto 50px;position:relative;}
#error-interno .caja-404::after {content:&quot; &quot;;width:0;height:0;bottom:-8px;border-color:#b71427 transparent transparent;border-style:solid;border-width:9px 9px 0;position:absolute;left:47%;}
#error-interno h1 {text-transform:uppercase;}
#error-interno p {line-height:0.7em;font-size:15px;}
</style>
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='pagina-error'>
<div id='error-interno'>
<div class='caja-404'>
404
</div>
<h1>
La página que buscas no existe
</h1>
<p>
La página ha sido eliminada o has escrito una URL incorrecta
</p>
<p>
Volver a -
<a expr:href='data:blog.homepageUrl'>
<data:blog.title/>
</a>
</p>
</div>
</div>
</b:if>

Una vez establecido el código procedemos a [Guardar Plantilla]. Podéis ver vuestra página de error escribiendo en el navegador vuestra dirección url y añadiendole cualquier letra o palabra. Ejemplo (http://www.amorsevillista.com/noexiste )


Escrito por:

Mi nombre es Antonio, soy sobre todo Sevillista y apasionado con los blog desde el 2007.

Sígueme en: | Facebook | Twitter | Google+

Por favor, comente de acuerdo al tema del artículo.
Serán removidos todos los Comentarios con enlaces.
Si quieres recibir los nuevos comentarios marca "Avisarme"