Tutorial blogger.

55
Contenido: 1. Crear un blog en Blogger 2. Cómo personalizar la apariencia del blog 3. Agregar chat al blog 4. Agregar un CBOX a nuestro blog Realizado por: Yeni Velázquez Guzmán

description

En este archivo encontraras el siguiente contenido* como crear un blog*Personalizar la apariencia de un Blog*Añadir el chat a un Blog*Agregar un Cbox al Blog

Transcript of Tutorial blogger.

Page 1: Tutorial blogger.

Contenido:

1. Crear un blog en Blogger

2. Cómo personalizar la apariencia del blog

3. Agregar chat al blog

4. Agregar un CBOX a nuestro blog

Realizado por: Yeni Velázquez Guzmán

Page 2: Tutorial blogger.

Como primer paso debemos de entrar a este enlace:

http://www.blogger.com

Page 3: Tutorial blogger.

Para comenzar a crear el blog debemos seleccionar

con un clic la opción Comenzar que nos muestra la

ventana.

Page 4: Tutorial blogger.

Para poder crear un Blog primeramente debemos crear

una cuenta de google. No hace falta pero conviene

tenerla si queremos acceder a todas sus herramientas, y

para ello hay que rellenar formulario como el de a

continuación y seleccionar Continuar.

Page 5: Tutorial blogger.

En dado caso que ya se cuente con una cuenta de

google lo único que se debe hacer es seleccionar la

opción iniciar sesión y seguir con los pasos que a con-

tinuación se mostraran.

Page 6: Tutorial blogger.

En la siguiente ventana podremos ponerle un nombre a

nuestro Blog y el URL que tendrá; para confirma que no

existe debemos comprobar si esta disponible sino debemos

de buscar otra.

Page 7: Tutorial blogger.

Después de encontrar un URL disponible escribiremos las

2 palabras que nos aparece en la ventana para después

darle clic en Continuar.

Page 8: Tutorial blogger.

Por último, tendremos que elegir una plantilla, que es el diseño

general del blog. Elegiremos la que más nos guste, pero más

adelante podremos cambiarla siempre que queramos. Ya

elegida la plantilla daremos clic en Continuar.

Page 9: Tutorial blogger.

Listo.. Ya lograste crear tu Blog

Page 10: Tutorial blogger.

Ya creado el Blog podremos personalizarlo dando clic

en la opción Personalizar su apariencia.

Page 11: Tutorial blogger.

En la siguiente ventana podremos cambiar la plantilla

que escogimos anteriormente por un otra que sea de

nuestro agrado o podemos dejarla con la que tenia.

Page 12: Tutorial blogger.

En la opción Fondo podremos modificar la gama de

colores que tendrá nuestro Blog incluso podremos

ponerle una imagen de fondo. Podremos utilizar nuestra

imaginación y crear la combinación que mas te guste.

Page 13: Tutorial blogger.

En la opción ajustar ancho podremos elegir el tamaño que

tendrá nuestro Blog. Si queremos que el blog aparezca

completo en toda la pantalla o solamente en una peque-

ña parte. Podremos ajustar también el tamaño de la barra

lateral del Blog.

Page 14: Tutorial blogger.

Siguiendo tenemos la opción de Diseño en la cual

podremos modificar las plantillas que tendrá el

cuerpo de nuestro Blog y también podremos cambiar

el diseño del pie de pagina.

Page 15: Tutorial blogger.

Después personalizaremos en la opción Avanzado la gama

de colores y el tipo de letra que tendrá nuestro Blog. Empe-

zaremos tipo de letra y color del texto que tendrá el cuerpo

del Blog.

Page 16: Tutorial blogger.

En la opción Background encontraras la gama de colores

que podrás modificar a tu gusto poniéndole color al

fondo exterior y superior y el color de Borde que elijas.

Page 17: Tutorial blogger.

En la opción Enlaces podremos cambiar los colores de los

links (Enlaces) que insertemos en nuestro Blog. Modificar

desde el color del enlace hasta el color que tendrá

cuando coloque el curso o ratón sobre el.

Page 18: Tutorial blogger.

En esta ventana podremos elegir la fuente y el color del

texto que queramos para el Blog. Selecciona los que mas

guste.

Page 19: Tutorial blogger.

En este apartado podremos cambiar el color de la

descripción del Blog

Page 20: Tutorial blogger.

En la siguiente opción podremos cambiar la apariencia del

Texto de la pantalla. Con tan solo buscar una fuente u un

Color.

Page 21: Tutorial blogger.

Esta opción tiene como finalidad cambiarle el formato al

fondo de las pestañas podre usar una combinación

Agradable para tu Blog.

Page 22: Tutorial blogger.

En las siguientes opciones podremos cambiar la fuente y

el color de texto del titulo de entrada.

Page 23: Tutorial blogger.

En esta ventana podremos modificar el tipo de fuente,

color de texto y color del biselado del titulo de Gatget.

Page 24: Tutorial blogger.

Por ultimo podremos cambiar la apariencia de los acentos,

alternando los colores y modificando el color del biselado.

Page 25: Tutorial blogger.

Para finalizar con el proceso daremos clic en la opción

aplicar al Blog para que guarde los cambios que hayamos

Realizado y para observar los cambios seleccionaremos

Ver blog.

Page 26: Tutorial blogger.

En esta pagina podrás encontrar plantillas prediseñadas

que podrás descargar y aplicarlas a tu Blog para ponerle

otro toque diferente a la apariencia.

Page 27: Tutorial blogger.

Para comenzar debemos elegir una plantilla que nos guste

y hacer clic en la opción que dice Dowload para

comenzar a descargarla.

Page 28: Tutorial blogger.

En esta ventanita seleccionaremos la opción Guardar

