Skip to content

Instantly share code, notes, and snippets.

@nocodesupplyco
Created December 19, 2022 03:18
Show Gist options
  • Save nocodesupplyco/1b70ebf88cf5ce43d826c8d0c1da913b to your computer and use it in GitHub Desktop.
Save nocodesupplyco/1b70ebf88cf5ce43d826c8d0c1da913b to your computer and use it in GitHub Desktop.
Webflow CMS Previous/Next Buttons
var Webflow = Webflow || [];
Webflow.push(function () {
var next_href = $('#post_list .w--current').parent().next().find('a').attr('href');
var previous_href = $('#post_list .w--current').parent().prev().find('a').attr('href');
var next_title = $('#post_list .w--current').parent().next().find('a #post_title').text();
var previous_title = $('#post_list .w--current').parent().prev().find('a #post_title').text();
var next_snip = $('#post_list .w--current').parent().next().find('a #post_snip').text();
var previous_snip = $('#post_list .w--current').parent().prev().find('a #post_snip').text();
var next_date = $('#post_list .w--current').parent().next().find('a #post_date').text();
var previous_date = $('#post_list .w--current').parent().prev().find('a #post_date').text();
var next_img = $('#post_list .w--current').parent().next().find('a #post_img').attr('src');
var previous_img = $('#post_list .w--current').parent().prev().find('a #post_img').attr('src');
//if last post in list
if(next_href == undefined) {
next_href = $('#post_list').children().children().first().find('a').attr('href');
$('#next_button').fadeOut(); //optional - remove if you want to loop to beginning
}
//if first post in list
if(previous_href == undefined) {
previous_href = $('#post_list').children().children().last().find('a').attr('href');
$('#previous_button').fadeOut(); //optional - remove if you want to loop to end
}
//apply data to next / previous buttons
$('#next_button').attr('href', next_href);
$('#previous_button').attr('href', previous_href);
$('#next_title').text(next_title);
$('#previous_title').text(previous_title);
$('#next_snip').text(next_snip);
$('#previous_snip').text(previous_snip);
$('#next_date').text(next_date);
$('#previous_date').text(previous_date);
$('#next_img').attr('src', next_img);
$('#previous_img').attr('src', previous_img);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment