Resaltar la entrada actual en el «Archivo del blog»
Continuando con el Archivo del blog, también deseaba resaltar el enlace de la entrada en tal caso estuviéramos en ella. La parte del widget encargada de maquetar la lista es la siguiente:
<b:includable id='posts' var='posts'>
<ul class='posts'>
<b:loop values='data:posts' var='post'>
<li>
<a expr:href='data:post.url'>
<data:post.title/>
</a>
</li>
</b:loop>
</ul>
</b:includable>
Bastaba con añadir una clase o emplear un nombre único al vínculo para posteriormente aplicarle los estilos, así que recurrí al operador ternario para colocarlo en el enlace correspondiente, comparando su dirección con la de la página actual:
<b:includable id='posts' var='posts'>
<ul class='posts'>
<b:loop values='data:posts' var='post'>
<li>
<a expr:href='data:post.url' expr:class='data:post.url == data:blog.url ? "current-post" : ""'>
<data:post.title/>
</a>
</li>
</b:loop>
</ul>
</b:includable>
Lo que restaba por hacer era agregar las instrucciones en el CSS. Un ejemplo sería:
#ArchiveList .current-post {
color: red !important; /* Lo colorea de rojo */
text-decoration: none !important; /* Evita que se subraye */
}
Publicar un comentario
Sé respetuoso, no publiques información personal (p. ej., direcciones de correos electrónicos) y evita el contenido publicitario o que esté fuera del tema tratado. El comentario estará visible después de ser aprobado por el administrador.