Pagination isn't loading

I’m not sure where to start here. The pagination simply isn’t loading on my theme. I’m not sure if it’s loading in the wrong spot, but it’s not working on index or archive pages. What’s odd is it does display the total number of pages, just nothing else. Anyone have an idea what I need to look for?

<nav class="pagination" aria-label="Pagination">
	<div class="box pagination-box">
		{{#if prev}}
			<a title="Newer Posts" class="pagination-next" href="{{page_url prev}}">
				<span class="pagination-label">Newer Posts</span>
			</a>
		{{/if}}
		<span class="pagination-info">Page {{page}} of {{pages}}</span>
		{{#if next}}
			<a title="Older Posts" class="pagination-prev" href="{{page_url next}}">
				<span class="pagination-label">Older Posts</span>
			</a>
		{{/if}}
	</div>
</nav>

Covering all the easy things:
If you’re self hosted, have you reloaded Ghost?
Have you checked that you don’t have pagination-next and pagination-prev set to display:none or similar?

The fact that you’re getting the total pages suggests that this /is/ a paginated route…

Hadn’t thought to restart Ghost, but that wasn’t the issue. Looks like I need to add pagination. to all of the variables:

<nav class="pagination" aria-label="Pagination">
	<div class="box pagination-box">
		{{#if pagination.prev}}
			<a title="Newer Posts" class="pagination-next" href="{{page_url pagination.prev}}">
				<span class="pagination-label">Newer Posts</span>
			</a>
		{{/if}}
		<span class="pagination-info">Page {{pagination.page}} of {{pagination.pages}}</span>
		{{#if pagination.next}}
			<a title="Older Posts" class="pagination-prev" href="{{page_url pagination.next}}">
				<span class="pagination-label">Older Posts</span>
			</a>
		{{/if}}
	</div>
</nav>

Now it works!

1 Like