para que podamos hacer uso de la plantilla,

especificaremos la ubicación donde la guardaremos y

esperaremos a que termine la descarga .

Page 29: Tutorial blogger.

El siguiente paso será descomprimir el archivo.

Page 30: Tutorial blogger.

Para poder insertar la plantilla descargada primero

debemos ir a nuestro Blog y seleccionar la opción diseño .

Page 31: Tutorial blogger.

Nos aparecerá la siguiente ventana donde

seleccionaremos la opción de edición HTML y la siguiente

opción a la que daremos clic será a Examinar.

Page 32: Tutorial blogger.

Abierta la siguiente ventana seleccionaremos la ubicación

del archivo que descomprimimos y damos doble clic

a la carpeta y después nos abrirá otras dos carpetas de las

cuales abriremos la que nos muestre el nombre de la

Plantilla que hemos elegido y daremos clic en Abrir.

Page 33: Tutorial blogger.

Ya abierta la carpeta seleccionaremos el archivo que este

en formato XML es el que nos servirá para insertar la plantilla.

El siguiente paso será dar en clic la opción Subir ya

seleccionado el archivo.

Page 34: Tutorial blogger.

Siguiendo seleccionaremos la opción mantener widgtes

para finalizar se guardaran los cambios y seleccionaremos

Vista Previa para ver como quedo insertada nuestra plantilla

en el Blog.

Page 35: Tutorial blogger.

Listo.. Nuestra plantilla se inserto correctamente así es

como se vera en el Blog.

Antes

Después

Page 36: Tutorial blogger.

Primero que nada accederemos a una pagina de internet

Y entraremos al buscador de Google y enseguida

teclearemos la palabra XAT y seleccionaremos la primera

opción.

Page 37: Tutorial blogger.

Abierta nuestra pagina en las pestañitas nos aparecen

Varias opciones seleccionaremos la que dice Widgets

Page 38: Tutorial blogger.

En la siguiente ventana daremos clic en la opción Get a

Free chat box now. Y a continuación nos aparecerá otra

otra ventana en donde viene varias opciones de fondos

Para la ventana del Chat, seleccionaremos la que mas

nos guste

Page 39: Tutorial blogger.

Como siguiente paso copiaremos el código que nos

Aparece en el apartado que dice Embed Code

Page 40: Tutorial blogger.

Ahora regresaremos a la pagina de Blogger y daremos

Clic en la opción Diseño y nos abrirá otra pagina donde

daremos clic en añadir un Gadget

Page 41: Tutorial blogger.

En la siguiente ventana elegiremos la opción que dice

HTML/ Javascript después nos abrirá otra ventana donde

podremos configurar el titulo de nuestro Gadget y le

pondremos por nombre Chat.

Page 42: Tutorial blogger.

Continuaremos dando clic derecho en el apartado de

contenido y seleccionaremos la opción Pegar. Enseguida

Insertara el código que habíamos copiado con

Anterioridad y guardaremos los cambios.

Page 43: Tutorial blogger.

Guardados los cambios hacemos clic en la opción ver

Blog para cerciorarnos que el ejercicio se ha realizado

con éxito.

Page 44: Tutorial blogger.

Al igual que en el Chat, para agregar un Cbox necesitas ir

al buscador de Google y teclear la palabra Cbox, elegir

la primera opción que nos muestra.

Page 45: Tutorial blogger.

Ya abierta la pagina daremos un clic en la pestaña Sig Up

para registrarnos y poner añadir el Cbox a nuestro Blog.

Debemos de rellenar el formulario como nos marca

a continuación, aceptamos las condiciones y damos clic

Create my Cbox.

Page 46: Tutorial blogger.

Una vez creada nuestra cuenta iniciaremos Sesión para

comenzar a agregar el Cbox. El primer paso comienza

dándole clic a la pestaña Publish.

Page 47: Tutorial blogger.

En la siguiente pantalla nos muestra el URL de nuestro Blog

y el código, ahí no haremos ningún cambio será hasta la

parte de abajo donde seleccionaremos la opción Fine-tune

its layout

Page 48: Tutorial blogger.

En esta sección modificaremos el tamaño de ancho de la

ventana de nuestro Cbox a 300 px y seleccionaremos la

Opción Guardar o Save.

Page 49: Tutorial blogger.

A continuación seleccionaremos otra vez la opción

Publish! A continuación nos aparecerá una ventana

con el link de nuestro Blog y en la parte de abajo de

la ventana daremos clic en la opción Custumise colours

and fonts

Page 50: Tutorial blogger.

En estas ventanas personalizaremos nuestro Cbox

cambiándole los colores al terminar daremos clic

en la opción Apply para guardar los cambios.

Page 51: Tutorial blogger.

Después volveremos a seleccionar la opción Publish! Y nos

arrojara una ventana donde seleccionaremos y copiaremos

con el clic derecho todo el código que nos aparece para

generar nuestro Cbox.

Page 52: Tutorial blogger.

Después de copiar el código iremos a nuestro Blog y

seleccionaremos la pestaña diseño en ella elegiremos

añadir un Gadget.

Page 53: Tutorial blogger.

En la ventana que nos abre después buscaremos la

opción HTML/JAVASCRIPT y le daremos clic en la siguiente

ventana elegiremos un nombre para nuestro Gadget.

Page 54: Tutorial blogger.

Después de elegir el titulo en la opción Contenido daremos

clic derecho y elegiremos la opción pegar y enseguida nos

aparecerá el código que copiamos con anterioridad.

Page 55: Tutorial blogger.

Listo nuestro Cbox quedo agregado a nuestro Blog,

Seleccionaremos la opción Guardar y por ultimo Ver Blog

para ver si se han efectuados los cambios.