Home » Wordpress » Desarrollo Wordpress » Como diferenciar o resaltar el primer post del resto en una plantilla de WordPress

Como diferenciar o resaltar el primer post del resto en una plantilla de WordPress

primer post 560x212 Como diferenciar o resaltar el primer post del resto en una plantilla de Wordpress

Supongo que habréis visto cientos, miles o millones de páginas web realizadas con WordPress en las que el primer post está destacado del resto con algún adorno especial o simplemente se ha diferenciado su formato del resto de entradas. Esto se consigue insertando un contador en el loop de WordPress y haciendo que todo lo que sea menor o igual a1 utilice un HTML y CSS y el resto utilice otro.

Por supuesto dentro del codex de WordPress hay solución a todo y si no en sus foros de ayudas seguro que también encontraréis soluciones casi a todo lo que se os ocurra. Hoy os paso a comentar como resaltar o diferenciar el primer post de WordPress del resto.

Como hemos comentado la cuestión está en entrar en el Loop y utilizar un contador cosa que haremos de esta forma:


<?php $contador_post=0; if (have_post() : ?> //iniciamos el contador a cero

<?php while (have_post()) : $contador_post= $contador_post+1; the_post();?> //en cada recorrido del loop el contador irá sumando

<?php if ($contador_post==1) { ?> //condicional para saber si estamos en el primer post

&nbsp;

Aquí iría el código HTML en el que encerraríamos el primer post

&nbsp;

<?php  } ?>

<?php if ($contador_post>=2) { ?> //condicional para saber que no estamos en el primer post

Aquí iría el código HTML en el que encerraríamos los post que no son el primero

<?php  } ?>

<?php endwhile: ?> // cerramos el loop de wordpress

Un ejemplo para una plantilla en la que solo mostramos el título de los post y el contenido sería así:


<div id=”contenido”>

<?php $contador_post=0; if (have_post() : ?>

<?php while (have_post()) : $contador_post= $contador_post+1; the_post();?>

<?php if ($contador_post==1) { ?>

<div id=”primer_post”>

<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"> <?php the_title(); ?></a></h2>

<?php the_content('Leer más'); ?>

</div>

<?php  } ?>

<?php if ($contador_post>=2) { ?>

<div class=”post”>

<h2><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"> <?php the_title(); ?></a></h2>

<?php the_content('Leer más'); ?>

</div>

<?php  } ?>

<?php endwhile: ?>
<span style="font-family: 'Courier 10 Pitch', Courier, monospace; font-size: x-small;"><span style="line-height: 19px;"></div>
</span></span>

Fuente| http://wordpress.org

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

*

Puedes usar las siguientes etiquetas y atributos HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>