OBJETIVOS DEL TUTORIAL- Armar un widget para BLOGGER con

nuestras identidades en las Redes

sociales

- Configurar links de los íconos

- Configurar mensaje al pasar el mouse

Armar un widget para BLOGGER con nuestras

identidades en las Redes sociales

Acceder al “escritorio” de nuestra cuenta en BLOGGER y hacer click en “diseño”

(del blog que queremos agregar los íconos)

Hacer click en “Añadir un gadget”. Elegir el lugar donde

ubicarlo. BLOGGER nos permite ubicar gadgets en distintas columnas y

ubicaciones

Recorrer la lista de gadget y encontrar

“HTML/Javascript”. Luego hacer click en el

botón +

Escribir un título en el campo de arriba

Copiar en el campo de contenido el siguiente texto. NOTA: Si bien este es un ejemplo, la estructura del código HTML nos sirve para

luego editarla

Editar el texto que está seleccionado y teclear la dirección URL a la que va ir el botón. Puede ser un

canal en Youtube, un usuario de Facebook, etc

Editar el texto que está seleccionado y teclear la dirección URL donde se encuentra la imagen del

ícono. En nuestro caso, la

subimos a Imageshack (un sitio gratuito para subir

imágenes)

NOTA: Recomendamos que la resolución de los íconos sea de 32 x 32 píxeles, tamaño ideal

para que entren en las columnas de nuestro

blog

Editar el texto que está seleccionado y teclear el

mensaje que va a aparecer cuando

pasemos con el mouse sobre el botón

!!!Acá termina el código

para hacer un botón sólo

Es interesante hacer varios íconos en la

columna. Para eso, copiamos el

código del primer ícono y lo pegamos debajo. Luego, editamos el

código de cada uno de los íconos, cambiándole la URL, la imagen y el mensaje al pasar el

mouse. Es decir, repetimos el proceso de edición del

primer ícono para el resto

Cuando terminamos de editar todo el código del gadget hacemos

click en el botón “Guardar”

Si al haber finalizado la creación del gadget vemos

que algunos íconos no quedan en la misma línea, debemos ajustar el tamaño

de la columna

Para eso hacemos click en

“Diseñador de plantillas”

Dentro del diseñador de plantillas hacer click en

“Diseño”

En la ventana de diseño hacer click en

“Diseño de pie de página”

En la “barra lateral izquierda” (en nuestro caso tenemos los íconos en esta columna) aumentar tamaño en píxeles (expresado en números) o

correr un poco la barra hacia el lado del “Máx.”

Debajo de esta ventana de configuración tenemos una vista

previa de nuestro blog que refleja los cambios realizados

Por último, cuando estemos conformes con el tamaño de la columna le damos

click a “aplicar al blog”