craigramsay

<p>Load paged content with Ajax throughout your WordPress site. The plugin works on posts, pages, search, custom post types and WooCommerce. Paginate MULTIPLE sets of posts in the same template.</p>
<p>Take a look at the <a href="http://www.wordpress-ajax-pagination.com" rel="nofollow ugc">demo site</a>.</p>
<p>We’re looking for websites that use the plugin to feature on a showcase page. If you’re interested please email a link to your website to <a href="mailto:hello@wordpress-ajax-pagination.com?subject=Website Submission" rel="nofollow ugc">hello@wordpress-ajax-pagination.com</a>.</p>
<p>There are 3 pagination types to choose from.</p>
<ul>
<li>Infinite Scroll – Automatically load new posts when the user reaches the bottom of the screen.</li>
<li>Load More Button – Click to load new posts.</li>
<li>Pagination – Normal pagination but load the next page with Ajax.</li>
</ul>
<h4>Set Up</h4>
<ul>
<li>For additional help watch this <a href="http://www.wordpress-ajax-pagination.com/set-up" rel="nofollow ugc">video</a>.</li>
<li>Once the plugin is installed navigate to Settings -> Ajax Pagination Settings.</li>
<li>Select an applicable theme default. If your theme isn’t listed then add the correct selectors.</li>
<li>There are 4 required selectors which can be found by using your browser developer tools.</li>
<li>‘Posts Selector’ The selector that wraps all of the posts/products.</li>
<li>‘Post Selector’ The selector of an individual post/product.</li>
<li>‘Navigation Selector’ The selector of the post/product navigation.</li>
<li>‘Next Selector’ The selector of the navigation next link.</li>
<li>Choose a pagination type.</li>
<li>Add an optional callback.</li>
<li>Click ‘Save Changes’.</li>
</ul>
<h4>Multiple Settings</h4>
<p>If for example your site is running WooCommerce and also a Blog then the two templates will probably use different selectors and require a different set up from the admin settings.</p>
<ul>
<li>Click ‘Add New’ at the top of the screen.</li>
<li>Repeat the set up steps above and click ‘Save Changes’.</li>
<li>At the top of the screen you can navigate between your saved settings.</li>
</ul>
<h4>Multiple Sets of Posts</h4>
<p>It’s possible to query and display multiple sets of posts in the same template and independently paginate them. This requires a specific set up within the template file which has been outlined <a href="http://www.wordpress-ajax-pagination.com/multiple-posts-set-up" rel="nofollow ugc">here</a>.</p>
<h4>Delete Setting</h4>
<ul>
<li>At the top of the screen select the pagination setting you wish to delete.</li>
<li>Scroll to the bottom of the screen and click ‘Delete’.</li>
</ul>
<h4>Styling Load More Button</h4>
<ul>
<li>The load more button is wrapped in a div with the css class .malinky-load-more and the button has the css class .malinky-load-more__button.</li>
<li>Style these in your themes style.css file.</li>
</ul>
<h4>Initialization (Setup)</h4>
<p>The plugin is initialized when the page first loads and the pagination is then updated to use Ajax. If you need to reinitialize the plugin at anytime call the folowing function in your javascript.</p>
<pre><code>MalinkyAjaxPaging.setUp();
</code></pre>
<p>This is useful if you run any other javascript / ajax on the page, for example filtering on an ecommerce site.</p>
<h4>Callback</h4>
<ul>
<li>Add your own Javascript code in the settings which runs after each new set of posts are loaded.</li>
<li>Callback receives two parameters: loadedPosts (An array of the new posts) and url (The url that was loaded).</li>
</ul>
<h4>Custom Events</h4>
<p>There are 3 custom events that are triggered. Bind to these events to perform your own actions.</p>
<ul>
<li>
<p>malinkyPaginationInitialized. Triggered after initialization.</p>
<pre><code>document.addEventListener('malinkyPaginationInitialized', function(e) {
      console.log('PaginationInitialized');
    });
</code></pre>
</li>
<li>
<p>malinkyLoadPostsStart. Triggered before new posts are loaded.</p>
<pre><code>document.addEventListener('malinkyLoadPostsStart', function(e) {
      console.log('LoadPostsStart');
    });
</code></pre>
</li>
<li>
<p>malinkyLoadPostsComplete. Triggered after new posts are loaded.</p>
<pre><code>document.addEventListener('malinkyLoadPostsComplete', function(e) {
      console.log('LoadPostsComplete');
    });
</code></pre>
</li>
<li>
<p>Events only function when using a single set of pagination on a page.</p>
</li>
</ul>
<h4>Isotope / Masonry</h4>
<p>If your using an isotope / masonry layout then you’ll need to add a callback in the settings to layout the new posts when they are added. This should be in the following format.</p>
<pre><code>$('.grid').isotope('reloadItems').isotope();
</code></pre>
<p>Change the reference to the class name .grid to your own container element.</p>
<h4>Additional</h4>
<ul>
<li>If using infinite scroll there is an option to amend the buffer in pixels before the next set of posts are loaded.</li>
<li>If using load more button there is an option to amend the button text.</li>
<li>You can choose your own preloader.gif.</li>
<li>When using pagination the browser history is maintained allowing your visitors to use the browser back and forward buttons as expected.</li>
</ul>
<h4>Conditional Loading</h4>
<p>By default the plugin loads on every page load. You can stop loading the Javascript and CSS by setting the following constants to false in your wp-config.php file.</p>
<pre><code>define('MALINKY_LOAD_JS', false);
define('MALINKY_LOAD_CSS', false);
</code></pre>
<p>Or by adding these two lines to your functions.php</p>
<pre><code>add_filter( 'malinky_load_js', '__return_false' );
add_filter( 'malinky_load_css', '__return_false' );
</code></pre>
<p>Once disabled you can load the Javascript and CSS in specific templates by adding the following before the wp_head().</p>
<pre><code>global $malinky_ajax_pagination;
$malinky_ajax_pagination->malinky_ajax_pagination_styles();
$malinky_ajax_pagination->malinky_ajax_pagination_scripts();
</code></pre>


Ajax Pagination and Infinite Scroll

I've tried many other plugins before to have an infinite loading function on my shop, but without success and lots of lost time.
With Ajax Pagination and Infinite Scroll it took me literally 2 minutes to have it working 100% so I'm quite happy and totally recommend it :)

Took me 2 min and works perfectly!

Worked for me. You can select different paginations...

Works nice!

Choose infinite scroll, load more button or pagination. Load paged content with Ajax on your posts, pages, search, custom post types and WooCommerce.

Tom Anbinder

Pablo Pacheco

WPFactory

Kousik Mukherjee

Omar AlDabbas

Algoritmika

