Home / template / Navigate next, previous adjacent post with jquery and the left, right keys

  • How to Navigate next, previous adjacent post with jquery and the left, right keys

    wordpress snippet navigate-next-prev-adjacent-post-jquery-arrow-keys
    By:

    If you are using adjacent post relational links in the head of your wordpress theme add this little bit of jquery. This will let people navigate next, previous adjacent post with the left and right arrow keys.

    ( click code to copy )

    wordpress snippet : jQuery

    <>
    click to copy
    	$(document).keydown(function(e){
		if (e.which == 37) { // left arrow
		   if(!prev) return false;
			window.location.href = $('link[rel=prev]').attr('href');
		}
		if (e.which == 39) { // right arrow
		   if(!next) return false;
			window.location.href = $('link[rel=next]').attr('href');
		}
	});

    ( WordPress codex functions, hooks, in this snippet. )

    query,
OptinMonster
➨