TUTORIAL PONIENDO FONDO EN EL BLOG

La resolucion de tu pantalla es de
pixeles.
Vamos a comenzar este tutorial partiendo de cero,es decir creando un blog en el cual utilizaremos de plantilla el tema fantastico de Awasome. Aunque obviamente no tiene por qué ser esta misma plantilla
Paso 1-Vamos rellenando los datos,en primer lugar el titulo que le vamos a poner a nuestro blog,señalado en la imagen con el numero 1 y una x
Lo siguiente será completar la direccion de nuestro blog,metiendo dentro del cajetin señalado con un rectangulo negro,
el numero 2 y una x tal y como vemos en la imagen
Finalmente y antes de continuar con el paso 2
,introducimos las letras de verificacion que se nos pide y estan señaladas con el numero 3 y una x
Ahora ya pinchamos en Continuar Pincha en las imagenes para agrandarlas
Paso 2-Llegados aqui se nos pide que elijamos una plantilla 
o tema de inicio y escogeremos la que esta señalada en la imagen metida dentro de un cuadrado rojo y una x,exactamente la llamada Fantastico y pinchamos en continuar,tal y como vemos en la imagen

Paso 3-Acabamos de crear nuestro blog y ahora se nos dará dos opciones,empezar a publicar o personalizar su apariencia,pinchamos exactamente ahi,tal y como vemos señalado en la imagen


Paso 4-En estos momentos si has estado siguiendo todos los pasos anteriores,nos encontramos delante del diseñador de plantillas de Blogger(Para mi un invento maravilloso)Fijate bien en la imagen,debes de tener en tu pantalla lo que estas viendo aqui:

Dentro de un recuadro anaranjado  señalado con el numero 1
vemos  la plantilla que en estos momentos estamos utilizando que es la Fantastica señalada con una x blanca y el numero 2 en el caso de que dentro del recuadro anaranjado estuvieras viendo otra plantilla,ve y pincha dentro del recuadro de la Fantastica,
e inmediatamente la verás dentro del recuadro amarillo pero por supuesto tambien en la gran vista previa que tenemos justo debajo
En la zona superior derecha dentro de un rectangulo negro y el numero 3 hay un rotulo que pone "Volver a Blogger"pues ahi vamos a pinchar ahora
Paso 5-Ahora vamos a colocar el fondo del blog que hayamos elegido y luego le haremos los cambios que necesitemos.
Para esto pinchamos dentro del recuadro rojo que pone"Añadir un Gadget"
Se nos abrirá una ventana con el contenido de los gadgets disponibles,buscamos concretamente el que se titula html/javascript y pinchamos en el,se nos abrirá una ventanita en donde tenemos
que meter el codigo que se te ha proporcionado con el fondo elegido

Paso 6-
Este es el codigo que vamos a pegar dentro de la ventana,naturalmente este es el de mi fondo el cual voy a poner ahora,pero debes de saber que el codigo es igual para todos los fondoslo unico que varia es la url o direccion del hosting en el cual se encuentra el fondo tal y como vemos en la imagen

inmediatamente despues pincha en Guardar
Paso 7-Ahora vamos a realizar algunos ajustes en nuestro fondo,para ello tenemos que volver a pinchar en la parte superior en donde pone "Diseñador de Plantillas"tal y como ves en esta
Imagen

Paso 8-Como podemos apreciar en la vista previa del blog,hay ajustes necesarios de hacer para que nuestro fondo se nos vea bien y bonito,asi que vamos a ello.


Paso 9-En la parte superior izquierda podemos apreciar un menu que contiene estos apartados:Fondo,Ajustar ancho,Diseño,Avanzado. Vamos a comenzar pinchando en donde dice Fondo y asi veremos lo que se consigue con esto Buscamos en donde pone "Imagen de Fondo" señalada con una gran x blanca y abajo de esto pone "eliminar imagen"tambien señalado con una x,pues pinchamos justo ahi sin miedos,te saldrá un mensaje para confirmar si deseas eliminar la imagen,dale en aceptar

Paso 10-Fijate ahora en el previsualizador del blog y observa el cambio efectuado,ahora nuestro fondo está totalmente limpio como podemos ver en la imagen

Pero aun quedan cositas por hacer.Vamos a pegar un buen salto y en el menu pinchamos ahora en donde pone Avanzado señalado con un recuadro blanco y una x
Paso 11-Vemos que al pinchar en Avanzado se nos ha abierto otro menu con opciones


Comenzamos pinchando en donde pone Pagina