<blockquote>
<p>“GREAT! WORKS PERFECT AND WONDERFUL SUPPORT: I needed a simple way to allow my clients to go back (BACK TO RESULTS) using my IDX real estate pages. The Back Button worked perfect and was easy to use. The Developer also was very kind to provide me with some additional code to match the rest of my web site colors.” – ⭐⭐⭐⭐⭐ <a href="https://wordpress.org/support/topic/great-works-perfect-and-wonderful-support/" rel="ugc">norwood451</a></p>
</blockquote>
<p><a href="https://wpfactory.com/item/back-button-widget-wordpress-plugin/?utm_source=wporg&utm_medium=organic&utm_campaign=readme" title="Main Page" rel="nofollow ugc">Main Page</a> | <a href="https://wpfactory.com/support/item/back-button-widget-wordpress-plugin/?utm_source=wporg&utm_medium=organic&utm_campaign=readme" title="Support Forum" rel="nofollow ugc">Support Forum</a> | <a href="https://wpfactory.com/docs/back-button-widget-wordpress-plugin/?utm_source=wporg&utm_medium=organic&utm_campaign=readme" title="Documentation & How to" rel="nofollow ugc">Documentation & How to</a></p>
<p>Navigating through a website should be smooth sailing, right?</p>
<p>Well, that’s where our Back Button plugin steps in. It’s all about simplicity and convenience. With just a shortcode or widget, users can add a customizable Back button to their WordPress site, a simple & handy tool for improving navigation and enhancing the user experience, making it smooth for visitors to explore your content and navigate your site easily.</p>
<h3>🚀 Main Features: FREE Version</h3>
<h3>🚀 Add Back Button Using WordPress Widget</h3>
<p>As simple as it sounds, you can add & customize your back button with WP Widget, whenever they are supported on your theme (sidebar, header, footer, menu, WooCommerce sidebar, etc).</p>
<p>It comes with multiple options to customize the appearance of your Back button widget:</p>
<ul>
<li>Give it a unique title</li>
<li>Add text before button</li>
<li>Add text after button</li>
<li>Change button text (label)</li>
<li>Give it a class name (to customize it your own)</li>
<li>Change button style (color) using simple HTML styling options</li>
<li>Select to make the button type to be a button or simple text</li>
<li>Select button JavaScript function to be “back” or “go(-1)”</li>
</ul>
<h3>🚀 Add Back Button Using Shortcode or PHP Function</h3>
<p>If you’re more into customizing the button through shortcode, the plugin allows adding the button by using <code>[alg_back_button]</code> or <code>echo alg_back_button( 'Back' );</code> PHP function.</p>
<h3>🚀 Font Awesome Support</h3>
<p>You can include any icon in your back button using simple addition to the shortcode, like <code>[alg_back_button fa="fas fa-angle-double-left"]</code></p>
<h3>❤️ User Testimonials: See What Others Are Saying!</h3>
<blockquote>
<p>“Great plugin with excellent support: This is a “must have” plugin for every WordPress site, thanks to the developer for creating this plugin, and for providing excellent and fast support.” – ⭐⭐⭐⭐⭐ <a href="https://wordpress.org/support/topic/great-plugin-with-excellent-support-93/" rel="ugc">carsten-lund</a></p>
<p>“Great Plugin!!!: I had a slight issue that was mainly my own error, but the author responded very quickly and all was resolved on this wonderfully simple and very useful plugin.” – ⭐⭐⭐⭐⭐ <a href="https://wordpress.org/support/topic/great-plugin-27772/" rel="ugc">kastenmeier</a></p>
<p>“Great plugin with excellent support: This is a “must have” plugin for every WordPress site, thanks to the developer for creating this plugin, and for providing excellent and fast support.” – ⭐⭐⭐⭐⭐ <a href="https://wordpress.org/support/topic/great-plugin-with-excellent-support-93/" rel="ugc">carsten-lund</a></p>
<p>“Awesome plugin: It just works perfect!” – ⭐⭐⭐⭐⭐ <a href="https://wordpress.org/support/topic/awesome-plugin-4434/" rel="ugc">anticosti</a></p>
</blockquote>
<h3>🏆 Do More: PRO Version</h3>
<p>The premium version of <a href="https://wpfactory.com/item/back-button-widget-wordpress-plugin/?utm_source=wporg&utm_medium=organic&utm_campaign=readme" rel="nofollow ugc">Back Button Widget</a> plugin comes with more features, like:</p>
<h3>🏆 Add Back Button to WordPress Menus</h3>
<p>You can add the back button to any menu location (based on your theme options) or your own menus that you’ve created.<br />
The options allow you to customize the button & item template for the back button</p>
<h3>🏆 Add Back Button as Floating Button</h3>
<p>Add the back function as a floating button anywhere on your page, select from bottom (right & left), and top (right & left) locations where the button should appear.</p>
<p>This comes with basic CSS options to change horizontal & vertical margins.</p>
<h3>💯 Why WPFactory?</h3>
<ul>
<li><strong>Experience You Can Trust:</strong> Over a decade in the business</li>
<li><strong>Wide Plugin Selection:</strong> Offering 65+ unique and powerful plugins</li>
<li><strong>Highly-Rated Support:</strong> Backed by hundreds of 5-star reviews</li>
<li><strong>Expert Team:</strong> Dedicated developers and technical support at your service</li>
</ul>
<h3>What’s Next? Discover More Plugins by WPFactory</h3>
<p>WPFactory has a diverse range of plugins tailored to enhance your experience:</p>
<ul>
<li>
<p><a href="https://wpfactory.com/item/file-renaming-on-upload-wordpress-plugin/" title="**Rename Media Files: Improve Your WordPress SEO**" rel="nofollow ugc"><strong>Rename Media Files: Improve Your WordPress SEO</strong></a>: Enhance SEO and organize media effortlessly with Rename Media Files WordPress Plugin. Fix upload issues, santize & optimize filenames, and improve SEO seamlessly. (<strong><a href="https://wordpress.org/plugins/file-renaming-on-upload/" title="Free version" rel="ugc">Free version</a></strong>)</p>
</li>
<li>
<p><a href="https://wpfactory.com/item/download-plugins-and-themes-from-dashboard-wordpress-plugin/?utm_source=wporg&utm_medium=organic&utm_campaign=readme" title="**Download Plugins and Themes from WordPress**" rel="nofollow ugc"><strong>Download Plugins and Themes from WordPress</strong></a>: Download installed plugins and themes in ZIP files directly from your WordPress admin dashboard, download any or all plugins & themes without FTP or cPanel access (<strong><a href="https://wordpress.org/plugins/download-plugins-dashboard/" title="Free version" rel="ugc">Free version</a></strong>)</p>
</li>
<li>
<p><a href="https://wpfactory.com/item/slugs-manager-wordpress-plugin/?utm_source=wporg&utm_medium=organic&utm_campaign=readme" title="**Slugs Manager: Delete Old Permalinks from WordPress Database**" rel="nofollow ugc"><strong>Slugs Manager: Delete Old Permalinks from WordPress Database</strong></a>: Scan & remove old or outdated slugs (permalinks) in WordPress, keep your database optimized & your URLs SEO-friendly (<strong><a href="https://wordpress.org/plugins/remove-old-slugspermalinks/" title="Free version" rel="ugc">Free version</a></strong>)</p>
</li>
<li>
<p><a href="https://wpfactory.com/item/order-status-rules-for-woocommerce/?utm_source=wporg&utm_medium=organic&utm_campaign=readme" title="**Automated Order Status Controller for WooCommerce**" rel="nofollow ugc"><strong>Automated Order Status Controller for WooCommerce</strong></a>: Change order statuses programmatically based on a wide range of conditions, like time intervals, user roles and more! (<strong><a href="https://wordpress.org/plugins/order-status-rules-for-woocommerce/" title="Free version" rel="ugc">Free version</a></strong>)</p>
</li>
<li>
<p><a href="https://wpfactory.com/item/order-status-for-woocommerce/?utm_source=wporg&utm_medium=organic&utm_campaign=readme" title="**Custom Order Status for WooCommerce**" rel="nofollow ugc"><strong>Custom Order Status for WooCommerce</strong></a>: Create & manage unlimited number of custom statuses, to reflect your business desires & needs. (<strong><a href="https://wordpress.org/plugins/order-status-for-woocommerce/" title="Free version" rel="ugc">Free version</a></strong>)</p>
</li>
<li>
<p><a href="https://wpfactory.com/item/amount-left-free-shipping-woocommerce/?utm_source=wporg&utm_medium=organic&utm_campaign=readme" title="**Free Shipping Amount Label & Progress Bar for WooCommerce**" rel="nofollow ugc"><strong>Free Shipping Amount Label & Progress Bar for WooCommerce</strong></a>: Encourage higher spending by offering free shipping based on amount, with a progress bar for customers. (<strong><a href="https://wordpress.org/plugins/amount-left-free-shipping-woocommerce/" title="Free version" rel="ugc">Free version</a></strong>)</p>
</li>
</ul>


Back Button Widget

A simple & customizable back button, add it to any WordPress page using shortcode or widget for enhanced user navigation experience and site acces …

Ajax Pagination and Infinite Scroll vs Back Button Widget