Horje
wordpress ajax load more - Wordpress Solution
wordpress ajax load more I need a "Load More" functionality in my site. in a blog page templates and also later in "resources" custom post type. here is my custom query code:
<div id="wrap-posts" class="row wrap-posts">
    <?php
        $sticky = get_option( 'sticky_posts' );
        $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
        $args = array(
                'post_type' => 'post',
                'posts_per_page' => '9',
                'post__not_in' => $sticky,
                'paged' => $paged
        );

        // The Query
        $query = new WP_Query( $args );
        $i = 0;

        // The Loop
        if ( $query->have_posts() ) {
            while ( $query->have_posts() ) {
                $query->the_post();
                $i++;
                //Get post thumbnail
                $post_id = get_the_ID();
                $category_object = get_the_category($post_id);
                $category_name = $category_object[0]->name;
                $term_id = $category_object[0]->term_id;
                $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'blog-post-thumb' );
                // $post_thumbnail_alt = get_post_meta ( get_post_thumbnail_id(), '_wp_attachment_image_alt', true );
                // Start post
                echo '<div class="col-md-6 col-xl-4">';
                    echo '<div class="card">';
                        echo '<a rel="nofollow" class="card-img" href="'. get_the_permalink() .'">';
                        if($image){
                            echo '<img src="'. $image[0] .'" class="img-fluid" alt="">';
                        }
                        echo '</a>';
                        echo '<div class="card-body">';
                        echo '<a rel="nofollow" href="'. get_term_link($term_id) .'" class="category-name '. strtolower(str_replace(' ', '', $category_name)) .'">'. $category_name .'</a>';
                        echo '<a rel="nofollow" href="'. get_the_permalink() .'">';
                        echo '<h2 class="card-title">'. get_the_title() .'</h2>';
                        echo '</a>';
                        echo '<p>';
                        echo __('Blog Post','dbm');
                        // echo get_the_excerpt();
                        echo '</p>';
                        echo '<small>' . get_the_author_meta('display_name') . ' | ' . get_the_time('F j, Y') . '</small>';
                        echo '</div>';
                    echo '</div>';
                echo '</div>';
            // End post
                }
            } else {
                // no posts found
            }
        // Restore original Post Data
        wp_reset_postdata(); 	
    ?>
</div>
<div class="load-more">
    <button class="load-more-btn"><?php echo __('Load more','dbm'); ?></button>
</div>
* At the bottom - button load more needs to load a flexible number which I can play with and change later (not depanding on wordpress settings) * WHen there are no more posts button should disappear of course * I need to be able to extand this code and add it to another places in the site

Solution - 1

why don't you try this plugin: https://wordpress.org/plugins/ajax-load-more/ its good and will work in your case.


Solution - 2

You need to create a function to do that and place it in functions.php It would look something like below


function loadmore_articles(){

	// prepare our arguments for the query

	$args = json_decode( stripslashes( $_POST['query'] ), true );
	$args['paged'] = $_POST['page'] + 1; // we need next page to be loaded
	$args['post_status'] = 'publish';
        $args['posts_per_page']=5;  // Set number of posts here 



	query_posts( $args );

	if( have_posts() ) :

		// run the loop
		while( have_posts() ): the_post();

			
      

			     get_template_part( 'template-parts/content', get_post_format() );
  
			

		endwhile;

else: ?>

<style>
      .load-more-btn{
       display:none !important;
      }
  </style>

<?php
	endif;
	die;
}

$args['posts_per_page']=5;  // Set number of posts here as you wish
Let me know if it helps Thanks


Solution - 3

Hi Hamergil, Could you send me a temporary login details credentials that you can change/delete once this topic is resolved. So I will do it. email : [email protected]





Wordpress

Related
[ TABLECONTENT NOT RESPONSIVE ON SMALL SCREENS ] - Wordpress Solution [ TABLECONTENT NOT RESPONSIVE ON SMALL SCREENS ] - Wordpress Solution
Populate entries from repeater field in another field (same form) to add more details. - Wordpress Solution Populate entries from repeater field in another field (same form) to add more details. - Wordpress Solution
Moving Delivery Date Field in Checkout Page - Wordpress Solution Moving Delivery Date Field in Checkout Page - Wordpress Solution
WP Query pagination outputs, but page links do not change the query. - Wordpress Solution WP Query pagination outputs, but page links do not change the query. - Wordpress Solution
Drop Down Menu Arrow Missing - Wordpress Solution Drop Down Menu Arrow Missing - Wordpress Solution

Type:
Code Example
Category:
Coding
Sub Category:
Code Example
Uploaded by:
Admin
Views:
44