Wordpress - jetpack infinite scroll not working - wordpress

So I've added them support for infinite scroll in my functions.php like so
add_theme_support( 'infinite-scroll', array(
'container' => 'content',
'footer' => 'page',
'posts_per_page' => 4
) );
Here's my template and loop, I added an arbitrary div with the id of 'content' just because jetpack apparently needs the containing div of your posts to be an ID, yet the infinite scroll still doesn't work.
<?php
/*
Template Name: News
*/
?>
<?php get_header(); ?>
<div class="main-content">
<div class="content-left">
<div id="content">
<?php
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
query_posts('posts_per_page=&paged=' . $paged);
?>
<?php if (have_posts()) : while ( have_posts()) : the_post(); ?>
<div <?php post_class('clearfix') ?> id="post-<?php the_ID(); ?>">
<div class="entrywrapper">
<div class="entry">
<div class="bordertop">
<h2><?php the_title(); ?></h2>
</div> <!-- end div bordertop -->
<div class="aligncenter grey">
<?php the_time('M jS, Y') ?>
</div>
<div class="meta">
<span>Posted in :<?php the_category($separator = ' / '); ?></span>
<div class="clearfix"></div>
</div> <!-- end div meta -->
<?php global $more; $more = 0; ?>
<div class="figure">
<?php the_post_thumbnail(); ?>
</div> <!-- end div figure //centers thumbnail -->
<p class="firstparaph"> <?php the_field('main_post_meta'); ?></p>
<?php the_content('Continue Reading >'); ?>
<div class="centerm">
<?php comments_popup_link('No Comments', '1 Comment', '% Comments', 'comments-link', ''); ?>
</div>
<div class="postbreaker">* * *</div> <!-- end div entrybreaker -->
</div> <!-- end div entry -->
<div style="clear:both"></div>
</div> <!-- end div entrywrapper -->
<div style="clear:both"></div>
</div> <!-- end div post -->
<?php endwhile; endif; ?>
<div class="navigation">
<div class="next-posts"><?php next_posts_link('Older Posts') ?></div>
<div class="prev-posts"><?php previous_posts_link('Newer Posts') ?></div>
</div>
</div> <!-- end div ID content -->
</div> <!-- end div content-left -->
<div class="content-right">
<?php get_sidebar(); ?>
</div> <!-- end div content-right -->
<div style="clear:both;"></div>
</div> <!-- end div main-content -->
<?php get_footer(); ?>

Maybe try this:
In functions.php
function get_post_content() {
?>
<div <?php post_class('clearfix') ?> id="post-<?php the_ID(); ?>">
<div class="entrywrapper">
<div class="entry">
<div class="bordertop">
<h2><?php the_title(); ?></h2>
</div> <!-- end div bordertop -->
<div class="aligncenter grey">
<?php the_time('M jS, Y') ?>
</div>
<div class="meta">
<span>Posted in :<?php the_category($separator = ' / '); ?></span>
<div class="clearfix"></div>
</div> <!-- end div meta -->
<?php global $more; $more = 0; ?>
<div class="figure">
<?php the_post_thumbnail(); ?>
</div> <!-- end div figure //centers thumbnail -->
<p class="firstparaph"> <?php the_field('main_post_meta'); ?></p>
<?php the_content('Continue Reading >'); ?>
<div class="centerm">
<?php comments_popup_link('No Comments', '1 Comment', '% Comments', 'comments-link', ''); ?>
</div>
<div class="postbreaker">* * *</div> <!-- end div entrybreaker -->
</div> <!-- end div entry -->
<div style="clear:both"></div>
</div> <!-- end div entrywrapper -->
<div style="clear:both"></div>
</div> <!-- end div post -->
<?php
}
Then in your blog loop file:
<?php
/*
Template Name: News
*/
?>
<?php get_header(); ?>
<div class="main-content">
<div class="content-left">
<div id="content">
<?php
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
query_posts('posts_per_page=&paged=' . $paged);
?>
<?php if (have_posts()) : while ( have_posts()) : the_post(); ?>
<!-- MY EDIT IS HERE -->
get_post_content();
<?php endwhile; endif; ?>
<div class="navigation">
<div class="next-posts"><?php next_posts_link('Older Posts') ?></div>
<div class="prev-posts"><?php previous_posts_link('Newer Posts') ?></div>
</div>
</div> <!-- end div ID content -->
</div> <!-- end div content-left -->
<div class="content-right">
<?php get_sidebar(); ?>
</div> <!-- end div content-right -->
<div style="clear:both;"></div>
</div> <!-- end div main-content -->
<?php get_footer(); ?>

Related

I want to show my wordpress posts into 2 rows and each rows will contain 2 posts each

I am working on the default blog home page code. I have 4 posts in each blog page. Now they are showing vertically (one after another, up and down). I want to show these 4 posts into 2 rows and each row will contain 2 posts each. Here is the code of the blog page. I have used normal CSS to make them 2 columns.
<div class="amplify-content w-100 align-items-stretch order-0">
<div class="content-list">
<div class="mb-4"><strong class="text-uppercase">Category</strong> Graphic Design Lab</div>
<div class="columncontent">
<div class="row gutter-30 mb-4">
<div class="col-12 col-md-6">
<main role="main">
<!-- section -->
<section class="bl">
<?php if (have_posts()): while (have_posts()) : the_post(); ?>
<!-- article -->
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<!-- post thumbnail -->
<span class="blgimg"><?php if ( has_post_thumbnail()) : // Check if Thumbnail exists ?>
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<?php the_post_thumbnail(); // Fullsize image for the single post ?>
</a>
<?php endif; ?></span>
<!-- /post thumbnail -->
<!-- post details -->
<br/>
<span class="date"><?php the_time('F j, Y'); ?> <?php the_time('g:i a'); ?></span>
<!-- /post details -->
<!-- post title -->
<h2 style="font-family: Journal-Regular;color: #d20a1e !important;text-transform: uppercase!important;" class="blgg">
<?php the_title(); ?>
</h2>
<!-- /post title -->
<!-- button -->
<b>READ MORE</b><br/>
<!-- /button -->
<!-- <span class="write" style="width:80% !important;"><?php the_excerpt(); // Dynamic Content ?></span> -->
<br/>
<?php comments_template(); ?>
</article>
<!-- /article -->
<?php endwhile; ?>
<?php get_the_posts_pagination(); ?>
<?php else: ?>
<!-- article -->
<article>
<h1><?php _e( 'Sorry, nothing to display.', 'html5blank' ); ?></h1>
</article>
<!-- /article -->
<?php endif; ?>
</section>
<!-- /section -->
</main>
</div>
<div class="col-12 col-md-6">
</div>
</div>
</div>
</div>
</div>
Alright. Try this and lmk how it goes.
<div class="amplify-content w-100 align-items-stretch order-0">
<div class="content-list">
<div class="mb-4"><strong class="text-uppercase">Category</strong> Graphic Design Lab</div>
<div>
<div>
<div class="col-12">
<main role="main">
<!-- section -->
<section class="bl row">
<?php if (have_posts()): while (have_posts()) : the_post(); ?>
<!-- article -->
<article id="post-<?php the_ID(); ?>" class="col-xs-12 col-sm-6">
<!-- post thumbnail -->
<span class="blgimg"><?php if ( has_post_thumbnail()) : // Check if Thumbnail exists ?>
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<?php the_post_thumbnail(); // Fullsize image for the single post ?>
</a>
<?php endif; ?></span>
<!-- /post thumbnail -->
<!-- post details -->
<br/>
<span class="date"><?php the_time('F j, Y'); ?> <?php the_time('g:i a'); ?></span>
<!-- /post details -->
<!-- post title -->
<h2 style="font-family: Journal-Regular;color: #d20a1e !important;text-transform: uppercase!important;" class="blgg">
<?php the_title(); ?>
</h2>
<!-- /post title -->
<!-- button -->
<b>READ MORE</b><br/>
<!-- /button -->
<!-- <span class="write" style="width:80% !important;"><?php the_excerpt(); // Dynamic Content ?></span> -->
<br/>
<?php comments_template(); ?>
</article>
<!-- /article -->
<?php endwhile; ?>
<?php get_the_posts_pagination(); ?>
<?php else: ?>
<!-- article -->
<article>
<h1><?php _e( 'Sorry, nothing to display.', 'html5blank' ); ?></h1>
</article>
<!-- /article -->
<?php endif; ?>
</section>
<!-- /section -->
</main>
</div>
<div class="col-12 col-md-6">
</div>
</div>
</div>
</div>
</div>
Also, you should go into your index file and replace line 53 with .blgimg img{width: 100%;} instead of .blgimg img{width: 250px;height:250px;}

