toggle

Aprende a usar condicionales b:if de Blogger

min rel

La etiqueta b:if muestra el contenido cuando su condición se cumple, caso contrario no muestra nada. Puedes mostrar algo en caso de que la condición no se cumple se utiliza b:else o b:elseif.


Condiciones

La mayoría de las etiquetas "data" al utilizarlas como condición devuelven el valor "true". La etiqueta <data:blog.title/> muestra el título del blog, en una condición nos quedaría:


<b:if cond='data:blog.title'>
  <!--Si el título del blog existe, se muestra esto-->
</b:if>

Si queremos mostrar algo en caso de no cumplirse la condición, podemos usar b:else:


<b:if cond='data:blog.title'>
  <!--Si la condición se cumple se muestra esto-->
<b:else/>
  <!--Caso contrario, se muestra esto-->
</b:if>

También podemos crear una nueva condición mediante b:elseif y agregar b:else como el contenido por defecto, en caso de que ninguna se cumpla.


<b:if cond='data:blog.title'>
  <!--Si la condición se cumple se muestra esto-->
<b:elseif cond='data:blog.pageTitle'/>
  <!--Si la primera condición no se cumple se comprueba esta condición y se muestra esto-->
<b:else/>
  <!--Si ninguna condición se cumple se muestra esto-->
</b:if>

Operadores

Podemos comparar datos utilizando operadores, como si de javascript se tratara. Por ejemplo: "==" compara la igualdad:


<b:if cond='data:blog.url == data:blog.homepageUrl'>
  <!--Se muestra si la url es igual a la página principal,-->
</b:if>

Por otro lado, tenemos "!=", que hace lo contrario:


<b:if cond='data:blog.url != data:blog.homepageUrl'>
  <!--Se muestra si la url No es igual a la página principal,-->
</b:if>

En caso de usar string (Cadena de caracteres como texto) en alguna parte de la comparación, se debe utilizar comillas dobles "", por ejemplo:


<b:if cond='data:blog.title == "Daniel"'>
  <!--Se muestra si el titulo del blog es Daniel-->
</b:if>

Selector ternario

Nos permite crear condiciones dentro de atributos html, puede ser útil para realizar modificaciones sin tener que repetir el codigo. Su sintaxis es:


[condición] ? [Si se cumple (true)] : [Si no se cumple (false)];

En el siguiente ejemplo comprobamos si los comentarios están permitidos, para mostrar una clase según la situación.


<div expr:class='data:post.allowComments ? "permitido" : "no-permitidos"'>
   <!-- Comentarios -->
</div>

Los condicionales juegan un papel importante en la estructura de tu blog, por lo tanto, aprender a utilizarlo te puede resultar muy útil.