Google+: inserción de una insignia

Un nuevo vídeo de iDESWEB que se ofrecerá a través de la iniciativa Actívate patrocinada por Google.

[kml_flashembed movie=”http://www.youtube.com/v/galzhHiKgMg” width=”560″ height=”315″ wmode=”transparent” /]

Transcripción:

Hola, soy Sergio Luján Mora, profesor de informática de la Universidad de Alicante, y en este vídeo que forma parte del curso “Introducción al desarrollo web”, te voy a explicar cómo puedes insertar una insignia de Google+ en una página web.
Esto te ofrece varias ventajas:

Te permite enlazar tu perfil de Google+ desde una página web cualquiera.
Te puede ayudar a obtener más recomendaciones, que influyen en los resultados de búsqueda de Google.
Y por supuesto, también te puede ayudar a lograr más seguidores y obtener más visitas en tu sitio web y en tu perfil.

Muy importante, lo que te voy a mostrar a continuación sólo funciona si la página está publicada en Internet o en un servidor web propio. Con una página local no funciona.

Para insertar la insigna vamos a utilizar este asistente que ofrece la plataforma Google+.

Este asistente es muy sencillo de utilizar.

En primer lugar debemos estar dentro de nuestra cuenta de Google+, ya que el código que se va a generar identifica nuestro perfil, nuestra cuenta. Si no es así, el primer paso es acceder a nuestra cuenta de Google+.

Tenemos aquí varias opciones para configurar cómo se va a mostrar nuestra insignia.

Tenemos también unas opciones avanzadas que te dejo a ti que explores.

En primer lugar podemos elegir cómo queremos que se muestre la insignia, con este formato, la insignia completa o simplemente como un icono. Según la opción que elijamos el código que se genera cambiará. Voy a dejarlo en insignia.

A continuación tenemos dos formatos de diseño. El formato retrato, que es este formato en forma de cuadrado o el formato paisaje que es apaisado.

Podemos también modificar el ancho de nuestra insignia, la podemos tener más pequeña o la podemos tener más grande. Voy a dejarlo otra vez en 300.

Luego podemos elegir el tema, claro u oscuro, el que más se adecúe al diseño de nuestra página web. Y luego tenemos dos opciones más de foto de portada y de eslogan por si queremos incluir más información en nuestra insignia.

Estos dos tipos de insignia, insignia e icono, se explican en la propia página web. En la parte inferior, si hacemos un scroll, veremos las dos posibilidades, como insignia o como icono, tanto para un perfil como para una página web y con los distintos tamaños con los que podemos jugar.

Bien, una vez que hayamos configurado nuestra insignia simplemente tenemos que copiar este código que se nos proporciona. Tenemos que copiar todo el código, debemos de asegurarnos de que esté seleccionado todo el código. Lo copiamos y me lo voy a llevar a una página web de ejemplo que tengo ya preparada.

Es una página web sencilla y aquí voy a copiar el código que se me ha proporcionado.

El código se compone de dos partes.

Esta primera parte se nos indica que “Inserta esta etiqueta en la sección “head” o justo antes de la etiqueta “body” de cierre”. En realidad, la podría dejar aquí y ya funcionaría, pero voy a seguir las instrucciones y la voy a insertar en la sección head.

Y la otra parte simplemente se deja donde queremos que aparezca la insignia. Pues por ejemplo la dejo aquí en este punto del cuerpo de la página.

Si yo intento ejecutar la página web en local, se intenta cargar algo pero no aparece nada. Como te he explicado antes, la página se debe servir mediante http, a través de Internet o a través de un servidor web local. En este caso yo he instalado un servidor web local en mi ordenador y al ejecutar la página aparece la insignia que me permite enlazar con mi perfil de Google+.

Recuerda, en local no la puedes ejecutar, no aparecerá nada.

En el siguiente vídeo te voy a explicar cómo cualquier publicación que tengamos en Google+ la podemos insertar en una página web.

Ya para terminar, me gustaría recordarte algunos de los sitios web en los que puedes encontrar más información sobre mí y sobre mi trabajo, y dos formas de contactar conmigo, a través de mi correo electrónico sergio.lujan@ua.es y a través de mi cuenta en Twitter @sergiolujanmora.

Recuerda que este vídeo forma parte del curso “Introducción al desarrollo web” que está disponible en la dirección idesweb.es.

Muchas gracias por tu atención.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *