domingo

Tutorial:Poner bordes en entradas y gadgets

Hola queridas fresitas! 
hoy  traigo un nuevo tutorial para su blog, hoy vamos a aprender a poner bordes en las entradas y gadgets!
asi que quedate ahi y sigue leyendo!

Estos  bordes se van a ver genial en su blog asi que mejor empecemos con el tuto!


  1. primero vamos a ponerle bordes a los gadgets

Para ponerlo solo van a 

  1. Temas
  2. Editar HTML
  3. CTRL+F

Buscan este codigo: 
.sidebar .widget {

si no lo encuentras busca este otro:

]]></b:skin>
 
si encontraste el primer codigo :.sidebar .widget {
pegas el siguiente codigo debajo de ese.

y si no arriba de : ]]></b:skin>
pegas el siguiente codigo:

.sidebar .widget {
Aqui el codigo de tu modelo
}



  1. Ahora los codigos de los modelos


El primer modelo seria asi
  1. el codigo es el siguiente : 

border: 4px solid #FDB4C1;/* Borde en todo*/



  1. Segundo modelo se vería así





  1. el codigo es el siguiente:

border-bottom: 4px solid  #FDB4C1;/* Borde inferior*/
border-top: 4px solid  #FDB4C1;/* Borde superior*/



  1. El tercer modelo se veria asi:



  1. El codigo es este: 

border-right: 4px solid #BEB4FD;/* Borde derecho */
border-left: 4px solid #BEB4FD;/* Borde izquierdo*/
border-bottom: 4px dashed #DBB4FD;/* Borde inferior*/
border-top: 4px dashed #DBB4FD;/* Borde superior*/


Pueden cambiarle los colores , cambiando los codigos de que estan en color violeta osea ej: 
#DBB4FD

como conseguir los codigo de los colores ? EN ESTA PÁGINA


Lo que esta en verde (4px):: 
Tamaño del borde,aumenta el numero si quieres mas grueso o disminuye si lo quieres mas delgado



Ahora vamos a ponerle bordes a las entradas del blog!

Nos quedamos a Editar HTML 

CRTRL+F 

  1. buscamos : .post-outer {
    debajo pegamos este codigo

    .post-outer {
    Aqui el codigo de tu modelo
    }




    si no lo encuentras .post-outer {
    buscas :
    ]]></b:skin>


     y arriba pegas el codigo :

    .post-outer {
    Aqui el codigo de tu modelo
    }



    Donde dice Aqui el codigo del modelo pegas el codigo del modelo que te guste (los codigos son los mismos de mas arriba ) 

    eso seria todo espero que les haya servido :D 

No hay comentarios:

Publicar un comentario