poner un separador al pie de la entrada [Footer]

Pedidoo pedidoo ~~
aww tengo un monton de tutoriales pendientes pero los ire poniendo poco a poquito paciencia sip:( por ahora pondre este ya maniana pondre el del (osito de clic)que tanto han pedido tanto
okis ^^

Asi se veria el divisor al final de cada entrada

el separador aparecera automaticamente al final de todas sus entradas ^^

bueno empezemos:

busca el codigo . post {

y pega el siguiente codigo abajo de text-align: left; o justo antes de la llavecita "}"

background: url(URL DE TU DIVISOR)no-repeat;
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:2.5em;

ejemplo



quedaria asi:



Ahora solo das vista previa y guardar

y para las que no encontraron ese codigo y tienen la plantilla Picture Windows como yo buscan este codigo:

.post-footer {

y pegan este codigo justo abajo de margin: .5em 0 0;

background: url(URL DE TU DIVISOR)no-repeat;
background-repeat: no-repeat;
background-position: bottom center;
margin:.5em 0 1.5em;
padding-bottom:2.5em;

Asi quedaria:



y el ultimo pasito es dar vista previa y guardar.

Miku [Rainmeter]

aww por fin es vierneees ^v^
dia para relajar y echar mucha webita hahahah
y ver unas peliculas de terror xD
a mi se me antojan ver de esas porque por aca esta nubladito el dia
asi que sera perfecto n.n
Bueno ahora les traigo unos skins de rainmeter..
recuerdan ese programa?
hace ya bastante tiempo hice una entrada sobre eso,
Ahora porque se los recuerdo??
bueno es que traigo unos skin de vocaloid muy lindos y divertidos..
ya los probe todos en mi pc y funcionan a la perfeccion xD
para los que no saben que es ni como usarlo aqui les pongo el link
para que lo chequen okis ^^?
trae anexo el tutorial de como se utiliza:

Tutorial Rainmeter

oKa ahora los skins

Cute carpetitas

jelOw mis blogueras tengo un pack recien salidito del horno xD los hice con mis manitas mias de mi hahah (ando bien simple hoy u.U) es la primera vez que hago carpetitas espero les gusten mucho :( porque me desarme haciendolos xD haha no se crean (se golpea) aww bueno si un poquito n.n

el pack trae 22 carpetitas pero 17 son las importantes son extencion ICO Y PNG se me paso poner en la imagen que tambien son .ico xD

Poner un menu al lado [Como el miO]

Menu estatico com el mio xD

es muy sencillito ...empezemos ^^

anda a Diseno Elementos de Pagina Anadir Gadget Html/Javascript

copia el siguiente codigo y pegalo en el gadget

<div style="position: absolute; top:0px;left:300px; ">
<a href="URL DEL LINK"><img src='URL DE LA IMAGEN'/></a>
<a href="URL DEL LINK"><img src='URL DE LA IMAGEN'/></a>
<a href="URL DEL LINK"><img src='URL DE LA IMAGEN'/></a>
<a href="URL DEL LINK"><img src='URL DE LA IMAGEN'/></a>
</div>

Lila: url de la direccion de la entrada
rosita: url de la direccion de tu imagen.

si quieres añadirle otra pestanita solo agregale otro

<a href="URL DEL LINK"><img src='URL DE LA IMAGEN'/></a>

Ustedes pueden hacer sus propios disenos n.n yo los hice con medidas width (ancho) 170px y height (largo) 50 px con fondo transparente.

Personalizando el Scroll Bar

hOla blogueritas hoy vamos a personalizar nuestro scroll bar de 2 maneras que les parece ^^ se mira muy bonito verdad n.n una sera con colores y el otro con fondos o backgrounds de las 2 formas se mira muy bien.

oka empezemos ^^

Scroll Bar con 2 colores:

Nos vamos a

Diseno Edicion de Html Editar Plantilla

Pulsamos Ctrl + la tecla "F" y buscamos ]]></b:skin>

Pegamos el siguiente codigo justo arriba de ]]></b:skin>

::-webkit-scrollbar {

height: 12px;

width: 15px;

background: #FA58D0;

}

::-webkit-scrollbar-thumb {

background: #00BFFF;

-Moz-border-radius-bottomRight: 50px; border-bottom-right-radius: 50px; -Moz-border-radius-topLeft: 50px; border-top-left-radius: 50px;

}

quedando asi:

moradito: la forma del scroll bar

Rosita: Codigo del color

Dar vista previa y guardar.

Scroll Bar con 2 fonditos o backgrounds

igual nos vamos a:

Diseno Edicion de Html Editar Plantilla

Pulsamos Ctrl + la tecla "F" y buscamos ]]></b:skin>

Pegamos el siguiente codigo justo arriba de ]]></b:skin>

::-webkit-scrollbar {

height: 12px;

width: 15px;

background-image:url(URL DEL FONDO);

}

::-webkit-scrollbar-thumb {

background-image:url(URL DEL FONDO);

-Moz-border-radius-bottomRight: 50px; border-bottom-right-radius: 50px; -Moz-border-radius-topLeft: 50px; border-top-left-radius: 50px;

}

moradito: la forma del scroll bar

Verde: direccion o url del fondo

Luego dar vista previa y guardar.

Aqui les pondre la forma que pueden darle al scroll bar

Forma 1:

-Moz-border-radius: 5px; border-radius: 5px;

Forma 2:

-Moz-border-radius-bottomRight: 50px 25px; border-bottom-right-radius: 50px 25px; -Moz-border-radius-topLeft: 50px 25px; border-top-left-radius: 50px 25px;

Forma 3:

-Moz-border-radius-bottomRight: 50px; border-bottom-right-radius: 50px; -Moz-border-radius-topLeft: 50px; border-top-left-radius: 50px;

Forma 4:

-Moz-border-radius-topLeft: 50px; border-top-left-radius: 50px; -Moz-border-left-bottomleft: 50px; border-bottom-left-radius: 50px;

Ahora si le quieres agregar un Borde a la forma del scroll bar como este ejemplo

Solo agregale este codigo abajo de ::-webkit-scrollbar-thumb {

border: 2px dashed #190707;

quedando asi:

bordes

creo que es todo xD espero les haya gustado el tutorial y me dejen sus comentarios n.n

separadores

hola blogueritas estaba algo aburridilla con algo se suenio no sabia que hacer asi que abri photoshop x.x despues de un ratito se me vino la idea de hacer unos separadores xD y bueno salieron estos que ven aqui xD estan bastante sencillitos espero les gusten ^^

poner un iconito en el titulo de la entrada [ derecha, izquierda o ambos lados ]

me lo pidieron por un ladito pero weno yo les pongo en 3 formas xD

oKiii empezemos:

Como siempre entramos a :

Diseno >> Edicion Html >> Editar Plantilla >> Expandir artilugios

Damos Ctrl + la tecla "F" y buscamos este codigo:

<a expr:href='data:post.url'><data:post.title/></a>

y pegamos (codigo a pegar)

<img src='URL DE LA IMAGEN'/>

para poner el iconito al lado derecho:

ponemos el codigo entre <a expr:href='data:post.url'> y <data:post.title/></a>

quedando asi:



luego presionar guardar.

para ponerlo el iconito al lado izquierdo

ponemos el codigo justo adelante o enfrente de <data:post.title/>

quedando asi:



luego presionar guardar.

y para ponerlo en ambos lados

(aqui lo pegaremos 2 veces) pegamos el codigo delante de <a expr:href='data:post.url'> y atras de </a>


quedando asi:



luego presionar guardar.

Espero les haya gustado el tuto *v* por favor no copy cat grax ^^

imagenes [subir] hechas por mi xD

hola blogueritas hoy tengo un poquito de tiempo libre asi que me puse a hacer estas imagenes para que las pongan en la esquina de su blogui n.n son poquitas pero como siempre las hice con mucho carinio =D.

Y por si no recuerdan como ponerlos en su blogui da clic aqui para ir al tutorial xD

1.- 2.- 3.- 4.-
5.- 6.- 7.-
8.- 9.- 10.-
11.-

Aqui los links como ven estan enumeradas

http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii11.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii10.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii9.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii8.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii7.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii6.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii5.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii4.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii3.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii2.png
http://i1063.photobucket.com/albums/t514/Annyz-Kawaii/cutesubirbyannyz-kawaii.png

Si tomas mi trabajo pon los creditos correspondientes no tomes mis entradas y las hagas por tuyas okei?