JMiur [E]

Última respuesta genérica de la semana complice

¿Es posible personalizar la sidebar para que ciertos elementos no se muestren cuando estamos en las páginas de posts individuales y si lo hagan en la página principal? ¿Puede ocultarse? ¿Pueden tenerse dos sidebars distintas, una vertical para la página principal y otra horizontal para las páginas individuales?


La respuesta genérica es SI ... pero confuso

En todos los casos, lo más sencillo es utilizar los códigos condicionales de Blogger. Por ejemplo, si queremos que la sidebar se muestre distinta en las página individuales, justo antes de </head>, agregamos lo siguiente:
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
... aquí colocamos las propiedades ...
</style>
</b:if>
Es decir, tenemos dos grupos de propiedades, las normales están en <b:skin> </b:skin> que son las que se utilizan por defecto y las nuevas las colocamos dentro de un condicional que sobrescribe, agrega o cambia las primeras.

Lo mismo podemos hacer para que cieros elementos se muestren o se oculten pero, para eso, debemos buscar en la plantilla el ID de cada uno. Sin expandir, podríamos ver algo así:
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML1' locked='false' title='elemento1' type='HTML'/>
<b:widget id='Feed1' locked='false' title='elemento2' type='Feed'/>
<b:widget id='HTML2' locked='false' title='elemento5' type='HTML'/>
<b:widget id='Label1' locked='false' title='elemento3' type='Label'/>>
<b:widget id='BlogArchive1' locked='false' title='elemento4' type='BlogArchive'/>
</b:section>
¿Queremos que en la página principal se vean sólo cuatro y el quinto permanezca oculto? Pués entonces, dentro de <b:skin> </b:skin> debemos indicarle que se oculte con:

#HTML2 {display:none;}

¿Queremos que en la página de posts se oculten los elementos 2 y 4? Entonces, antes de </head> ponemos:
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
#Feed1 {display:none;} /* ocultamos el elemento 2 */
#BlogArchive1 {display:none;} /* ocultamos el elemento 4 */
#HTML2 {display:block;} /* mostramos el elemento 5 */
</style>
</b:if>
Resumiendo, haciendo uso de los condicionales, determinamos qué elementos se muestran y cuales se ocultan. Pero claro, todo lo demás dependerá de cada plantilla y habrá miles de posibles combinaciones.

21 comentarios:

Azul  

Hola!

Mi pregunta no tiene nada que ver con el post que publicas hoy(eso si, me esta gustando porque me va a servir para algo específico de mi blog) sino, algo más sencillo, o eso espero.

Cómo puedo hacer que el enlace para los comentarios en mi blog, aparezcan al final de cada post, como en el tuyo y la mayoría de los blogs. En el mío aparece junto a la fecha de publicación y título y honestamente no me gusta, ya he toqueteado la plantilla, pero no encuentro como ponerlos al final de cada post.

Espero que puedas ayudarme....te dejo mi correo, por si tienes tiempo me orientes.

Gracias!!

ventana.azul@gmail.com

Responder
JMiur  

Te he enviado un mail con una explicación a ver si te resulta útil.

Responder
Azul  

Me ha resultado genial....gracias, gracias...Un bikiño enorme! :D

p.d. te he enviando otro con otra duda...claro, soy abusona.

Responder
JMiur  

Me alegra que funcionara, ahora voy a leer tu mail :)

Responder
Azul  

Lo he visto, ya....gracias otra vez....por tu atención, mañana lo aplico y seguro que funciona!

:D!

Responder
Tincho  

Uff que bueno que esta este blog!!muchas gracias

Responder
Beto  

Nomas no entiendo xD

dejo mi correo por si puedes enviarme una explicacion con peras y manzanas

saludos

beto.paty@live.com.mx

Responder
Pablo  

Hola , muchas gracias por este post , busque esto durante mucho tiempo :D ; pero aun tengo una duda ; como puedo hacer para que la sidebar o un elemento cualquiera no aparesca en la pagina principal pero si en los post individuales ; gracias y saludos :)

Responder
JMiur  

Depende de lo que quieras hacer, Pablo pero, en general, se consigue usando los condicionales de Blogger. Fíjate en este post.

Responder
Admin  

Estimado ante que nada agredecerle por la excelente pagina que nos ha sido util a los que empezamos en el mundo de los bloggers.. bueno al grano deseo saber si es posible que una imagen cualquiera se muestre en la principal pero no en las individuales pero que no esta situada en ninguna sidebar.. no se si me explico pero por ejm tengo esta pagina http://jorgearay.blogspot.com/ y deseo que solo en la principal aparezca esa imagen grande y en las individuales no aparezca .. alguna ayuda gracias de antemano..

Responder
JMiur  

No sé exactamente cuál es la idea estética pero, una forma sería condicionar esa parte.

Como la imagen esá en un DIV llamado #header-inner, podrías poner algo así antes de </head>

<b:if cond='data:blog.homepageUrl != data:blog.url'>
<style>
#header-inner {display:none;}
</style>
</b:if>

Es decir, se oculta ese DIV en todas las páginas, excepto en el home.

Responder
Sebas  

Hola me gustaria si podes mostrar como dejar los comentarios recientes como estan en esta blog

desde ya muchas gracias

Responder
JMiur  

Fíjate en estas dos entradas. la original y una ampliación.

Responder
racnarok  

Una pregunta, como hago para que esto funcione con los label?
Es que nuestro en nuestro blog las entradas se enlazan mayoritariamente con los "search/label", pero no tengo idea de como aplicar esto para que oculte elementos cuando se acceden a los label.

Responder
JMiur  

No hay un condicional para etiquetas exclusivamente. Para Blogger es el mismo tipo de página similara la lista de archivos, por ejemplo. En esta entrada hay una lista de ñlos distintos condicionales.

Responder
racnarok  

Pura vida men, encontré la entrada que decías, ya entendí mejor lo de las condiciones, ahora ya puedo hacer lo que quería jojojo.

Responder
Jhony Page  

xD! sin quere encontre este post y era lo que estaba buscando hace mucho tiempo!

Responder
Lisímaco Henao H.  

Amigo, gracias por todo. Estoy dando vueltas por la red buscando OCULTAR LA SIDEBAR EN LAS PÁGINAS INDEPENDIENTES DE BLOGGER. Hay muchos trucos pero ninguno me funciona... tengo una plantilla de las nuevas de blogger "Fantástico S,A." por TinaChen.
www.jungcolombia.blogspot.com

Responder
JMiur  

Ell código condicional es siempre el mismo:

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
... esto sólo se ejecutará en las páginas estáticas
</b:if>

Lo que deberías poner dentro de eso es algo así:

<style>
.column-left-inner {display:none !important;}
</style>

Pero, eso no significa que se expanderá la columna de las entradas, para eso, deberás agregar más cosas, ampliar su ancho, etc, siempre, todo eso, dentro del estilo que está en el condicional.

Responder
todo es  

a que te refieres con agregar las propiedades en ese codigo?

Responder
JMiur  

A agaregar las reglas de estilo que quieres que se apliquen a eso que quieres mostrar de manera diferenciada: ancho, colores, fuentes, etc.

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR