diff --git a/files/assets/css/main.css b/files/assets/css/main.css
index 881f8883d..e2911a7ed 100644
--- a/files/assets/css/main.css
+++ b/files/assets/css/main.css
@@ -6,6 +6,7 @@
 
 .fa-align-left:before{content:"\f036"}
 .fa-long-arrow-left:before{content:"\f177"}
+.fa-arrow-left:before{content:"\f060"}
 .fa-arrow-right:before{content:"\f061"}
 .fa-sign-out:before{content:"\f08b"}
 .fa-long-arrow-right:before{content:"\f178"}
diff --git a/files/assets/js/post.js b/files/assets/js/post.js
index 19360154b..e96cbe3d6 100644
--- a/files/assets/js/post.js
+++ b/files/assets/js/post.js
@@ -34,7 +34,7 @@ if (fake_textarea) {
 }
 
 
-//KEYBOARD ARROW NAVIGATION
+//POST NAVIGATION
 
 const post_ids = localStorage.getItem("post_ids").split(', ');
 const current_index = post_ids.indexOf(`'${location.href}'`)
@@ -42,6 +42,20 @@ if (current_index > -1) {
 	const id_after = post_ids[current_index+1]
 	const id_before = post_ids[current_index-1]
 
+	if (id_before || id_after) {
+		document.getElementById('post_navigation').classList.remove('d-none')
+	}
+
+	if (id_before) {
+		document.getElementById('post_before').classList.remove('disabled')
+		document.getElementById('post_before').href = id_before.slice(1, -1)
+	}
+
+	if (id_after) {
+		document.getElementById('post_after').classList.remove('disabled')
+		document.getElementById('post_after').href = id_after.slice(1, -1)
+	}
+
 	document.addEventListener('keydown', (e) => {
 		if (document.activeElement.tagName != 'TEXTAREA' && document.activeElement.tagName != 'INPUT') {
 			if (id_before && e.key == 'ArrowLeft') {
diff --git a/files/assets/js/post_ids.js b/files/assets/js/post_ids.js
index 13253ea53..3dd3e303b 100644
--- a/files/assets/js/post_ids.js
+++ b/files/assets/js/post_ids.js
@@ -1,2 +1,2 @@
 const post_ids = document.getElementById('post_ids').value.slice(1, -1)
-localStorage.setItem("post_ids", post_ids);
+sessionStorage.setItem("post_ids", post_ids);
diff --git a/files/templates/post.html b/files/templates/post.html
index 12bacf337..58e9ea412 100644
--- a/files/templates/post.html
+++ b/files/templates/post.html
@@ -294,6 +294,21 @@
 		<div autocomplete="off" class="markdown d-none border my-2 p-3 rounded" id="markdown-{{p.fullname}}" readonly>{{p.body.strip()}}</div>
 	{% endif %}
 
+	<div id="post_navigation" class="d-none my-4" style="top: 0px; transition: top cubic-bezier(0, 0, 0.2, 1) 220ms; position: relative; z-index: 1029">
+		<div id="post_navigation-tabs" class="row" style="justify-content: center">
+			<a id="post_before" class="disabled btn btn-primary btn-block m-0 shop-tab award-tab">
+				<span class="mr-auto ml-auto">
+					<i class="fas fa-arrow-left"></i> Previous Post
+				</span>
+			</a>
+			<a id="post_after" class="disabled btn btn-primary btn-block m-0 shop-tab award-tab">
+				<span class="mr-auto ml-auto">
+					<i class="fas fa-arrow-right"></i> Next Post
+				</span>
+			</a>
+		</div>
+	</div>
+
 	<div class="row border-md-0 comment-section pb-3">
 		<div class="col border-top">
 			<div class="comments-count py-3">