
Poner el separador es de lo más sencillo, sólo entra en Diseño > Edición de HTML, marca la casilla Expandir plantillas de artilugios y busca esta línea:
<b:include data='post' name='post'/>
Justo debajo de ella pega lo siguiente:
<center><img src='URL de la imagen'/></center>
Sólo cambia lo que está en rojo por la URL de la imagen de tu separador. Así se simple tendrás un separador de entradas en tu blog.
En Smashing Magazine tienen más de 100 separadores que ponen a tu disposición de muchos diseñadores y que son de uso libre. Puedes escoger el que más te guste y guardarlo o puedes descargar el pack con todos los diseños de los separadores.
Si no te convencen las imágenes y te gustan los diseños más simples puedes optar por poner una línea de color; para ello puedes usar el atributo <hr /> al cual se le pueden agregar estilos para hacerlos más llamativos.
Si te decides por esta forma entonces el código que deberás pegar será este:
<hr style="align:center; background:#000000; border:0px; height:5px; width:60%;" />
En background:#000000; puedes modificar el código del color que prefieras, en height:5px; la altura de la línea (en pixeles) y en width:60%; el ancho de la línea (en porcentaje).
Estos son algunos ejemplos de los separadores con distintos colores:
<hr style="align:center; background:#0080FF; border:0px; height:5px; width:60%;" />
<hr style="align:center; background:#FF0080; border:0px; height:5px; width:60%;" />
<hr style="align:center; background:#FFFF00; border:0px; height:5px; width:60%;" />
Tantos códigos me han dado mucha sed ¿qué tal una cerveza?



Enlaza este blog
Suscribirse al feed
Suscribirse por e-mail
Agregar en tu iGoogle
Seguir en Twitter
Enviar un correo
¿Dónde estás Superman?
Iconos RSS




