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

Upload: burundisneta

Post on 19-Jan-2015

571 views

Category:

Technology


3 download

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

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.