y a continuacion pinchamos en Color de Fondo se nos abrirá una ventana con los colores a elegir,sin embargo no buscamos colores,queremos que nuestro fondo se vea tal cual fue diseñado,entonces elegiremos transparente,pincha justo dentro de donde he puesto 1 y luego para poder cerrar la ventana de los colores pincha en donde he puesto 2 y a continuacion arriba a la derecha en donde pone en anaranjado Aplicar al Blog
Paso 12-Vamos a escoger un color provisional para el texto,luego lo cambiaremos si al final no nos gusta como ha quedado,para esto pinchamos dentro de donde pone color de texto,al igual que hicimos anteriormente con el fondo y se nos volvera a abrir la ventana de colores escogemos el color y con el raton vamos desplazando el arito para escoger el tono,una vez que hayamos seleccionado el tono solo tenemos que pinchar dentro del  nuevo color de texto señalado con una x para cerrar la ventana de color y por ultimo pinchamos al igual que antes en Aplicar al blog,cada vez que realices un ajustes debes de pinchar ahi para guardarlo


Paso 13-Podemos tambien escoger el tipo de fuente y el tamaño.en mi caso ya que mi fondo es de terror he escogido la fuente Covered a tamaño 16 Volvemos al Menu y ahora pinchamos en Enlaces.
Observaremos que en la vista previa del blog ha aparecido unos guiones rojos que enmarcan una zona,esto es para indicar en donde vas a realizar los ajustes.

En este caso se trata de cambiar los colores de manera que combinen con tu fondo y lo haremos de la misma manera que hicimos anteriormente,cuando hayamos acabado,no olvidemos pinchar en aplicar al blog
Paso 14-Ahora ajustaremos el titulo de nuestro blog pinchando en el menu,elegimos el tipo de fuente,el tamaño y el color y a continuacion donde pone Fondo de cabecera lo ponemos
en color transparente y pichamos en aplicar al blog


Paso 15-En este paso pinchamos en el menu en donde pone Descripcion del Blog para cambiar la fuente,el tamaño y el color del texto,exactamente lo mismo sucede en Texto de la pestaña
llegamos ahora a Fondo de las pestañas  y pinchamos ahi para ponerlo todo en transparente En cabecera de fecha pinchamos para escoger el color del texto,tamaño y fuente y el color del borde que lo pondremos tambien transparente.En titulos de la entrada lo mismo,elegir el color,tipo de fuente y tamaño del texto que vamos a
usar Aqui si vamos a realizar un cambio  importante vamos a pinchar en donde pone Fondo de entrada y lo ponemos todo en transparente,tal y como vemos en esta imagen

ya podemos ver como nuestro fondo cada vez se aprecia mejor
Pinchamos en titulo del gadet para elegir el color,fuente y tamaño.
en el apartado Texto del gadget pinchamos y ya tenemos el color del texto,tamaño y fuente si te apetece cambiarlos o dejarlos ya asi,en cualquier caso cambia en donde pone Alternar color y elige uno acorde a tu fondo
Enlaces del Gadget  pinchamos y este apartado tambien es para cambiar los colores de los textos ahora verás las zonas en las cuales estan realizado los cambion dentro de unos recuadros de lineas rojas
Fondo del Gadget pinchamos y por defecto estas todos con el fondo negro,personalmente me gustan transparentes,asi que vamos a ponerlos transparentes y podremos observar la diferencia en esta imagen

Pinchamos ahora en el Fondo de la columna lateral y normalmente ya debe de estar transparente pero si no lo está pues lo ponemos y aqui vemos como nos ha quedado con este otro ajuste


Pinchamos en imagenes y verificamos que el fondo este transparente,si no fuera asi,lo  cambiamos y hacemos lo mismo con el borde el resto de los apartados son para cambiar colores
asi que vamos ahora a pinchar en el menu lateral izquierdo en donde pone Diseño este apartado es importante ya que dependiendo del diseño elegido tendremos mayor espacio o menor espacio para nuestras entradas,en este sentido cada cual escogerá segun sus 
necesidades,aunque te recomiendo que los pruebes todos y al final elijas el que mas te haya gustado,en donde pone Diseño del cuerpo se esta refiriendo a la zona en donde van a ir nuestras entradas o posts y en diseño de pie de pagina o footer corresponde al final del blog en la zona inferior,los que ves señalados dentro de marcos amarillos es el actual diseño que esta aplicado en el blog.
Para cambiarlo solo tenemos que pinchar en ellos