Related posts WordPress

I'm looking for a solution to show related posts from a different CPT.
There are two CPT's (Projects and Products) both have multiple sub categories (don't know if that ok...).
When on a: Single Post > Projects CPT > SportsCars
in the footer it must show the latest two posts of: Products CPT > Sportscars
The code i have now just filters on the CPT, not the SubCategrories. This is the code of single_products.php:
<section class="content">
<div class="container">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<h1><?php the_title(); ?></h1>
<?php the_content(); ?>
<?php endwhile; endif; ?>
</div>
</section>
<div class="container">
<div class="divider-small"></div>
</div>
<section class="news">
<div class="container">
<h2>Related projects</h2>
<div class="row">
<?php
$wp_query = new WP_Query(array('post_type' => 'projects', 'post__not_in' => array( $post->ID ), 'showposts' => 2));
$i = 0;
if ( $wp_query->have_posts() ): while( $wp_query->have_posts() ) : $wp_query->the_post(); ?>
<div class="col-md-6 item">
<div class="<?php if($i++ == 1): echo 'green'; else: echo 'blue'; endif; ?> clearfix">
<div class="col-sm-6">
<div class="text">
<h3><?php the_title(); ?></h3>
<p><?php echo excerpt(20); ?></p>
</div> <!-- end text -->
<div class="meer-news">
Lees meer >
</div> <!-- end meer-news -->
</div> <!-- end col-sm-6 -->
<div class="col-sm-6">
<div class="image">
<?php
if ( has_post_thumbnail() ) :
the_post_thumbnail( 'news_latest' );
else:
// backup
endif;
?>
</div> <!-- end image -->
</div> <!-- end col-sm-6 -->
</div>
</div> <!-- end item -->
<?php endwhile; endif; wp_reset_query(); ?>
</div> <!-- end row -->
</div> <!-- end container -->
</section>

What would make the_date function in wordpress only show up on random posts

I am working on a website for a client and I specifically needed to modify a given wordpress template. The template uses the get_template_part function to call the content. So for the loop on the index page it should be showing the_date under the header but for some reason it is showing up on some of the posts and not all.
index.php
<?php get_header(); ?>
<!-- Content -->
<div class="container contentarea">
<div class="row">
<div class="column-content">
<div id="content" role="main">
<?php if ( have_posts() ) : ?>
<?php while ( have_posts() ) : the_post(); ?>
<!-- Call content.php -->
<?php get_template_part( 'content' ); ?>
<?php endwhile; ?>
<div class="clearfix"></div>
<div class="paging">
<?php if(function_exists('lugada_kriesi_pagination')) : lugada_kriesi_pagination(); else: ?>
<?php global $wp_query; $total_pages = $wp_query->max_num_pages; if ( $total_pages > 1 ) { ?>
<div id="nav-below" class="navigation">
<div class="nav-previous"><?php next_posts_link(__( '<span class="meta-nav">«</span> Older posts', 'newzeo' )) ?></div>
<div class="nav-next"><?php previous_posts_link(__( 'Newer posts <span class="meta-nav">»</span>', 'newzeo' )) ?></div>
</div>
<?php } endif; ?>
</div>
<?php else : ?>
<article id="post-0" class="post no-results not-found">
<header class="entry-header">
<h1 class="entry-title">Nothing Found</h1>
</header>
<div class="entry-content">
<p>Sorry, we can't find post you request. Please try search for a related post.</p>
</div>
</article>
<?php endif; ?>
</div> <!-- #content -->
</div> <!-- .column-content -->
<div class="column-sidebar nomargin">
<?php get_sidebar(); ?>
</div>
</div>
</div>
<?php get_footer(); ?>
content.php
<div class="content-box bucket">
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?> itemscope itemtype="http://schema.org/Article" >
<h2 class="entry-header">
<div class="entry-meta clearfix" >
<!-- Sticky post -->
<?php if (is_sticky()) : ?>
<div class="sticky-label"></div>
<?php endif; ?>
<!-- Post title -->
<?php the_title(); ?>
</div> <!-- .entry-meta -->
</h2> <!-- .header -->
<!-- Content -->
<div class="entry-content clearfix" itemprop="description">
<?php the_date('','<p><strong>','</strong></p>',true); ?>
<?php the_content('Continue reading'); ?>
<div class="clearfix"></div>
<?php wp_link_pages( array('before' => '<div class="page-link"> <span> Pages: </span>', 'after' => '</div>')); ?>
</div>
<div class="entry-meta footerbox" >
<!-- Category -->
<span class="cat-links">
<span>Posted in</span>
<?php echo get_the_category_list(', '); ?>
</span>
<!-- If single & have tag -->
<!-- Tag -->
<?php if ( is_single() ): if (has_tag()) : ?>
<span class="sep"> | </span>
<span class="tag-links">
<span>Tagged</span>
<?php echo get_the_tag_list('',', ',''); ?>
</span>
<?php endif; ?>
<?php edit_post_link('Edit', '<span class="edit-link"><span class="sep"> | </span>', '</span>'); ?>
<div class="socialshareboxsingle clearfix">
Share this post, let the world know <?php lugada_social_button();?>
</div>
<?php endif; ?>
</div> <!-- .footer -->
</div> <!-- article -->
</div>
<hr class="post-shadow"/>
<!-- If its single, a user has filled out their description and this is a multi-author blog, show a bio on their entries -->
<?php if ( is_single() ) : ?>
<?php if ( get_the_author_meta( 'description' ) && ( ! function_exists( 'is_multi_author' ) || is_multi_author() ) ) : ?>
<div class="content-box">
<div id="author-info">
<div id="author-avatar">
<?php echo get_avatar( get_the_author_meta( 'user_email' ), 80 ); ?>
</div>
<div id="author-description">
<h2 >About <?php echo get_the_author(); ?></h2>
<?php the_author_meta( 'description' ); ?>
</div>
<div id="author-link" class="clearfix">
<?php if ( get_the_author_meta( 'user_url' )) : ?>
<span>Add my circles on Google+ : </span>
<span itemprop="author"><?php echo get_the_author(); ?></span>
<br/>
<?php endif; ?>
<a href="<?php echo get_author_posts_url( get_the_author_meta( 'ID' ) ); ?>">
View all posts by <?php echo get_the_author(); ?><span class="meta-nav">→</span>
</a>
</div>
</div>
</div>
<hr class="post-shadow"/>
<?php endif; endif; ?>
They're not random posts. Read the Codex:
When there are multiple posts on a page published under the SAME DAY, the_date() only displays the date for the first post (that is, the first instance of the_date()). To repeat the date for posts published under the same day, you should use the Template Tag the_time() or get_the_date() (since 3.0) with a date-specific format string.
Change:
<?php the_date('','<p><strong>','</strong></p>',true); ?>
To:
<p><strong><?php the_time('F j, Y'); ?></strong></p>

