I'm wanting to display Wordpress posts in a two column row using Bootstrap. Here's what I have, i feel it's close but the second post is displaying underneath the first one insead of displaying next to each other.
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post(); ?>
<?php if ( has_post_thumbnail() ) : ?>
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail(); ?>
</a>
<?php endif; ?>
<h2 class="blog-post-title">
<a href="<?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
</h2>
<?php endwhile; ?>
<?php endif; ?>
</div>
</div>
</div>
Any help would be appreciated!
Solved!
<div class="container">
<div class="row">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<div class="col-lg-6 col-md col-sm-12 col-xs-12">
<?php if ( has_post_thumbnail() ) : ?>
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<?php the_post_thumbnail(); ?>
</a>
<?php endif; ?>
<h2 class="blog-post-title">
<a href="<?php the_permalink(); ?>">
<?php the_title(); ?>
</a>
</h2>
</div>
<?php endwhile; else: ?>
<p>There are no posts to show</p>
<?php endif; ?>
</div>
</div>
Related
I created a theme from scratch and have pagination working on the post pages using , it's working on single.php.
<?php get_header(); ?>
<?php
while(have_posts()) {
the_post();
?>
<div class="mainConent">
<div class="leftSidebar">
<div class="sidebarTitleWrapper">
<?php dynamic_sidebar('left_sidebar') ?>
</div>
</div>
<div class="recentBlogsWrapper">
<div class="blogWrapper">
<h2><?php the_title(); ?></h2>
<p><?php the_time('F j, Y') ?></p>
<?php if(has_post_thumbnail()) { ?>
<div class="card-image">
<img class="page-image" src="<?php echo get_the_post_thumbnail_url(get_the_ID()); ?>" alt="Card Image">
</div>
<?php } ?>
<div class="card-description">
<?php the_content(); ?>
<?php wp_link_pages(); ?>
<?php comments_template(); ?>
<?php } ?>
<div class="backarrowwrap">
<a class="backhomelink" href="<?php echo site_url(); ?>" <?php if(is_front_page()) echo 'class="active"' ?>>
<img class="backarrow" src="<?php echo get_template_directory_uri(); ?>/img/backarrow.png" alt="back arrow" />
Go Back Home
</a>
</div>
</div>
</div>
</div>
<div class="rightSidebar" id="sidebar">
<div class="sidebarTitleWrapper">
<?php dynamic_sidebar('right_sidebar') ?>
</div>
</div>
I put it right below the_content(); and it's working exactly like I want it to. However, it's not working on page.php, even though it's in the same place on the page.
<?php get_header();
while(have_posts()) {
the_post();
?>
<div class="pageWrapper">
<h2><?php the_title(); ?></h2>
<?php if(has_post_thumbnail()) { ?>
<div class="card-image">
<img class="page-image" src="<?php echo get_the_post_thumbnail_url(get_the_ID()); ?>" alt="Card Image">
</div>
<?php } ?>
<div class="card-description">
<?php the_content(); ?>
<?php wp_link_pages(); ?>
<?php } ?>
</div>
</div>
<?php get_footer(); ?>
I've included the
<!–-nextpage-–>
code in one of my pages just like I did for the blogs, but it's not paginating between the paragraphs.
What am I doing wrong?
You need at least one <!--nextpage-->, if the content of a page (or post) has at least one <!--nextpage--> tag (and this code is in The Loop), this prints linked page numbers (“Pages: 1 2 3 4 and so on...”), without a link on current page number, and by default within tags:.
All my posts are showing in the same div, rather than seperate ones,
<?php get_header(); ?>
<div class="mainwrap">
<div class="bloginner">
<!-- begin section -->
<section>
<div class="postswrap">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="commentsetall"><img src="<?php bloginfo('template_url'); ?>/images/ico_folder.png" alt="Posted" /><span class="commentfix"><?php the_time('F j, Y') ?> in <?php the_category(', ') ?> by <?php the_author() ?></span></div>
<h1><?php the_title(); ?></h1>
<?php endwhile; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>
<div class="clearfix"></div>
</div>
</section>
<!-- end section -->
</div>
<div class="clearfix"></div>
</div>
<?php get_footer(); ?>
Is there a clearfix im maybe missing to stop this from happening?
thanks
put the <div class="postswrap"> inside the loop.something like that:
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="postswrap">
<div class="commentsetall"><img src="<?php bloginfo('template_url'); ?>/images/ico_folder.png" alt="Posted" /><span class="commentfix"><?php the_time('F j, Y') ?> in <?php the_category(', ') ?> by <?php the_author() ?></span></div>
<h1><?php the_title(); ?></h1>
<?php endwhile; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<div class="clearfix"></div>
</div>
<?php endif; ?>
Why does <!--nextpage--> work on pages, but not on Custom Post Types?
Here is the code of the single-custom_type.php file.. I added the "<?php wp_link_pages(); ?>" by myself. I hoped that would work, but it doesn't. There is nothing more to say actually.
<?php get_header(); ?>
<div id="content">
<div id="inner-content" class="wrap clearfix">
<div id="main" class="eightcol first clearfix" role="main">
<?php include(TEMPLATEPATH . '/template-logo.php'); ?>
<div class="content">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<article id="post-<?php the_ID(); ?>" <?php post_class('clearfix'); ?> role="article">
<header class="article-header">
<h2 class="h2"><?php the_title(); ?></h2>
</header> <!-- end article header -->
<section class="entry-content clearfix">
<?php if ( function_exists("has_post_thumbnail") && has_post_thumbnail() ) { ?>
<a href="<?php the_permalink(); ?>" title="Permanent Link to <?php the_title(); ?>">
<?php the_post_thumbnail(array(200,200), array("class" => "alignleft post_thumbnail")); ?>
</a>
<?php } ?>
<?php the_content(); ?>
<?php wp_link_pages(); ?>
<hr>
</section> <!-- end article section -->
<footer class="article-footer">
<p class="tags"><?php the_tags('<span class="tags-title">Tags:</span> ', ', ', ''); ?></p>
</footer> <!-- end article footer -->
<?php // comments_template(); // uncomment if you want to use them ?>
</article> <!-- end article -->
<?php endwhile; ?>
<?php else : ?>
<article id="post-not-found" class="hentry clearfix">
<header class="article-header">
<h1><?php _e("Oops, Post Not Found!", "bonestheme"); ?></h1>
</header>
<section class="entry-content">
<p><?php _e("Uh Oh. Something is missing. Try double checking things.", "bonestheme"); ?></p>
</section>
<footer class="article-footer">
<p><?php _e("This is the error message in the single-custom_type.php template.", "bonestheme"); ?></p>
</footer>
</article>
<?php endif; ?>
[...]
I have found this code:
<?php
$myposts = get_posts('');
foreach($myposts as $post) :
setup_postdata($post);
?>
<div class="post-item">
<div class="post-info">
<h2 class="post-title">
<a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>">
<?php the_title(); ?>
</a>
</h2>
<p class="post-meta">Posted by <?php the_author(); ?></p>
</div>
<div class="post-content">
<?php the_content(); ?>
</div>
</div>
<?php comments_template(); ?>
<?php endforeach; wp_reset_postdata();
?>
Is it good way to display posts? Because it shows, but if I click some post, it shows again all posts but with comments..Is it possible to show only that topic which I have clicked?
(or if you have some better code to show posts, please write it here)
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;