En mi caso elegiré mi diseño favorito que es el primero de la izquierda y luego veremos como queda asi que pinchamos dentro de el y luego vamos a avanzado y podremos previsualizar el resultado


Ahora ya podemos Ajustar el Ancho,asi que pinchamos justo ahi y nos aparecera una ventanacon una barrita deslizante la cual iremos moviendo segun vayamos observando en la vista previa



Ya tengo mi fondo con el ancho deseado,en este punto se puede considerar que ya esta todo y entonces en la parte superior derecha pincha con el boton derecho del raton en  Ver Blog(para abrir una ventana aparte,sin cerrar en la que estamos trabajando)



y asi ha quedado el blog,peeeeeerooo,a mi hay dos cosas que me molestan muchisimo una es la barrita que aparece arriba del todo con el logo de Blogger llamada Navbar y lo otro es la cabecera,asi que quitaré ambas cosas,por si quieres hacer lo mismo,pondré tambien estos pasos
Quitar navbar

En este caso pinchamos en volver a blogger o entrar de nuevo en el blog en el caso de que te hayas salido del mismo y buscamos Edicion de HTML(si no estas acostumbrado a trabajar con el html,te aconsejo que antes de meter un codigo ahi dentro,selecciones todo como veras en la imagen

lo copies y lo pegues en un bloc de notas,de esta manera si algo sale mal,tan solo tienes que borrarlo todo y volver a pegar lo que has puesto en el bloc de notas)pinchamos ahi en editar html
Aqui podemos ver todo el codigo en el que se encuentra el contenido actual del  blog ya seleccionado



Dentro de Editar Plantilla,busca este codigo que se encuentra al principio y lo puedes ver en la imagen <title><data:blog.pageTitle/></title> y a continuacion justo debajo pega este codigo
<style type='text/css'>#navbar-iframe{height: 0px;visibility: hidden;
display: none;}</style>


y luego pincha en guardar plantilla y en Ver blog observarás que ya no esta el navbar

y ya finalmente me queda quitarle la cabecera

Para esto tengo que volver a Edicion Html y dentro de los codigos buscamos esto<header> que servirá a modo de orientación y para acercarnos al trozo de codigo que buscamos

Ya tenemos localizado el<header>


inmediatamente un poquito mas abajo busca esto 
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='FONDO BLOG TERROR (cabecera)' type='Header'/>

señalizado con una x negra se encuentra esta palabra'true'cambiala
por 'false' y pinchas en Guardar Plantilla Finalmente volvemos ahora a Diseño localizamos Cabecera y pinchamos en Editar



Nos saldrá una ventanita como la que vemos aqui

pinchamos entonces en Eliminar y te saldrá un mensaje como el que vemos en esta imagen


y pinchamos en Aceptar , luego cuando se haya cerrado la
ventana pinchamos en Guardar señalado dentro de un rectangulo anaranjado,esto es para guardar los cambios
Ahora miremos como ha quedado nuestro blog,comprobaremos que ha desaparecido las letras del titulo que tanto lo afeaban y que se
encontraban en la cabecera del blog


Posibles dudas que te puedan surgir:Si he quitado la cabecera y quiero poner una imagenen forma de cabecera ¿como lo hago si la he quitado?
esto es muy sencillo en el mismo Gadget en el cual tenemos el codigo para poner el fondo del blog,justo antes de empezar el codigo colocamos este otro para poner la imagen que queramos poner
<center> 
<img alt="PON AQUI LA URL DE TU IMAGEN" src="PON AQUI LA URL DE TU IMAGEN" />
</center>


Finalmente pincha en Guardar
Y si quiero volver a poner la cabecera lo puedo hacer?Por supuesto que puedes,solo tienes que ir al mismo codigo al que fuimos para quitar la cabecera en Edicion Html y volvemos a cambiar 'false' por 'true'
Puedo cambiar los fondos cada vez que quiera?por supuesto,solo tienes que copiar la url de tu nuevo fondo ir al gadge html/javascript donde tienes puesto el actual codigo de tu fondo y cambiar la url que tiene puesta por la nueva url ¡¡asi de simple¡¡cada vez que 
quieras Y con esto acabo el tutorial para poner fondo en tu blog,espero y deseo te sea de ayuda,si asi ha sido agradeceria un link hacia esta pagina
http://layoutsfondosparablogsoniacreations.blogspot.com/




Safe Creative #1111070466371

Seguidores

User-agent: Mediapartners-Google Disallow: