Hi, I'm putting together a zero themes for wordpress and I have an inconvenience with the call of some news that I bring from a file / single that I have to show in the home, the problem that I am solving badly is that every time I update the site the news is changed to me, for that I am using a meta key that I highlight every news that I want to show in the home. for every note that appears I am using a wp_query, someone told me that I could use it with counter (counter) to be able to solve it better, but I do not know how to implement it. I enclose this code that implements and an image of how is the structure of the notes that appear in the home, since they are also of different sizes. Site where you can see the example working
<div class="container">
<!-- COLUMNAS IZQUIERDA -->
<div class="col-xs-12 col-lg-8 sin-padding">
<div class="col-xs-12 col-sm-6 col-lg-6">
<?php
$home_args = array(
'post_type' => 'post',
'meta_key' => 'notas_destacadas_index',
'orderby' => 'meta_value_num',
'order' => 'DESC',
'showposts' => 1,
'offset' => 0,
);
$wp_query_home = new WP_Query( $home_args );
if ($wp_query_home-> have_posts ()) {
while ($wp_query_home-> have_posts ()) {
$wp_query_home-> the_post ();
?>
<div class="frase hover">
<figure class="snip1208">
<a href="<?php the_permalink(); ?>" title="">
<?php if(get_field('nota_con_imagen')): ?>
<div class="image">
<img src="<?php the_field('imagen_de_nota'); ?>" alt="">
</div>
<?php else:
?>
<div class="recuadro">
<p><?php cortarTexto(the_excerpt( ), 100,"") ?></p>
</div>
<?php
endif;
?>
<div class="date">
<span class="day"><?php echo get_the_date('d'); ?></span><span class="month"><?php echo get_the_date('M'); ?></span>
</div>
<?php if(get_field('nota_con_imagen')): ?>
<figcaption>
<h3><?php echo get_the_title(); ?></h3>
</figcaption>
<a href="<?php the_permalink(); ?>"><button type='button' class='boton_ver'>VER VIDEO</button></a>
</a>
</figure>
<?php endif; ?>
</div>
<?php
}
}
wp_reset_query();
?>
</div>
<div class="col-xs-12 col-sm-6 col-lg-6">
<?php
$home_args = array(
'post_type' => 'post',
'meta_key' => 'notas_destacadas_index',
'orderby' => 'meta_value_num',
'order' => 'DESC',
'showposts' => 1,
'offset' => 1,
);
$wp_query_home = new WP_Query( $home_args );
if ($wp_query_home-> have_posts ()) {
while ($wp_query_home-> have_posts ()) {
$wp_query_home-> the_post ();
?>
<div class="frase hover">
<a href="<?php the_permalink(); ?>" title="">
<figure class="snip1208">
<?php if(get_field('nota_con_imagen')): ?>
<div class="image">
<img src="<?php the_field('imagen_de_nota'); ?>" alt="">
</div>
<?php else:
?>
<div class="recuadro">
<p><?php cortarTexto(the_excerpt( ), 100,"") ?></p>
</div>
<?php
endif;
?>
<div class="date">
<span class="day"><?php echo get_the_date('d'); ?></span><span class="month"><?php echo get_the_date('M'); ?></span>
</div>
<?php if(get_field('nota_con_imagen')): ?>
<figcaption>
<h3><?php echo get_the_title(); ?></h3>
</figcaption>
<a href="<?php the_permalink(); ?>"><button type='button' class='boton_ver'>VER VIDEO</button></a>
</figure>
<?php endif; ?>
</a>
</div>
<?php
}
}
wp_reset_query();
?>
</div>
<div class="clearfix"></div>
<div class="mas-novedades">
<div class="col-xs-12 col-sm-6 col-lg-4 pull-left">
<?php
$home_args = array(
'post_type' => 'post',
'meta_key' => 'notas_destacadas_index',
'orderby' => 'meta_value_num',
'order' => 'DESC',
'showposts' => 1,
'offset' => 2,
);
$wp_query_home = new WP_Query( $home_args );
if ($wp_query_home-> have_posts ()) {
while ($wp_query_home-> have_posts ()) {
$wp_query_home-> the_post ();
?>
<!-- POST 2 -->
<figure class="snip1209">
<a href="" title="">
<?php if(get_field('nota_con_imagen')): ?>
<div class="image">
<?php echo get_the_post_thumbnail(); ?>
</div>
<?php else:
?>
<div class="recuadro">
<p><?php cortarTexto(the_excerpt( ), 100,"") ?></p>
</div>
<?php
endif;
?>
<div class="date">
<span class="day"><?php echo get_the_date('d'); ?></span><span class="month"><?php echo get_the_date('M'); ?></span>
</div>
<?php if(get_field('nota_con_imagen')): ?>
<figcaption>
<h3><?php echo get_the_title(); ?></h3>
</figcaption>
<a href="<?php the_permalink(); ?>"></a>
<?php endif; ?>
</a>
</figure>
<?php
}
}
wp_reset_query();
?>
</div>
<div class="col-xs-12 col-sm-6 col-lg-8 pull-right">
<!-- TERCER POST -->
<?php
$home_args = array(
'post_type' => 'post',
'meta_key' => 'notas_destacadas_index',
'orderby' => 'meta_value_num',
'order' => 'DESC',
'showposts' => 1,
'offset' => 3,
);
$wp_query_home = new WP_Query( $home_args );
if ($wp_query_home-> have_posts ()) {
while ($wp_query_home-> have_posts ()) {
$wp_query_home-> the_post ();
?>
<figure class="snip1209">
<a href="" title="">
<?php if(get_field('nota_con_imagen')): ?>
<div class="image">
<?php echo get_the_post_thumbnail(); ?>
</div>
<?php else:
?>
<div class="recuadro">
<p><?php cortarTexto(the_excerpt( ), 100,"") ?></p>
</div>
<?php
endif;
?>
<div class="date">
<span class="day"><?php echo get_the_date('d'); ?></span><span class="month"><?php echo get_the_date('M'); ?></span>
</div>
<?php if(get_field('nota_con_imagen')): ?>
<figcaption>
<h3><?php echo get_the_title(); ?></h3>
</figcaption>
<a href="<?php the_permalink(); ?>"></a>
<?php endif; ?>
</a>
</figure>
<?php
}
}
wp_reset_query();
?>
</div>
</div>
</div>
<!-- COLUMNAS DERECHA -->
<div class="col-sm-6 col-lg-4">
<div class="columna-solitaria">
<?php
$home_args = array(
'post_type' => 'post',
'meta_key' => 'notas_destacadas_index',
'orderby' => 'meta_value_num',
'order' => 'DESC',
'showposts' => 1,
'offset' => 4,
);
$wp_query_home = new WP_Query( $home_args );
if ($wp_query_home-> have_posts ()) {
while ($wp_query_home-> have_posts ()) {
$wp_query_home-> the_post ();
?>
<!-- POST 3 -->
<figure class="snip1210">
<?php if(get_field('nota_con_imagen')): ?>
<div class="image">
<?php echo get_the_post_thumbnail(); ?>
</div>
<?php else:
?>
<div class="recuadro">
<p><?php cortarTexto(the_excerpt( ), 100,"") ?></p>
</div>
<?php
endif;
?>
<div class="date">
<span class="day"><?php echo get_the_date('d'); ?></span><span class="month"><?php echo get_the_date('M'); ?></span>
</div>
<?php if(get_field('nota_con_imagen')): ?>
<figcaption>
<h3><?php echo get_the_title(); ?></h3>
</figcaption>
<a href="<?php the_permalink(); ?>"></a>
<?php endif; ?>
</figure>
<?php
}
}
wp_reset_query();
?>
<div class="hidden-sm hidden-md mas-noticias">
<a class="btn btn-mas-noticias" href="<?php bloginfo( 'url' ); ?>/novedades" title="">LEER MÁS NOTICIAS</a>
<img class="forma img-responsive" src="<?php echo THEME_IMAGES; ?>/forma-1.png" alt="">
</div>
</div>
</div>
</div> 