jueves, 14 de marzo de 2013

Principales Condicionales de Blogger



Todas estas técnicas de mostrar los elementos de cierta forma sólo en determinadas páginas se logra con los códigos condicionales de Blogger.
Las condicionales son códigos que indican dónde debe ejecutarse algo y dónde no. Es decir, condiciona una orden.
De esta forma podemos hacer que un script, un video, una imagen, un gadget, un mensaje, un truco, estilos, etc. se muestre sólo en la portada del blog, o sólo en las entradas, o sólo en las páginas estáticas, o sólo en las listas de archivos, o en una entrada específica.

Usarlos es sencillo, sólo hay poner al inicio del elemento que queremos condicionar el código que específica y condiciona dónde se mostrará, y al final de este el cierre de la etiqueta.

Mostrar /ejecutar un elemento sólo en la portada del blog


<b:if cond='data:blog.url == data:blog.homepageUrl'>
...Aquí va el código del elemento...
</b:if>

Mostrar /ejecutar un elemento sólo en las entradas individuales


<b:if cond='data:blog.pageType == &quot;item&quot;'>
...Aquí va el código del elemento...
</b:if>

Mostrar /ejecutar un elemento sólo en las páginas del archivo del blog


<b:if cond='data:blog.pageType == &quot;archive&quot;'>
...Aquí va el código del elemento...
</b:if>

Mostrar /ejecutar un elemento sólo en las páginas estáticas


<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
...Aquí va el código del elemento...
</b:if>

Mostrar /ejecutar un elemento en una entrada específica o etiqueta específica


<b:if cond='data:blog.url == &quot;URL de la entrada o etiqueta&quot;'>
...Aquí va el código del elemento...
</b:if>


Por lo contrario también podemos especificar que se muestre en todas partes excepto en un lugar específico.

Mostrar /ejecutar un elemento en todas las páginas MENOS en la portada del blog


<b:if cond='data:blog.url != data:blog.homepageUrl'>
...Aquí va el código del elemento...
</b:if>

Mostrar /ejecutar un elemento en todas las páginas MENOS en las entradas individuales


<b:if cond='data:blog.pageType != &quot;item&quot;'>
...Aquí va el código del elemento...
</b:if>

Mostrar /ejecutar un elemento en todas las páginas MENOS en las páginas del archivo del blog


<b:if cond='data:blog.pageType != &quot;archive&quot;'>
...Aquí va el código del elemento...
</b:if>

Mostrar /ejecutar un elemento en todas las páginas MENOS en las páginas estáticas


<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
...Aquí va el código del elemento...
</b:if>

Mostrar /ejecutar un elemento en todas las páginas MENOS en una entrada específica o etiqueta específica


<b:if cond='data:blog.url != &quot;URL de la entrada o etiqueta&quot;'>
...Aquí va el código del elemento...
</b:if>

En donde dice ...Aquí va el código del elemento... se agrega lo que se desea condicionar, por ejemplo el script, el código del truco, o los estilos.
Por ejemplo, para que la sidebar tenga un color de fondo diferente sólo en la portada del blog se usaría este código antes de </head> lo siguiente:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>
#sidebar-wrapper {
background: #0080FF;
}
</style>
</b:if>

Eso haría que la barra lateral tenga un color de fondo azul en la portada pero cuando se esté en cualquier otra página cambie al color normal que tiene la plantilla.

De esta forma condicionamos la forma que se verá el blog según la página donde se esté.
Como mencioné antes se puede hacer para un sin fin de cosas, desde un simple estilo hasta condicionar todo un contenedor como la sidebar.

No hay comentarios:

Publicar un comentario

Descripcion en imagenes con efecto deslizante usando css

Una forma de agregarle mas estilo a nuestras imágenes y hacer que nuestro blogs sea mas profesional, es poniendo una pequeña descripc...