I want to display my Wordpress posts across two columns. At the moment, they run down one column. I'm also getting the categories repeating in the col-lg-2 div as I scroll down. Any tips? Thanks!
<div class="container">
<?php // Display blog posts on any page # https://m0n.co/l
$temp = $wp_query; $wp_query= null;
$wp_query = new WP_Query(); $wp_query->query('posts_per_page=-1' . '&paged='.$paged);
while ($wp_query->have_posts()) : $wp_query->the_post(); ?>
<div class="row">
<div class="col-lg-2">
<?php the_category(', '); ?>
</div>
<div class="col-lg-5">
<?php the_post_thumbnail(); ?>
<p><?php the_title(); ?></p>
</div>
<div class="col-lg-5">
<h2><?php the_title(); ?></h2>
</div>
</div>
<?php endwhile; ?>
<?php if ($paged > 1) { ?>
<?php } else { ?>
<?php } ?>
<?php wp_reset_postdata(); ?>
</div>
Related
I'm having problem with my Wordpress 4.7.8 localhost custom-theme webpage.
As hard as I try, I keep getting "Title" where content should be and the content at the place of the title
Here is an image
Here is how it looks in wordpress admin dashboard:
...and image the view in wordpress
any Ideas where I might be going wrong?
Try this code.
Search bar in duplicate (wordpress/php/bootstrap)
This code taken from your previous question.
this code for displaying title <?php the_title(); ?> and this code displaying content <?php the_content(); ?>. you can replace this code wherever you want.
<?php get_header(); ?>
<div class="row">
<div class="col-xs-12 col-sm-8">
<div class="row text-center no-margin">
<?php
$currentPage = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array('posts_per_page' => 3,'post_type'=>'post', 'paged' => $currentPage);
new WP_Query($args);
if( have_posts() ): $i = 0;
while( have_posts() ): the_post(); ?>
<?php
if($i==0): $column = 12; $class = '';
elseif($i > 0 && $i <= 2): $column = 6; $class = ' second-row-padding';
elseif($i > 2): $column = 4; $class = ' third-row-padding';
endif;
?>
<div class="col-xs-<?php echo $column; echo $class; ?> blog-item">
<?php if( has_post_thumbnail() ):
$urlImg = wp_get_attachment_url( get_post_thumbnail_id( get_the_ID() ) );
endif; ?>
<div class="blog-element" style="background-image: url(<?php echo $urlImg; ?>);">
<!--<?php the_title( sprintf('<h1 class="entry-title">', esc_url( get_permalink() ) ),'</h1>' ); ?> -->
<h1 class="entry-title"><?php the_title(); ?></h1>
<?php the_content(); ?>
<small><?php the_category(' '); ?></small>
</div>
</div>
<?php $i++; endwhile; ?>
<div class="col-xs-6 text-left">
<?php next_posts_link('« Older Posts'); ?>
</div>
<div class="col-xs-6 text-right">
<?php previous_posts_link('Newer Posts »'); ?>
</div>
<?php endif;
wp_reset_query();
?>
</div>
</div>
<div class="col-xs-12 col-sm-4">
<?php get_sidebar(); ?>
</div>
</div>
You might need to edit content-single.php file to change the post content order. Your post content is loading first before post title.
Check if ,
the_content() or get_the_content()
is showing before ,
get_the_title() or the_title()
I created a custom page template like category.php but I can't get the pagination working.
I just filter post from one category.
Here is my code:
<?php
/* Template Name: News */
?>
<?php get_header(); ?>
<div class="col-lg-9 col-md-8 content">
<div class="box">
<h1 class="title"><?php the_title(); ?></h1>
<div class="box-int">
<article>
<?php // Display blog posts on any page # http://m0n.co/l
$temp = $wp_query; $wp_query= null;
$wp_query = new WP_Query(); $wp_query->query('showposts=5' . '&paged='.$paged);
while ($wp_query->have_posts()) : $wp_query->the_post(); ?>
<?php
if (has_post_thumbnail()) {
the_post_thumbnail();
}
?>
<h2><?php the_title(); ?></h2>
<?php the_excerpt(); ?>
<br><br>
<?php endwhile; ?>
<?php if ($paged > 1) { ?>
<nav id="nav-posts">
<div class="prev"><?php next_posts_link('« Old'); ?></div>
<div class="next"><?php previous_posts_link('Newx »'); ?></div>
</nav>
<?php } else { ?>
<nav id="nav-posts">
<div class="prev"><?php next_posts_link('« Old'); ?></div>
</nav>
<?php } ?>
<?php wp_reset_postdata(); ?>
</article>
</div>
</div>
</div>
<div class="col-lg-3 col-md-4">
<?php get_sidebar(); ?>
</div>
<?php get_footer(); ?>
What's wrong here? I click in Page 2, but the post are always the same.
Your query is a bit of a mess here with some syntax errors as well.showposts died with the dinosaurs, it is long time depreciated. You should use posts_per_page. 'showposts=5' . '&paged='.$paged is also a mess. You query shouls simplify look like this
$args = array(
'posts_per_page' => 5,
'paged' => $paged
);
$query = new WP_Query( $args );
while ($query->have_posts()) : $query->the_post(); ?>
When querying the loop with WP_Query, you need to assign $max_pages parameter to the next_posts_link().
So you would need to change <?php next_posts_link('« Old'); ?> to <?php next_posts_link('« Old', $the_query->max_num_pages ); ?>
Also go and read this question on this subject. If I missed something, this question will most certainly help you out a lot.
I know it is little easy but unable to solve the issue with wordpress while loop. I am using zurb framework and for product list using below html structure.
<div class="row">
<div class="four columns">
item here
</div>
<div class="four columns">
item here
</div>
<div class="four columns">
item here
</div>
</div>
So in while loop I want to repeat entire structure after every three four columns div. I have tried with below code
<?php
$temp = $wp_query;
$wp_query = null;
$wp_query = new WP_Query();
$wp_query->query('post_type=product' . '&paged=' . $paged .'');
?>
<?php $counter = 0;
if ( have_posts() ) : while ( have_posts() ) : the_post();
if ($counter % 3 == 0):
echo '<div class="row"><!--row starts here-->';
endif; ?>
<div class="four columns">
<article>
<header>
<hgroup>
<h2><?php the_title(); ?></h2>
<h6>Written by <?php the_author_link(); ?> on <?php the_time(get_option('date_format')); ?></h6>
</hgroup>
</header>
<?php if ( has_post_thumbnail()) : ?>
<a href="<?php the_permalink(); ?>" class="th" title="<?php the_title_attribute(); ?>" ><?php the_post_thumbnail(); ?></a>
<?php endif; ?>
<?php the_excerpt(); ?>
</article>
</div>
<?php endwhile; ?>
<?php else : ?>
<h2><?php _e('No posts.', 'foundation' ); ?></h2>
<p class="lead"><?php _e('Sorry about this, I couldn\'t seem to find what you were looking for.', 'foundation' ); ?></p>
<?php endif;
if ($counter % 3 == 0):
echo '</div><!--row end here-->';
endif; ?>
<?php foundation_pagination(); ?>
</div>
<!-- End Main Content -->
But it is repeating wrongly and for every loop. I know this is obvious to repeat but the solution I unable to found how to repeat after only 3 four columns and in first loop row should div should be inserted as well.
Thanks a lot
Do precisely what Andy said, add the code $counter++; in your code, inside the while loop.
For example, in your code:
</div>
<?php $counter++; ?>
<?php endwhile; ?>
That shows where to put it between two existing lines in your example.
You should probably add one to the counter in the loop, like $counter++, then close this question.
I have created a simple Wordpress loop already but now it should loop a little differently and i dont know how to start or even where to start. I have inside DIV class="item-row-wrap" my loop it loops through DIV class="vinyl-wrap" normally.
My problem: i would like it to loop three times and then to create a new DIV class="item-row-wrap" and start again looping DIV class="vinyl-wrap" three times...and go on and on
Here is the code:
<code>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php if(get_field('artist-repeater')): while(has_sub_field('artist-repeater')): ?>
<div class="item-row-wrap"> <!--START of item-row-wrap-->
<div class="vinyl-wrap"> <!--START of vinyl-wrap-->
<?php if(get_sub_field('play-repeater-songlink')): ?>
<a class="play" href='<?php the_sub_field('play-repeater-songlink'); ?>' target="_blank"></a>
<?php endif; ?>
<?php if(get_sub_field('moreinfo-repeater-song')): ?>
<a class="more-info" href='<?php the_sub_field('moreinfo-repeater-song'); ?>' target="_blank"></a>
<?php endif; ?>
<div class="vinyl-cover">
<div class="vinyl-cover-plastik"></div>
<?php if(get_sub_field('album-repeater-image')): ?>
<?php $image = wp_get_attachment_image_src(get_sub_field('album-repeater-image'), 'thumbnail'); ?>
<img class="album-cover-art" src="<?php echo $image[0]; ?>" alt="<?php get_the_title(get_field('album-repeater-image')) ?>" />
<?php endif; ?>
</div> <!--End of vinyl-cover-->
<div class="likeit">
<?php if(function_exists(getILikeThis)) getILikeThis('get'); ?>
</div>
<div class="artist-name-wrap">
<div class="artist-wrap-left"></div>
<div class="artist-wrap-mid">
<p><?php the_title(); ?></p>
</div>
<div class="artist-wrap-right"></div>
</div> <!--End of artist-name-wrap-->
<div style="clear:both;"></div>
<div class="song-name-wrap">
<div class="song-wrap-left"></div>
<div class="song-wrap-mid">
<?php if(get_sub_field('song-repeater-name')): ?>
<p><?php the_sub_field('song-repeater-name'); ?></p>
<?php endif; ?>
</div>
<div class="song-wrap-right"></div>
</div> <!--end of song-name-wrap-->
</div> <!--END OF VINYL-WRAP-->
<?php endwhile; endif; ?>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
<?php else: ?>
Yhtään artikkelia ei ole vielä julkaistu.
<?php endif; ?>
</div> <!--END OF ITEM-ROW-WRAP-->
Make $i var before the loop.
Up the value just before the loops closes: $i++
Set a Modulo check around the <div class="item-row-wrap"> (and the closing </div>)
Modulo tutorial
Not a complete answer but enough to get you started.
example
The example below shows how you should do this
<?php
$i = 0;
if (have_posts()) : while (have_posts()) : the_post();
if(get_field('artist-repeater')): while(has_sub_field('artist-repeater')):
if ($i % 3 == 0) {
echo '<div class="item-row-wrap"> <!--START of item-row-wrap-->';
}
$i++; // up the numer of looped
?>
DO your magic
<?php
if ($i % 3 == 0) {
echo '</div> <!--END OF ITEM-ROW-WRAP-->';
}
endwhile; //end have_posts()
endif;
I've searched and searched and have not solved my problem. I seems like there are solutions but they are not working for my particular code.
What I would like to do is to have two loops - one that calls up the most recent post and acts as the main "featured post". Second is simply the second most recent post that is styled differently - then below the second or "sub post" I would like pagination.
Problem is... the pagination does not work. The numbers show up, but when I click on them nothing happens. Would appreciate any help!
Here is the code...
<div id="featuredpost">
<?php $my_query = new WP_Query('posts_per_page=1&cat=4');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID; ?>
<div <?php post_class() ?> id="post-<?php the_ID(); ?>">
<span class="subposttitle"><?php the_title(); ?></span><br>
<small>Posted in <?php the_category(', ') ?> on <?php the_time('l, F jS') ?>.</small>
<br><br>
<div class="entry">
<?php the_content(); ?>
</div>
</div>
<br>
<hr>
<br><br>
<?php endwhile; ?>
</div>
<div id="subposts">
<?php $my_query = new WP_Query('posts_per_page=1&offset=1&cat=4');
while ($my_query->have_posts()) : $my_query->the_post();
$do_not_duplicate = $post->ID;
?>
<div <?php post_class() ?> id="post-<?php the_ID(); ?>">
<span class="subposttitle"><?php the_title(); ?></span><br>
<small>Posted in <?php the_category(', ') ?> on <?php the_time('l, F jS') ?>.</small>
<br><br>
<div class="entry">
<?php the_content(); ?>
</div>
</div>
<br>
<hr>
<br>
<?php endwhile; ?>
<center>
<?php wp_pagenavi() ?>
</center>
</div>
pass multiple properties to wp_query as an array:
<?php $wp_query = new WP_Query(array('posts_per_page' => 1, 'cat' => 4));