Simplify while loop containing posts code in wordpress

The code below should display the content of the page followed by certain page content.
<!-- Section -->
<section>
<?php if (have_posts()): while (have_posts()) : the_post(); ?>
<!-- Article -->
<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<!-- Posts for homepage -->
<?php
if ( is_front_page() ) { ?>
<?php the_content(); ?>
<!-- Show page content according to page ID -->
<div class="title-home clearfix">
<div class="four title-home-text">Services Spotlight</div>
<div class="four title-home-text" style="margin-left: 115px;">Industry Expertise</div>
<div class="four title-home-text" style="margin-left: 125px;">Features & Benefits</div>
</div>
<div class="four-wrapper clearfix">
<div class="four-container">
<div class="four-col line">
<?php
query_posts('page_id=40');
while (have_posts()): the_post();
the_content();
endwhile;
?>
</div>
read more
</div>
<div class="four-container">
<div class="four-col line">
<?php
query_posts('page_id=41');
while (have_posts()): the_post();
the_content();
endwhile;
?>
</div>
read more
</div>
<div class="four-container">
<div class="four-col line">
<?php
query_posts('page_id=42');
while (have_posts()): the_post();
the_content();
endwhile;
?>
</div>
read more
</div>
<div class="four-container">
<div class="four-col line">
<?php if(!function_exists('dynamic_sidebar') || !dynamic_sidebar('widget-area-3')) ?>
</div>
</div>
</div>
<?php
}
else {
?>
<h1><?php the_title(); ?> </h1>
<?php the_content(); ?>
<?php } ?>
<!-- end post homepage -->
<br class="clear">
<?php edit_post_link(); ?>
</article>
<!-- /Article -->
<?php endwhile; ?>
<?php else: ?>
<!-- Article -->
<article>
<h2><?php _e( 'Sorry, nothing to display.', 'html5blank' ); ?></h2>
</article>
<!-- /Article -->
<?php endif; ?>
</section>
<!-- /Section -->
<?php get_footer(); ?>
However, it displays the last query as loop.
Output Code:
<article id="post-6" class="post-6 page type-page status-publish hentry">
<article id="post-42" class="post-42 page type-page status-publish hentry">
post-42 should not be displayed in the article.
Also, I know the code is not simplified for using while loop. I want to fix the article problem and simplify this code.
The codex advises against using query_posts for secondary loops as per Codex Query Posts Page
It looks like you are stomping on the main loop (article) since query_posts alters the main loop. If you want to use query_posts it is recommended that you call wp_reset_query() when done. The preferred method is to use WP_query().

Wordpress next/prev post on single custom post page?

So I've got a custom post type, all working fine.
Goes to single-portfolio, but it won't paginate.
I can't, no matter what I try get pagination to work on the single page.
Here's my code.
<?php get_header(); ?>
<div class="main-content">
<div class="portfoliopost">
<div class="col-full">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div <?php post_class() ?> id="post-<?php the_ID(); ?>">
<div class="port-left-single">
<h2><?php the_title(); ?></h2>
<div class="projecttype">
<ul>
<?php
$posttags = get_the_tags();
if ($posttags) {
foreach($posttags as $tag) {
echo '<li>' .$tag->name. '</li>';
}
}
?>
</ul>
</div>
<?php the_field('main_portfolio_meta'); ?>
</div> <!-- end div port-left-single -->
<div class="port-right-single">
<?php the_content(); ?>
</div>
<div style="clear:both;"></div>
</div> <!-- end div post-class -->
<div class="navigation">
<div class="next-posts"><?php next_posts_link('Older Posts') ?></div>
<div class="prev-posts"><?php previous_posts_link('Newer Posts') ?></div>
</div>
<?php endwhile; endif; ?>
</div> <!-- end div col-full -->
</div> <!-- end div portfolipost -->
<div style="clear:both;"></div>
</div> <!-- end div main content -->
<?php get_footer(); ?>
It's inside the loop, so what gives?

Resources