Public JavaScript Functions | Docs

The following public JavaScript functions allow for manipulation of Ajax Load More instances.

Click
Filter

Click

almTriggerClick() – This function will allow you trigger an Ajax Load More load from any element on the screen.

var button = document.querySelector('button.my_button');

if(button){

almTriggerClick();

}

Note: almTriggerClick should only be called when a single instance of Ajax Load More is on the page.

Filter

ajaxloadmore.filter(transition, speed, data) – This function will allow you to update Ajax Load More parameters on the fly and provide a clean transition between each filter – view the example

The filter() method requires the following parameters:

transition	Select a transition type. ‘fade’ \| null
speed	The speed of the transition, in milliseconds. e.g. ‘300’
data	The data() object that holds the parameters for updating.

// Custom Filter JavaScript

// Click Event

function filterClick(){

var transition = 'fade';

var speed = 250;

var data = this.dataset;

// Call Ajax Load More `filter` method

ajaxloadmore.filter(transition, speed, data);

}

// Get all buttons

var buttons = document.querySelectorAll('ul.filters li a');

if(buttons){

// Loop each button and add click event

[].forEach.call(buttons, function(button) {

button.addEventListener('click', filterClick);

});

}

<li>

<a href="#" data-button-label="More Work" data-post-type="portfolio">Recent Work</a>

</li>

<li>

<a href="#" data-button-label="More Posts" data-post-type="post">Latest Posts</a>

</li>

</ul>

Note: When filtering, underscores in shortcode attributes must be converted to dashes.
e.g. button_label = button-label