I am working on a site with a page that has multiple sections, each section has multiple loops featuring multiple categories. I use Ajax Load More plugin to load new posts for each sections. The issue is when I click on Load More, it loads both the posts already shown and the one that hasn't been shown. I want it to load only new posts not already shown.
Here is the shortcode I used:
echo do_shortcode('[ajax_load_more container_type="div" post_type="post" posts_per_page="3" preloaded="true" preloaded_amount="4" pause="true" scroll="false" button_loading_label="Loading..." seo="true" category="church-music-news"]');
Here is the loop on on of the sections
<div class="row">
<div class="col-lg-12 col-sm-12">
<div class="music_box bg-color1">
<div class="music_box_top">
<?php
$sticky = get_option( 'sticky_posts' );
rsort( $sticky );
$args = array(
'post__in' => $sticky,
'posts_per_page' => 1,
'cat' => 34
);
$sticky_query = new WP_Query( $args );
while ( $sticky_query->have_posts() ) : $sticky_query->the_post();
?>
<a href="<?php the_permalink(); ?>">
<div class="fashion_box_thumb">
<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail( 'full', array() );
}
?>
</div>
</a>
<div class="fashion_box_text">
<a href="<?php the_permalink(); ?>">
<h3><?php the_title(); ?></h3>
</a>
<p><?php the_excerpt(); ?></p>
<div class="post_cont_icons">
<span class="fa fa-comments cmnt"> <?php comments_number('0','1','%'); ?></span>
<?php echo getPostLikeLink(get_the_ID());?>
<span class="matchtime2"><i class="fa fa-clock-o"></i> <?php the_time();?><br></span>
</div>
</div>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<div class="clear"></div>
</div><!--music_box_top-->
<div class="fashion_box_bottom">
<?php
$args = array(
'post__not_in' => get_option( 'sticky_posts' ),
'posts_per_page' => 4,
'cat' => 34
);
$sticky_query = new WP_Query( $args );
$count = 0;
while ( $sticky_query->have_posts() ) : $sticky_query->the_post(); ?>
<?php $count++; ?>
<?php if ($count == 1) :
?>
<div class="fashion_box_bottom_item">
<a href="<?php the_permalink(); ?>">
<h4><?php the_title(); ?></h4>
</a>
</div>
<?php elseif ($count == 2) : ?>
<div class="fashion_box_bottom_item">
<a href="<?php the_permalink(); ?>">
<h4><?php the_title(); ?></h4>
</a>
</div>
<?php elseif ($count == 3) : ?>
<div class="fashion_box_bottom_item">
<a href="<?php the_permalink(); ?>">
<h4><?php the_title(); ?></h4>
</a>
</div>
<?php elseif ($count == 4) : ?>
<div class="fashion_box_bottom_item">
<a href="<?php the_permalink(); ?>">
<h4><?php the_title(); ?></h4>
</a>
</div>
<div class="clear"></div>
</div><!--music_box_bottom-->
</div><!--music_box-->
</div><!--col-lg-12-->
<?php else :
get_template_part( 'woodclefpro/pro_template3' );
endif;
endwhile;
wp_reset_postdata(); ?>
</div><!--row-->
<div class="row">
<?php
echo do_shortcode('[ajax_load_more container_type="div" post_type="post" posts_per_page="3" preloaded="true" preloaded_amount="4" pause="true" scroll="false" button_loading_label="Loading..." seo="true" category="church-music-news"]');
?>
</div>
This is for those that might come across the question above and are facing the same issue that I was. Here is how I solved it.
Add the code below right before endwhile
$do_not_duplicate[] = $post->ID;
Add this inside your shortcode: post__not_in="'.$post__not_in.'"
Then your final shortcode looks like this:
echo do_shortcode('[ajax_load_more ajax_load_more post__not_in="'.$post__not_in.'" container_type="div" post_type="post" posts_per_page="3" preloaded="true" preloaded_amount="4" pause="true" scroll="false" button_loading_label="Loading..." seo="true" category="church-music-news"]');
Not quite right. The fact is that on the page of one of the Addons to this plugin say that the template output single entry, for example "single.php" should be nothing but a shortcode. All content single.php should be placed in the template used by the plugin. Sorry for the crooked English.
https://connekthq.com/plugins/ajax-load-more/add-ons/single-posts/
Note: Ajax Load More will take care of loading ALL posts, including
the initial post when a user lands on the page. All that should remain
in your single.php loop is the ajax_load_more shortcode (as seen
above).
Related
I have a custom post type. There are single and archive pages. The archive page displays cards with the team. Each card has a city. How can I, when creating a single team member, specify his city and display it on the archive page. This information is not on the single page, only archived.
<?php
$args = array(
'post_type' => 'speakers',
);
$loop = new WP_Query( $args );
while ($loop->have_posts()) :
$loop->the_post(); ?>
<li>
<?php if ( is_object_in_term( $loop->post->ID, 'countries', 'germany' ) ) {
echo '<div class="speaker-flag"><img src="/wp-content/uploads/2022/08/flag-for-germany.svg"></div>';
} else if ( is_object_in_term( $loop->post->ID, 'countries', 'switzerland' ) ) {
echo '<div class="speaker-flag"><img src="/wp-content/uploads/2022/08/flag-for-switzerland.svg"></div>';
} ?>
<a href="<?php echo esc_attr(the_permalink())?>">
<div class="speaker-img">
<?php $img_url = get_the_post_thumbnail_url( $loop->post->ID ); ?>
<img src="<?php echo $img_url ?>">
</div>
<div class="speaker-name">
<p>
<?php the_title(); ?>
</p>
</div>
<div class="speaker-city">
<p>
Fribourg
</p>
</div>
</a>
</li>
<?php endwhile;
wp_reset_query(); ?>
//single
<div class="speaker_info">
<div class="speaker_text">
<h4>
<?php the_title(); ?>
</h4>
<?php the_content(); ?>
</div>
<div class="speaker_img">
<img src="<?php the_field('speaker_img'); ?>">
</div>
</div>
I'm a newbie and I'm creating an homepage where there are 4 blocks from this loop:
<?php $query = new WP_Query( [
'post_type' => 'cases',
'nopaging' => false,
'posts_per_page' => '4',
] ); ?>
<?php if ( $query->have_posts() ) : ?>
<div class="container-fluid">
<div class="roundedframe">
<?php while ( $query->have_posts() ) : $query->the_post(); ?>
<div id="case-study-box" style="background-image: url('<?php the_post_thumbnail_url(); ?>');" class="col-lg-6 col-sm-12">
<a class="portfolio-box " href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<div class="portfolio-box-caption">
<div class="portfolio-box-caption-content">
<div><img src="<?php echo $slideCentralImage['url']; ?>"></div>
<div class="project-name">
<h2><?php the_title(); ?></h2>
</div>
<div class="portfolio-excpert">
<p><?php the_excerpt(); ?></p>
</div>
</div>
</div>
</a>
</div>
<?php endwhile; ?>
</div>
</div>
<?php endif; ?>
<?php wp_reset_postdata(); ?>
Each block is a portfolio item which has many custom fields created with Advanced Custom Fields.
What I need is to get and display them on hover like a "caption".
Actually only the_title and the_permalinkg are working, but I don't know how to get the logo and the excerpt of them.
How can I achieve it?
You can use <?php echo get_field('whateverField');?> and do not forget to change return value image URL.
You can use get_field('<field_name>') to return or the_field('<field_name>') to print the values. You can read more here - https://www.advancedcustomfields.com/resources/displaying-custom-field-values-in-your-theme/.
Just add like this <div><img src="<?php the_field('slide_central_image'); ?>"></div>, where slide_central_image is your image field name. Don't forgot to change 'Return Value' to 'Image URL'.
I recently developed a Wordpress theme, this theme has little bit complex custom post type.
Below is my custom post query code. I would like kind of a else content whenever the request doesn't return any post. Its currently just blank.
I am not a PHP developer though, would someone give me a hand adding such a alternative content ?
Thank you.
<div class="front_page_deal_holder">
<?php
// get the currently queried taxonomy term, for use later in the template file
$term = get_queried_object();
//second query - posts
// Define the query
$args = array(
'post_type' => 'products',
'product_cat' => $term->slug
);
$query = new WP_Query( $args );
if ($query->have_posts()) {
// output the term name in a heading tag
echo'<h1>All Products about '. $term->name . '</h1>';
echo'<div class="row">';
// Start the Loop
while ( $query->have_posts() ) : $query->the_post(); ?>
<div class="col-lg-3">
<a style="display:block;text-decoration:none" href="<?php the_permalink(); ?>">
<div class="single_front_sec">
<?php $featured_img_url = get_the_post_thumbnail_url(get_the_ID(),'post-image'); ?>
<img class="post_thumb_cus" src="<?php echo $featured_img_url ?>" alt="Product Image">
<h2 class="featured_product_heading">
<?php the_title(); ?>
</h2>
<span class="offer_note"><p><?php echo get_post_meta($post->ID, 'Offer Note', true); ?></p></span>
<div class="vew_d_button_holder">
<a class="view_d_button" href="<?php the_permalink(); ?>">View Details</a>
</div>
</div>
</a>
</div>
<?php endwhile; ?>
</div>
<!-- row -->
<div class="my_Custom_pagination">
<?php wp_pagenavi( array( 'query' => $query ) ); ?>
</div>
<?php } // end of check for query having posts
// use reset postdata to restore orginal query
wp_reset_postdata();
?>
<?php include_once('top-categories.php'); ?>
<!--==== Top catogory section ====-->
<!-- front deal closed -->
</div>
elseif(!$query->have_posts()){//HTML here}
or
else{ //HTML here}
right after the end of check for your query , if you want to follow an OOP rule to make your code cleaner , move everything into a function inside function.php file and call the function there instead
<div class="front_page_deal_holder">
<?php
// get the currently queried taxonomy term, for use later in the template file
$term = get_queried_object();
$args = array(
'post_type' => 'products',
'product_cat' => $term->slug
);
$query = new WP_Query( $args );
if ($query->have_posts()) {
echo'<h1>All Products about '. $term->name . '</h1>';
echo'<div class="row">';
while ( $query->have_posts() ) : $query->the_post(); ?>
<div class="col-lg-3">
<a style="display:block;text-decoration:none" href="<?php the_permalink(); ?>">
<div class="single_front_sec">
<?php $featured_img_url = get_the_post_thumbnail_url(get_the_ID(),'post-image'); ?>
<img class="post_thumb_cus" src="<?php echo $featured_img_url ?>" alt="Product Image">
<h2 class="featured_product_heading">
<?php the_title(); ?>
</h2>
<span class="offer_note"><p><?php echo get_post_meta($post->ID, 'Offer Note', true); ?></p></span>
<div class="vew_d_button_holder">
<a class="view_d_button" href="<?php the_permalink(); ?>">View Details</a>
</div>
</div>
</a>
</div>
<?php endwhile; ?>
</div>
<div class="my_Custom_pagination">
<?php wp_pagenavi( array( 'query' => $query ) ); ?>
</div>
<?php }else{
// Add your code here for else part
}
wp_reset_postdata();
?>
<?php include_once('top-categories.php'); ?>
</div>
Here's the page template code I'm working with, defined into sections...
<?php
//* Template Name: Partnerships Archive
?>
<!-- Header =========================================== -->
<?php get_header(); ?>
<!-- Homepage Header Video =========================================== -->
<div class="subpage-video-sca">
<!-- VIDEO -->
<div class="subpage-desktop-vid-sca">
<video title="<?php the_field('seo_video_title'); ?>" autoplay loop muted playsinline>
<source src="<?php the_field('vimeo_link'); ?>" type="video/mp4">
</video>
</div>
<!-- GRAD-OVERLAY -->
<div class="subpage-overlay-image-sca">
</div>
<!-- OVERLAID TEXT -->
<div class="subpage-text-over-video-sca">
<div>
<h1><?php the_field('sub_page_title'); ?></h1>
<p><?php the_field('paragraph'); ?></p>
</div>
</div>
</div>
<!-- Breadcrumbs =========================================== -->
<?php echo do_shortcode("[breadcrumbs]"); ?>
<!-- Main Content =========================================== -->
<div class="wrap">
<?php
$args = array(
'post_type' => 'partnerships',
'orderby' => 'title',
'order' => 'ASC'
);
$the_query = new WP_Query( $args );
?>
<?php if ( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<a class="one-third partnership-block" href="<?php the_permalink(); ?>">
<img src="<?php the_field('logo'); ?>" alt="<?php the_title();?> graphic">
</a>
<?php $products_count = $the_query->current_post + 1; ?>
<?php if ( $products_count % 4 == 0): ?>
</div><div class="row">
<?php endif; ?>
<?php endwhile; endif; ?>
</div>
<!-- Testimonials =========================================== -->
<div class="wrap">
<div class="page-section-headers pt-testimonials-container txt-right">
<h1>WHAT <span class="red">OUR PARTNERS</span><br>HAVE TO SAY</h1>
</div>
<?php if( have_rows('testimonial') ): ?>
<div class="testimonial-slider-container slick-slider">
<?php while( have_rows('testimonial') ): the_row();
// vars
$text = get_sub_field('testimonial_text');
$client = get_sub_field('client_name');
$company = get_sub_field('client_company');
?>
<div class="testimonial-slider-single">
<p><?php echo $text; ?></p>
<h2><?php echo $client; ?></h2>
<h3><?php echo $company; ?><h3>
</div>
<?php endwhile; ?>
</div>
<?php endif; ?>
</div>
The code in the main content area is pulling through custom post types I have.
The code in the Testimonials area is pulling through data from an ACF Repeater field for this page specifically.
They both work independently but when I have them both on the page at the same time, the testimonials doesn't pull through.
That said, Ive just noticed that when I put the testimonials first and the main content after, they both work!!
Can anyone help? Is there something I haven't closed properly in the Main content or something? I don't get it...
It's wordpress, using Genesis Framework, latest versions of both. The page is here: http://staging.seedcreativeacademy.co.uk/partnerships/
add wp_reset_postdata(),after while :
<div class="wrap">
<?php
$args = array(
'post_type' => 'partnerships',
'orderby' => 'title',
'order' => 'ASC'
);
$the_query = new WP_Query( $args );
?>
<?php if ( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<a class="one-third partnership-block" href="<?php the_permalink(); ?>">
<img src="<?php the_field('logo'); ?>" alt="<?php the_title();?> graphic">
</a>
<?php $products_count = $the_query->current_post + 1; ?>
<?php if ( $products_count % 4 == 0): ?>
</div><div class="row">
<?php endif; ?>
<?php endwhile; wp_reset_postdata(); endif; ?>
</div>
I'm trying to get two posts per slide in my Wordpress theme. I get posts from the category "news" and want to display about 5 pages with 2 posts. At this moment it displays just one.
This is the code I've got at the moment.
<div class="banner">
<ul>
<?php $logo = new WP_Query( array( 'category_name' => 'news', 'posts_per_page' => 10 ) ); ?>
<?php while ($logo->have_posts()) : $logo->the_post(); ?>
<?php $do_not_duplicate[] = $post->ID; ?>
<li class="news-item col-1-1 no-pad">
<div class="description">
<h4><?php the_title(); ?></h4>
<p class="post-date">Gepubliceerd op: <?php echo get_the_date('d-m-Y'); ?></p>
<p><?php content(160); ?></p>
</div>
<a class="button-med" href="<?php echo get_permalink(); ?>">Lees meer</a>
</li>
<?php endwhile; wp_reset_postdata(); ?>
</ul>
</div>