55 comentarios:
wowwwª!!!!
estyo si es lo maximo!
lo estube buscando por todos lados
gracias potro!
SALU2
Esto está la mar de chulo, pero a mi no me surge efecto ni en IE ni en Firefox. Creí que era por el enlace de la imagen pero no, por que he copiado uno de esos tuyos y tampoco
Saludos
Blogio, qué bueno que al fin lo encontraste!
Meri, necesitaría que pongas el código en la plantilla y me digas en cuál blog para ver dónde puede estar el problema.
Potro me volviste a impresionar, la verdad los estuve buscando pero nada, bueno fue hace ya algo de tiempo para un post en Curiosidades del Mundo, pero pues que bueno es tener a Ciudad Blogger como ayuda
que bueno que todavia tienes muchas cosas que postear aqui espero que nunka se termine Ciudad Blogger
Muy bueno
ahora ¿se puede poner un enlace en la imagen?
saludos
Uy que buenos !!!
Me gustó el azul, pero para ponerlo en el mismo post, y separar temas. Asi que lo llevo y lo copio en la plantilla de diseño de las entradas, asi lo tengo siempre al escribir y editar una entrada nueva (si no lo voy a necesitar, solo lo elimino) ;)
Genial !!!
Besotes!!!!!!!!!!!!
TQM :) :) :)
Alex, gracias, si te decides a ponerlo ya sabes cómo ;)
El Venado, claro, sólo agregas el código del enlace, incluso en lugar de estos separadores podrías incluir banners.
María Rosa, qué gran idea, así tendrás más organizado el contenido dentro del post, besos!
Potro!!! te pusiste romanticon! ^^ jajajaja
Bueno como tu ya sabes cada post que hacer aqui, siempre me parece genial, y este no es la excepcion.
Me gusta el azul, voy a intentar utilizarlo, gracias
Potro, de nuevo lo has conseguido, me encanta!^^
Ahorame pregunto si se podría alternar 2 diferentes entre los posts?
Algo habré hecho mal seguro
Lo tengo puesto aquí
http://lascositasdemeri.blogspot.com/
hola potro(de nuevo xD)
hay forma de cambiar el deja un comentario por una imagen?
y qu este al final de la entrada
gracias!
SALU2!
PepeX, no es para menos, es el mes del amouuur ♥
monica, excelente elección ;)
Fran Cruz, no, sólo se puede una imagen.
Meri, no veo el código puesto en la plantilla, pero estoy casi seguro que el problema es la URL de la imagen, yo he probado en una rounders 3 y no tuve problema alguno.
Blogio, aquí está lo que buscas.
emm... en el perfil de alex?
hay esta el perfil de alex..
te equivocastes no?
No sé a qué enlace estés haciendo click, pero no, no es el perfil de Alex, es el enlace al tutorial.
Hayy el amor!!! xD. jajajaja este mes pone sentimental a cualkiera.
Perdon mi buen amigo por estar molestandote a cada rato con mis dudas que hasta yo puedo resolver.
Lo que pasa es que te hiba a preguntar otra cosa, pero hasta ahora no la recuerdo, pero no se, creo que ya soy adicto a comentar en ciudad blogger jaja.
espero que eso no te moleste
mmmm...Bro, no quiero decir nada pero creo que Alex acaba de hackear tu blog...jajajajaja
Estuve mirando los diseños de los separadores y la verdad que me dieron muchas ganas de implementarlo...pero no... tengo que contar hasta diez... no debo ser tan impulsivo con tus trucos XD...
Un abrazo!!!
El Venado, jajaja por supuesto que no me molesta, pero si me preocupa tu Alzheimer :)
bro, jajajajaja, eso explicaría por qué mis enlaces dirigen a su perfil. Un abrazo!
Si, que esta puesto tal que así
AGGGGGGGGGGGG, no sale el trocito de la plantilla te lo pongo por email
Potro, ya he visto que sale, pero no en la página principal si no cuando abres una entrada
Hola Meri,
En el caso de tu plantilla tienes dos veces esta línea:
<b:include data='post' name='post'/>
Eso es porque tienes modificada la opción de mostrar los títulos expandibles en una búsqueda.
Lo único que tienes que hacer es poner el código de la imagen en el segundo <b:include data='post' name='post'/> que encuentres (está tres líneas abajo del primero)
Cualquier cosa me comentas.
Saludos.
Potro muchisimas gracias, "problema" solucionado
Te conteste al email
Saludos
Excelente Meri, ya lo veo funcionando en tu blog ;)
Saludos.
Gracias, estaba buscando un detalle así.
Mu bonico.
Seguro escogerás un separador muy bueno ;)
Saludos.
Por nada, me alegro que lo hayas encontrado útil ;)
Potro, ¿hay alguna posibilidad de ponerlo de manera que salga un separador aleatorio cada vez que entres en el blog?
Hola Fran Cruz,
Sí, sí se puede. En ese caso en vez del código que menciono debes poner este:
<script language='javascript' type='text/javascript'>
function randRange(lowVal,highVal) {
return Math.floor(Math.random()*(highVal-lowVal+1))+lowVal;
}
</script>
<script language='javascript' type='text/javascript'>
//<![CDATA[
var randHdr = randRange(1,5);
if (randHdr == 1) {
document.write('<img src="URL DE LA IMAGEN">')
} else if (randHdr == 2) {
document.write('<img src="URL DE LA IMAGEN">')
} else if (randHdr == 3) {
document.write('<img src="URL DE LA IMAGEN 3">')
} else if (randHdr == 4) {
document.write('<img src="URL DE LA IMAGEN 4">')
} else if (randHdr == 5) {
document.write('<img src="URL DE LA IMAGEN 5">')
}
//]]>
</script>
Para saber cómo agregar más imágenes visita este tutorial, es el mismo código que se usa para las cabeceras cambiantes.
Saludos.
Por cierto, que con este método sí podrás tener dos diferentes en el blog como lo habías pedido, no me había fijado que con este método se puede, aunque claro, siempre serán al azar.
Hola! felicitaciones por toda la enseñanza que nos brindas!
Consulta, y por favor, tomá en consideración que soy novata en esto de los blog.
Coloqué una plantilla Minima Black, pero no encuentro el campo que hacés mensión...puede ser que se llame de otra forma? porque no encuentro nada que diga <b: include data= "post"...."
Gracias desde ya!
Hola Momentos,
Necesitas marcar la casilla Expandir plantillas de artilugios para poder localizarlo.
Saludos.
Pero que rapidéz!! no pensé me ibas a responder tan pronto! gracias mil!
Ahhh!! pero te anticipé que era novata!! jaja ahora intento nuevamente! gracias! gracias! gracias! todavía hay gente buena en este mundo eh!
Todos somos novatos alguna vez, así que no hay problema ;)
Saludos!
:) todo salió de maravillas!!
joé, macho... estoy leyendo los comentarios... ¿nunca te "pillan" sin saber la respuesta? Eres un fenómeno, tío!
Jajaja, no te creas, a veces sí sucede :D
Saludos.
Hola, tengo un problema xD pongo una imagen tal y como sale en la entrada, justo debajo de ese codigo, y cuando guardo sale la imagen del separador justo encima del encabezado O.o
Espero que me podais ayudar, gracias :$
Es que es justo lo que hace este hack, pone una imagen entre la última entrada y la nueva, es por eso que lo ves arriba del título de la otra entrada porque lo que está separando.
Saludos.
me sirvio muchísimo..mil gracias.
saludos
Qué gusto que te haya sido de utilidad.
Saludos.
Y porque a mi se me ve encima del encabezado? (imagen que tengo como título de blog)
Sobre el título del blog no debería salir, al menos yo hice la prueba con la plantilla que usas y no tuve ese problema.
Lo que puedes hacer es poner después del código de la imagen esto:
<br /><br /><br />
De esta forma se hará un espacio que quizá te ayude a que no se vea tan encimado todo.
Saludos.
Gracias. en verdad me ha servido mucho toda tu ayuda y todo lo que indicas en tu blog...
gracias por todooo....
pronto hare mi propio blog y con todo y tu ayuda sera fenomenal.. mil graxiii
Hola avi-veracruzana,
Gracias a ti por tus comentarios y tu visita.
Qué bueno que este sitio te ha podido ser de ayuda.
Saludos.
Genial! Creo que un separador grunge vendrá de maravilla, pronto te lo enseñaremos xD :)
¡Un saludo!
Seguro que les quedará perfecto ;)
Abrazos!
Hola Potro!
el separador me quedo perfecto; ahora el tema es q me quedo es separador q trae blogger por defecto, o sea, estan los dos, te dejo la dire si quieres verlo:
http://alcobavisual.blogspot.com
arriba ciudad blogger!
salut!
Hola Pedro,
Busca esta parte:
.post {
margin:.5em 0 1.5em;
border-bottom:1px dotted $bordercolor;
Borra lo que está en negrita y listo ;)
Un abrazo!
gracias maestro!
un abrazo!
hola Mr.Potro, yo he optadp por el diseño sencillo de la línea en negrita...
Pero no me causa efecto...he guardado los cambios, he refrescado la página principal...
Que puedo hacer??...
P.D.-desde que he descubierto tu ciudad, casi no duermo!! jejeje y mi blog es otro!!
GRACIAS.
Hola Sergio ♫♫♫,
Quizá es por el gadget que tienes de "Nuestros lectores también disfrutaron" es posible que esté interfiriendo en esa área donde se debería mostrar el separador.
Saludos y gracias por tus comentarios :)
Gracias Mr.Potro, ese gadget me vino junto con las estrellas de puntuación...
Vale, creo que se queda como está. Muchas gracias, Mr.
Por nada :)
Publicar un comentario en la entrada
Gracias por tus comentarios. Si tienes una consulta sobre tu blog deja la dirección del mismo.