Publicado por.. y otros datos a debajo del título

Normalmente el "Publicado por" la hora de publicación de la entrada los "comentarios" y las etiquetas, se muestran debajo de cada entrada.
He recibido un email de salytre donde me pide si puedo explicar como mover estos datos del "post-footer" (pie de entradas) para hacer que se muestren debajo del título de cada entrada...

[1] Nos situamos en nuestro panel de Blogger "edición html" y expandimos los artilugios para localizar esta línea de código ya que será justo debajo de esa línea a donde tendremos que trasladar los códigos para mostrar los elementos del post-footer debajo de los títulos de las entradas:

<div class='post-header-line-1'>


[2] Localizamos ahora el código que corresponde al "Publicado por":
<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

Lo copiamos, borramos el original y pegamos el que acabamos de copiar, debajo de la línea que localizamos antes:
<div class='post-header-line-1'>
<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

Mover la hora de publicación a continuación del "Publicado por"

[1] Vamos a colocar ahora la hora de publicación de la entrada a continuación del autor que ya habíamos movido antes a debajo del título, para ello tenemos que localizar el código que corresponde a la hora:
<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>
</b:if>
</b:if>
</span>

Y colocarlo a continuación del código para el "Publicado por" que acabamos de mover:
<div class='post-header-line-1'>
<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>
</b:if>
</b:if>
</span>

Mover "comentarios" a debajo del "Publicado por" y la hora del post

[1] Moveremos ahora el enlace de "comentarios" desde el pie de la entrada a debajo del título, a continuación de lo que hemos colocado antes.
Seguimos con los artilugios expandidos y localizamos el código que corresponde al enlace para dejar comentarios:
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>

<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

Lo colocamos a continuación del "Publicado por" y la hora de la entrada, que habíamos cambiado de lugar previamente:
<div class='post-header-line-1'>
<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>
</b:if>
</b:if>
</span>

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

Mover las etiquetas

[1] Los pasos a seguir son idénticos a los anteriores; localizamos el código que muestra las etiquetas debajo de cada entrada:
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>

Lo copiamos, borramos el original y pegamos la copia debajo de los anteriores:
<div class='post-header-line-1'>
<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

<span class='post-timestamp'>
<b:if cond='data:top.showTimestamp'>
<data:top.timestampLabel/>
<b:if cond='data:post.url'>
<a class='timestamp-link' expr:href='data:post.url' title='permanent link'><data:post.timestamp/></a>
</b:if>
</b:if>
</span>

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>


Nota: Si queremos que las etiquetas o los comentarios se muestren en una segunda línea, en lugar de a continuación de los otros elementos, incluiremos su código entre <br> y </br>.
Por ejemplo las etiquetas:

<br><span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span></br>

Resultado:
Ejemplo de elementos debajo del titulo

0 comentarios:

Publicar un comentario