Página estática como portada de Blogger

miércoles, 10 de abril de 2013

Enviar
print this page
Este es un sistema que nos permitirá crear una portada para el blog de una forma sencilla, sin necesidad de editar siquiera la plantilla.

El truco está en redireccionar al visitante que acceda mediante la dirección principal del blog a una página estática. En ella podremos poner el contenido que nos parezca, pero el sentido de hacer esto sería el de convertirla en una especie de portada o frontal del blog.

Además de no ser necesario editar la plantilla, el hecho de que usemos una página como lugar de aterrizaje nos permitirá convertir el blog en una especie de web con secciones fijas (el resto de páginas estáticas) y mantener el acceso al blog normal como si fuera un apartado más de esa web. Todo ello sin salir de nuestro subdominio. Enlazado en esta imagen podéis ver un ejemplo.

Landing page

El invento no es de un servidor, sino de Blogger Tips Pro quién además ha hecho pruebas para ver la forma en que Google indexa esa página redirigida, con resultados satisfactorios. Así que prácticamente sólo os solucionaré el trabajo de traducir el texto y las capturas de pantalla.

Los pasos a seguir son los siguientes:

Añadimos una página estática para nuestro nuevo Inicio

Accedemos al escritorio y en apartado Páginas seleccionamos Página nueva > Página en Blanco.


A la página la titularemos como Inicio o cualquier otra denominación similar que se nos antoje, excepto el nombre que estemos usando para la actual página de inicio, que en el ejemplo es la que viene por defecto en Blogger (Página principal).

En está será dónde pondremos todo lo que queremos que se vea en la página de aterrizaje, pero de momento y por seguir la explicación, podemos incluir cualquier texto, que luego ya la confeccionaremos a nuestro gusto.

Hechas ambas cosas la publicaremos.


Ahora vemos en nuestra lista de páginas al menos estas dos citadas, la que teníamos originalmente (Página principal) y la nueva creada (Inicio). Si teníamos más páginas también se verán en la lista y quizás sea un buen momento para reordenarlas poniendo la nueva creada (Inicio) al principio. Da igual que esté la primera o la segunda porque luego ocultaremos la pre-existente (Página principal).

Si reordenamos habrá que pinchar arriba a la derecha  para que los cambios se salven.

Añadimos otra página que nos servirá como enlace al blog

Como lo que se pretende es que cuando accedamos a la dirección principal de nuestro sitio acabemos en la portada y desde ahí no se verá el blog en sí mismo, tenemos que habilitar una manera de que nuestros visitantes puedan acceder y esto será con un enlace. Este enlace lo incorporaremos a nuestro menú como otra página. Esta será del tipo Dirección web y la dirección en cuestión tiene que ser forzosamente la de nuestro blog más index.html.

Cuando se abre la ventana emergente de rigor, en el primer casillero escribiremos Blog y en la segunda la dirección en la forma antes expresada: http://DIRECCION-BLOG/index.html.

Como no es la primera vez que me pasa, insisto en que en lugar de DIRECCION-BLOG hay que poner vuestra propia dirección.


Tras Guardar observaremos que ya tenemos tres páginas, Página principal,Inicio y Blog, siempre siguiendo el ejemplo.


Lo podemos hacer más tarde, pero creo que es el momento de mostrar nuestras pestañas del menú de páginas que estamos modificando asegurándonos de que NO tenemos la opción para Mostrar páginas en situación de No mostrar. Tenemos que seleccionar Pestañas principales oEnlaces laterales.

Redireccionar la Página principal por defecto a la nueva Inicio

Ahora viene el paso clave del truco y el único con el que tendremos que tener algo más de cuidado. Se trata de aplicar una redirección para que cuando se acceda a la dirección principal de nuestro blog, automáticamente se nos lleve a la portada que hemos creado (Inicio).

Para ello entramos en la sección Preferencias para motores de búsqueda y en Redireccionamiento personalizado pinchamos en Editar.


Aquí tenemos que marcar las dos casillas de verificación que hay (De: http://... y Permanente) y lo más importante, teclear en el primer casillero una simple barra (/) y en el el segundo la dirección de la nueva página de Inicio antes creada.

Sólo es necesario incluir a partir de la primera barra de la dirección. Esto es que si nuestra página es http://nombre.blogspot.com y la página nuevahttp://nombre.blogspot.com/p/inicio.html, lo único que hay que teclear es/p/inicio.html.


Repasamos que todo esté como en la captura y pinchamos primero en el pequeño enlace Guardar bajo Permanente y luego en el botón naranja .

Ocultar Página principal original


Por último lo que haremos será esconder el enlace del menú de páginas primitivo que teníamos y que ahora no servirá para nada porque nos llevará al mismo sitio que el nuevo Inicio, es decir, a la página estática que usaremos como portada.

Para eso nos vamos ahora a Diseño y desde allí editamos el gadget dePáginas.


Otra ventanita emergente, pero aquí sólo hay que desmarcar la casilla dePágina principal. En el bloque de la derecha veremos que desaparece esa página. y le damos más abajo a Guardar para terminar.

Ya que estamos aquí, si queréis cambiar el orden en que esas páginas saldrán en el menú sólo es cuestión de pinchar el bloque correspondiente y moverlo de sitio.


Y tranquilos, que no hemos borrado esa página. Sólo la hemos ocultado. Si volvemos al apartado Páginas comprobaremos que esta aparece ahora en un bloque inferior al que vimos antes, con el título Oculto.

Construir nuestra portada


Esta ya es la parte creativa y no puedo detallar qué es lo que se podría hacer aquí, pero sí puedo hacer un resumen: TODO.


Pensad que es una página estática y que se puede incluir cualquier cosa: texto, imágenes, marcas HTML, vídeos, etc.

Incluso podemos añadir directamente CSS entre etiquetas STYLE y el estilo sólo afectará a esta página.

Con eso podemos por ejemplo ocultar la sidebar, cambiar el color de fondo, modificar los colores... cualquier cosa.

Fuente: oloblogger
Comparte:

0 comentarios:

Publicar un comentario

Deja tus dudas o recomendaciones por aquí.

Addthis

 
Design by Herdiansyah Hamzah | Published by Borneo Templates | Powered by Blogger.com. Traducido al español por Blogarizate
© Copyright 2011-2013 Blogarizate Todos los derechos reservados.