I have one page (not an article) with n subpages.
In the main page, I need to show max 3 titles of the subpages and insert a pagination for the other.
How can I do that?
This is my simple code now:
<?php
$parent_id = 14; //main page id
$pages = get_pages( array( 'sort_column' => 'menu_order', 'numberposts' => 3, 'child_of' => $parent_id ) );
foreach ( $pages as $page ) : ?>
<div class="item">
<div class="item-title">
<h2><?php echo $page->post_title; ?></h2>
</div>
</div>
<?php endforeach; ?>
Thanks.
I solved by myself, the solution is to use wp_query() to create a new loop insted of using get_pages().
Here the new code for page title and contentwith pagination by Preeti Dua from Avigma Technology:
<?php
// Pagination variable
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
// The Query
$the_query = new WP_Query( array( 'post_parent' => 782, 'post_type' => 'page', 'paged' => $paged) );
// The Loop
if($the_query->have_posts()) : while($the_query->have_posts()) : $the_query->the_post();
global $post;
$thePostID = $post->ID; /* this variabled is used if you need to get custom fields of the subpage */
?>
<div id="side-post-title">
<?php the_title(); ?>
</div>
<div id="side-post-excerpt">
<?php the_excerpt(); ?>
<a href="<?php echo get_permalink( $page->ID ); ?>"> <div id="read-more">
<img src="/wp-content/uploads/2012/10/read-more-btn.png"/></div> </a>
</div>
<?php endwhile; endif; ?>
<nav class="navigation">
<div style="float:left;"> <?php next_posts_link('Show older', $the_query->max_num_pages) ?></div>
<div style="float:right;"> <?php previous_posts_link('Show newer') ?></div>
</nav>
not sure,
but try following plugin
http://wordpress.org/extend/plugins/wp-pagenavi/
If you'd like to add subPage title, description or even thumbnail in pagination button you can use the ACP free Wordpress plugin: http://wordpress.org/plugins/advanced-content-pagination/
Related
I am trying to loop through a post type called blog. The pagination works fine when the Wordpress permalinks are set to plain however when I change it to post the name and click to go on pagination link, it loads a 404 error.
I found out that you can't have the same post type and page name since it will cause a 404 error. I wanted to know if there was a workaround because changing the name of the post type will affect the blog posts.
My page-blog.php
<?php
$paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;
$loop = new WP_Query( array( 'post_type' => 'blog',
'posts_per_page' => 2,
'paged' => $paged,
'has_archive' => false,
'rewrite' => array(
'slug' => '/blog', // if you need slug
'with_front' => false,
),)
);
if ( $loop->have_posts() ):
while ( $loop->have_posts() ) : $loop->the_post();
// Set variables
$title = get_the_title();
$post_date = get_the_date('M j');
$amount_of_time_to_read = get_field('amount_of_time_to_read');
?>
<a href="<?php the_permalink(); ?>" class="post-blog-link">
<div class="post">
<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID), 'thumbnail' ); ?>
<div class="post-image-v2" style="background-image:url('<?php echo $url ?>');">
</div>
<div class="post-content-v2">
<h2 class="post-title"><?php echo $title; ?></h2>
<div class="post-excerpt">
<p><?php echo get_excerpt(); ?></p>
</div>
<p class="post-date"> <span class="caps"><?php echo $post_date; ?></span> | <?php echo $amount_of_time_to_read; ?>min read</p>
</div>
</div>
</a>
<!--
-->
<?php endwhile; ?>
<center>
<div class="pagination mt-25">
<?php pagination_bar( $loop ); ?>
</div>
</center>
<?php wp_reset_postdata();
endif;
?>
My functions.php
add_action('init', 'custom_rewrite_basic');
function custom_rewrite_basic() {
global $wp_post_types;
foreach ($wp_post_types as $wp_post_type) {
if ($wp_post_type->_builtin) continue;
if (!$wp_post_type->has_archive && isset($wp_post_type->rewrite) && isset($wp_post_type->rewrite['with_front']) && !$wp_post_type->rewrite['with_front']) {
$slug = (isset($wp_post_type->rewrite['slug']) ? $wp_post_type->rewrite['slug'] : $wp_post_type->name);
$page = get_page_by_slug($slug);
if ($page) add_rewrite_rule('^' .$slug .'/page/([0-9]+)/?', 'index.php?page_id=' .$page->ID .'&paged=$matches[1]', 'top');
}
}
}
function get_page_by_slug($page_slug, $output = OBJECT, $post_type = 'page' ) {
global $wpdb;
$page = $wpdb->get_var( $wpdb->prepare( "SELECT ID FROM $wpdb->posts WHERE post_name = %s AND post_type= %s AND post_status = 'publish'", $page_slug, $post_type ) );
return ($page ? get_post($page, $output) : NULL);
}
what do you want to achieve to have a Post Type and Page to be of the same slug?
As per my understanding you want to display the archive of your custom post type "Blog". All you have to do is create a file name archive-blog.php and use the plain WordPress loop. That way you don't need to have a page-blog.php (Delete it) to display the Archives of your "Blog" post type. yourwebsite.com/blog will automatically display your "Blog" archive.
Use the code below to paste in your archive-blog.php
<?php if (have_posts()) : ?>
<?php while (have_posts()) : the_post();
// set vars
$amount_of_time_to_read = get_field('amount_of_time_to_read');
?>
<a href="<?php the_permalink(); ?>" class="post-blog-link">
<div class="post">
<?php $url = wp_get_attachment_url( get_post_thumbnail_id( $post->ID ), 'thumbnail' ); ?>
<div class="post-image-v2" style="background-image:url( '<?php echo $url ?>' );">
</div>
<div class="post-content-v2">
<h2 class="post-title"><?php the_title(); ?></h2>
<div class="post-excerpt">
<p><?php the_excerpt(); ?></p>
</div>
<p class="post-date"> <span class="caps"><?php the_date( 'M j' ); ?></span> | <?php echo $amount_of_time_to_read; ?>min read</p>
</div>
</div>
</a>
<?php endwhile; ?>
<?php
// You need to tweak this function, it shouldn't be needing a $loop var to work
// paste the function here and may be we will take a look at that
// pagination_bar( $loop );
the_posts_pagination();
?>
<?php else : ?>
<?php // No Posts Found ?>
<?php endif; ?>
Had to add this to my functions.php
add_rewrite_rule('^blog/page/([0-9]+)','index.php?pagename=blog&paged=$matches[1]', 'top');
I'm trying to output all posts under custom post type "philosophy" on a page in a list. Alternating between categories "img-left" and "img-right".
I can get the posts to display ALL "philosophy" posts however i want to lay out the posts in two layouts depending on their custom category.
If the category is "img-right" i want the post to be shown with the text on the left and image on the right and vice-versa for "img-left".
I have tried the below code which doesn't work at all.
<?php
$args = array( 'post_type' => 'philosophy', 'posts_per_page' => 10 );
$loop = new WP_Query( $args );
if( in_category( 'img-right' ) ):
while ( $loop->have_posts() ) : $loop->the_post();
echo '<div class="col-md-12"><h2>';
the_title();
echo '</h2></div><div class="row content"><div class="col-md-6"';
the_content();
echo '</div><div class="col-md-5 offset-1 float-right">';
the_post_thumbnail('array(100,100)');
echo '</div></div>';
endwhile;
endif;
?>
by removing the "if" and "endif" i have the code that lists all the posts in one layout. What I need is conditionals that can output both "img-right" and "img-left" layouts based on the post's category. The only layout shown in my example above is "img-right".
Any help would be greatly appreciated. This PHP is making my head spin!
So...with all the help from the guys answering i figured it out using the CSS approach touched on by #Mohsin.
Here is my code:
<div id="content" class="col-12" role="main">
<?php get_template_part('loops/page-content'); ?>
</div>
<div class="row">
<?php
$args = array( 'post_type' => 'philosophy', 'posts_per_page' => 10 );
$loop = new WP_Query( $args );
while ( $loop->have_posts() ) : $loop->the_post();
echo '<div class="row content"><div class="col-md-12"><h2>';
the_title();
echo '</div><div class="col-md-6">';
the_content();
echo '</div><div class="col-md-6">';
the_post_thumbnail();
echo '</div></div>';
endwhile;
?>
I then applied this:
.row.content:nth-child(even) {
flex-direction: row-reverse;
}
and we're golden.
Thank you to everyone who helped.
If I understand correctly:
<?php $args = array( 'post_type' => 'philosophy', 'posts_per_page' => 10 ); ?>
<?php $loop = new WP_Query( $args ); ?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
<div class="col-md-12"><h2>
<?php the_title(); ?>
</h2></div>
<div class="row content">
<?php if( in_category( 'img-left' ) ): ?>
<div class="col-md-5 offset-1 float-left">
<?php the_post_thumbnail('array(100,100)'); ?>
</div>
<?php endif; ?>
<div class="col-md-6">
<?php the_content(); ?>
</div>
<?php if( in_category( 'img-right' ) ): ?>
<div class="col-md-5 offset-1 float-right">
<?php the_post_thumbnail('array(100,100)'); ?>
</div>
<?php endif; ?>
</div>
<?php endwhile; ?>
The above code will output all of the posts, with a thumbnail to the left if it is category img-left and thumbnail to the right if in img-right (and outputting both if it is categorized as both, and neither if it is neither category. You may want different behavior, but it should be simple to adjust the conditionals).
If your template becomes anymore complicated, I would recommend moving sections out to template-parts/using functions like get_sidebar().
So basically, I'm working on a custom wordpress theme. What i'm trying to do is to set an icon for each category. If the loop starts and the post has a category, It'll show up with the icon that it has assigned. Right now it shows the correct icons, but the title and exerpt of the post keeps changing to the name of the page. Here is an example I have three posts math, english and history all of them have the correct icon, but display the name blog post page instead of math, english, or history.
<?php /* Template Name: News Blog Page */ get_header(); ?>
<div id="blog-post-wrapper" class="section_wrapper">
<div class="column three-fourth">
<?php $currentPage = get_query_var('paged');
$args = array(
'post_type' => 'post',
'order' => 'DESC',
'posts_per_page' => 9,
'paged' => $currentPage
);
$the_query = new WP_Query($args);
if($the_query -> have_posts()):
while ($the_query -> have_posts()): $the_query -> the_post();
get_template_part('postloopcontent', get_post_format());
endwhile;
echo "<div class='pagination'>";
echo paginate_links(array(
'total' => $the_query -> max_num_pages
));
echo "</div>";
endif;
?>
</div>
<div class="column one-fourth">
<?php get_sidebar(); ?>
</div>
</div>
<?php get_footer(); ?>
the top one is my basic layout and it grabs my loop. the bottom one is my loop
<?php
// Standard Post Format
?>
<?php $bgImage = get_the_post_thumbnail_url(); ?>
<div class="column one-third" style="background-image:url(<?php echo $bgImage; ?>);">
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" class="nws-img">
<?php
// Find the first category the post is in.
$categories = get_the_category();
$category = $categories[ 0 ]->term_id;
$imgargs = array(
'cat' => $category,
'post_status' => 'inherit',
'post_type' => 'attachment',
'posts_per_page' => '1'
);
$imgquery = new WP_Query( $imgargs );
if ( $imgquery->have_posts() ) {
while ( $imgquery->have_posts() ) { $imgquery->the_post(); ?>
<div class="category-featured-image">
<?php echo wp_get_attachment_image( $post->ID, 'thumbnail' ); ?>
</div>
<?php
}
}
// Reset postdata to restore ordinal query.
wp_reset_postdata();
?>
</a>
<div id="content-box">
<h1> <a href="<?php the_permalink(); ?>" > <?php the_title(); ?> </a> </h1>
<?php the_excerpt(); ?>
</div>
</div>
In your loop file, you're resting post data i.e. wp_reset_postdata(); outside the $imgquery loop/condition. If you could wrap the postdata rest function inside the condition, I think that should work.
You code must look like this
<?php
// Standard Post Format
?>
<?php $bgImage = get_the_post_thumbnail_url(); ?>
<div class="column one-third" style="background-image:url(<?php echo $bgImage; ?>);">
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" class="nws-img">
<?php
// Find the first category the post is in.
$categories = get_the_category();
$category = $categories[ 0 ]->term_id;
$imgargs = array(
'cat' => $category,
'post_status' => 'inherit',
'post_type' => 'attachment',
'posts_per_page' => '1'
);
$imgquery = new WP_Query( $imgargs );
if ( $imgquery->have_posts() ) {
while ( $imgquery->have_posts() ) { $imgquery->the_post(); ?>
<div class="category-featured-image">
<?php echo wp_get_attachment_image( $post->ID, 'thumbnail' ); ?>
</div>
<?php
}
// Reset postdata to restore ordinal query.
wp_reset_postdata();
}
?>
</a>
<div id="content-box">
<h1> <a href="<?php the_permalink(); ?>" > <?php the_title(); ?> </a> </h1>
<?php the_excerpt(); ?>
</div>
</div>
I am creating my custom theme and there's Custom Post Type too.
However, pagination for the Custom Post Type is not working. I tried all the possible solution from Stack Overflow but all in vain.
Here's the code:
<?php global $wp_query;
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
'posts_per_page' => 3,
'post_type' => 'services',
'orderby' => 'date',
'order' => 'DESC',
'nopaging' => false,
'paged'=>$paged
);
$the_query = new WP_Query( $args ); ?>
<div class="service-content clearfix">
<ul class="clearfix">
<?php if ( $the_query->have_posts() ) : while ($the_query->have_posts()) : $the_query->the_post(); ?>
<?php $word_count = strlen( wp_strip_all_tags($post->post_content));
$id = get_the_ID();?>
<li class="col-sm-4 wow fadeInDown animated" data-wow-delay="300ms" data-wow-duration="500ms">
<figure class="image">
<?php the_post_thumbnail( 'medium' ); ?>
</figure>
<?php if($word_count<269){ ?>
<h3><?php echo $post->post_title; ?></h3>
<p><?php echo $post->post_content; ?></p>
<?php } else{ ?>
<h3><?php echo $post->post_title; ?></h3>
<?php echo $post->post_content; ?>
<?php } ?>
</li>
<?php endwhile;
next_posts_link();
previous_posts_link();?>
<?php wp_reset_query(); ?>
<?php endif; ?>
</ul>
</div>
Here, posts_per_page is working but Pagination not working , any help?
Please use bellow codes as your need..
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$next = $paged+1;
$prev= $paged-1;
<a href="<?php echo '/page/'.$next; ?>" >NEXT</a>
<a href="<?php echo '/page/'.$prev; ?>" >PREV</a>
Just use paginate_links function
to display the pagination based on your query and paging
$paginate_args = array(
'base' => '%_%',
'format' => '?paged=%#%',
'total' => $the_query ->max_num_pages,
'current' => $paged,
'prev_text' => __('«'),
'next_text' => __('»'),
);
echo paginate_links( $paginate_args );
Make sure the base and format are correct. based on your permalink structure
One of the problems with pagination in Wordpress is that the Posts per page value is ignored and the Blog pages show at most setting in the Reading page of the Wordpress settings is taken as the actual value. So, you are trying to show 3 per page and on the first page that works. However, when you go to the second page, Wordpress is loading a different offset so your code will not work.
This issue has been explained extremely well over on the Wordpress Stack Exchange so I won't repeat that user's answer. You can read more here:
https://wordpress.stackexchange.com/questions/30757/change-posts-per-page-count
That should sort out the problem for you.
I have problem to change content on page when for ex. url change from
/?page_id=55&paged=1 to /?page_id=55&paged=2...
So I have problem to display next/previous page content, it just show first 4 post on page and when I click next nothing hapend with content just url change.
Here is my blog template:
<?php
/*
Template Name: Blog
*/
?>
<?php get_header(); ?>
<div class="row main-part">
<?php
$args = array(
'category_name' => 'blog',
'paged' => $paged,
'posts_per_page' => 4
);
$args['paged'] = get_query_var( 'paged' ) ? get_query_var( 'paged' ) : 1;
$custom_query = new WP_Query( $args );
$temp_query = $wp_query;
$wp_query = NULL;
$wp_query = $custom_query;
?>
<?php
if ( $custom_query->have_posts() ) :
while ( $custom_query->have_posts() ) :
$custom_query->the_post();
?>
<div class="col-xs-12 col-md-3">
<h1><?php the_title(); ?></h1>
<p>
<?php the_excerpt(); ?>
</p>
<p><a class="btn btn-primary" href="<?php the_permalink() ?>" role="button">View details »</a></p>
</div>
<?php endwhile;endif; ?>
<?php
wp_reset_postdata();
wp_reset_query();
// Custom query loop pagination
previous_posts_link( 'Older Posts' );
next_posts_link( 'Newer Posts', $custom_query->max_num_pages );
// Reset main query object
$wp_query = NULL;
$wp_query = $temp_query;
?>
</div>
<?php get_footer(); ?>