Facilitar la selección de los títulos de las entradas

Aparentemente, estos dos títulos son iguales porque se ven iguales pero no lo son. En ambos casos, se trata de simular el título de las entradas de una plantilla; el primero utiliza las propiedades por defecto de una Plantilla de Blogger como la Mínima y el otro no.

El título de mi entrada


El título de mi entrada


Son enlaces, como es lo habitual en los títulos de las entradas de un blog y el problema que suele tener el primero, es que no es sencillo de seleccionar, algo que uno hace muchas veces cuando quiere copiarlo. No es que sea imposible pero no es cómodo y la posibilidad de poder seleccionar los títulos es algo que debemos tener en cuenta.

Esos títulos pueden estar en diferentes etiquetas (h1 h2 h3) y esa etqiueta tiene definida una serie de propiedades, por defecto, algo así:
.post h3 {
.......
}
.post h3 a, .post h3 a:visited, .post h3 strong {
.......
display:block;
}
.post h3 strong, .post h3 a:hover {
.......
}
Lo que causa el "problema" es justamente esa definición de display:block en el enlace y basta quitarla para que todo sea "normal".

Poniendo el cursor encima de esos ejemplos, se vera que en el primer caso, el rectángulo del enlace ocupa todo el ancho disponible y podrá hacerse click en cualquier parte, incluso en las áreas vacías cuando, en realidad, lo razonable sería que el enlace sólo funcionara sobre el texto mismo que es lo que ocurrirá si se elimina esa propiedad.

Alguien, preguntó si es necesario que los títulos de las entradas sean enlaces y para eso no hay respuestas objetivas; creo que es lo lógico y que es útil porque incluso en una página individual cuando parecería no tener sentido ya que es un enlace a la misma página, uno suele usarlo para recargarla, para copiar la URL del enlace, para arrastrarlo a alguna herramienta, etc.

De todos modos, esa parte se encuentra dentro de un INCLUDABLE que podemos ver al expandir la plantilla:
<b:includable id='post' var='post'>
Allí veremos un código similar a este:
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>
Lo que controlan esos condicionales es justamente la forma en que se mostrará el título; si es un enlace o si no lo es; bastaría editarlo para que los títulos dejaran de ser enlaces:
<h3 class='post-title'>
<data:post.title/>
</h3>

0 comentarios:

Publicar un comentario