Webflow CMS Previous/Next Buttons

webflow-cms-prev-next.js

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);
    
  });