domingo, 25 de noviembre de 2012

Personalizar la data del blog + Backgrounds Tutorial


Hi! Hi! mis amores ^^, Hoy les traje un tuto super útil  he notado que esta bastante de moda personalizar la data con fondos coloridos así que cree un
tuto super sencillo y paso a paso para Dar un toquesito de orden y
diversión al blog anda animate y da click en lee mas.. 

    La data de la que les hablo es esta:

ves que bonita?   Tu puedes colocarle el fondo que desees,
asi que manos a la obra.. relajate.. preparate.. aqui vamos..
Ve a Diseño  Elementos de pagina y haz click en editar en el 
area de los post como muestra aqui:


Te saldrá como una cajita pequeña y en ella modifica la manera
en la que muestra la fecha de tu blog dejandola de esta manera
(hay que saber que la fecha cambia respecto al dia en que estes)
Guarda los cambios y ve a  Edición de HTML , presiona  F3 y busca:
h2.date-header {
 Estará mas o menos así:
Deberás borrar lo seleccionado en azul o lo que sea que este allí
(sin borrar la llave)

Y colocar en vez de eso esto:
margin-top: 3px; 

color: #ffffff;

float: top;

text-align: center;
background: url("Aqui el URL DE TU FONDO") repeat;
-webkit-border-radius: 5px 5px 0px 0px;


Debes de elegir el fondo que mas te guste y colocar su URL donde te pida el codigo de
arriba para que todo quede asi:
Remplaza con el URL visualiza y si todo esta en orden  guardalo!


Aqui les dejo algunos fonditos :







 
 
 
  

viernes, 16 de noviembre de 2012

Tutorial:Columnas Duales Coloridas❤


 
Tu columna quedaría de esta manera dependiendo de los colores que elijas para ella:

Para ello precisas ir a DiseñoDiseñador de plantillasDiseño y:
Luego ve a  ajustar ancho y dejalo asi:
Guarda los cambios haciendo click en aplicar al blog! ahora haz click en  volver al blogger  edicion HTML  presiona f3 y busca esto si elegiste las columnas del lado derecho:

.main-inner .fauxcolumn-right-outer .fauxcolumn-inner {

y si las elegiste del lado izquierdo busca:



.main-inner .fauxcolumn-left-outer .fauxcolumn-inner {

 
Lo encontraras  algo asi:



 .main-inner .fauxcolumn-right-outer .fauxcolumn-inner {margin-right: $(content.padding);background:$(widget.outer.background.color) $(widget.outer.background.gradient) repeat scroll top left;}

Ahora sustituye lo que esta en rojo por:


 background: url("URL DE LA IMAGEM") repeat;

ahora donde dice URL DE LA IMAGEN reemplazalo por el url de el fondo de dos colores, yo hice algunas para ustedes:





Solo haz click derecho encima de la que deseas y presiona: copiar URL de la imagen para optener su URL. si quieres crear las tuyas hazlo y hospedalas en  http://photobucket.com/ u otro servidor

sábado, 10 de noviembre de 2012

Tutorial:Letras Personales En La Barra Del Estado♥

Recuerdan que al ingresar a mi blog unas cuantas palabras de bienvenida
se movilizan en la barra de estado? para verlas ingresa Aqui! y para
aprender a hacerlo haz click en lee mas..


Como lo pueden ver aqui.. 
 
La verdad es muy sencillo de hacer..
debes ir a Diseño Añadir un Gadget   HTML/ Javascript 

y alli coloca:

<script type="text/javascript">
function tb8_makeArray(n){
this.length = n;
return this.length;
}
tb8_messages = new tb8_makeArray(3);
tb8_messages[0] = "Primer texto aqui";
tb8_messages[1] = "Segundo texto aqui";
tb8_messages[2] = "Tercer texto aqui";
tb8_rptType = 'infinite';
tb8_rptNbr = 5;
tb8_speed = 100;
tb8_delay = 2000;
var tb8_counter=1;
var tb8_currMsg=0;
var tb8_tekst ="";
var tb8_i=0;
var tb8_TID = null;
function tb8_pisi(){
tb8_tekst = tb8_tekst + tb8_messages[tb8_currMsg].substring(tb8_i, tb8_i+1);
document.title = tb8_tekst;
tb8_sp=tb8_speed;
tb8_i++;
if (tb8_i==tb8_messages[tb8_currMsg].length){
tb8_currMsg++; tb8_i=0; tb8_tekst="";tb8_sp=tb8_delay;
}
if (tb8_currMsg == tb8_messages.length){
if ((tb8_rptType == 'finite') && (tb8_counter==tb8_rptNbr)){
clearTimeout(tb8_TID);
return;
}
tb8_counter++;
tb8_currMsg = 0;
}
tb8_TID = setTimeout("tb8_pisi()", tb8_sp);
}
tb8_pisi()
</script>


Remplazan lo que les pide  que puede ser.. Bienvenido a mi blog o algo asi..y
 luego lo guardan.. no fue sencillo? :) espero les haya gustado..

Tutorial: Links Cutes En Tu Blog ♥

Hola mis cerecitas hoy les traigo un tuto super cute. les enseño a como colocar un fondito 
colorido en los links  como lo tengo yo aqui en el blog. así que sin mas preámbulos vamos a lo nuestro..
Es super simple y quedara muy mono en tu blog  para hacerlo ve a: mas opciones > plantilla> edicion de HTML> presiona f3 y busca:  ]]></b:skin>  encima de el coloca el siguiente codigo:
.post a:hover {background: url('URL DE LA IMAGEN');color: #4C4848;}
Reemplaza lo que esta en verde por el url de la imagen que elijas para el fondo. aqui les traje algunos temitas  para que saquen el url de ellos :






le dan click derecho y luego copiar url de la imagen y ya tienen el url <)