Jump to content

Wells: Is there a way to replace "Prev / Next" with "Newer / Older" on the Blog Page?

Recommended Posts

I'm using the Wells template and I seem to be stuck with "Prev / Next," both at the bottom of a blog page with multiple posts and at the bottom of any single blog post. I want to change this to "Newer / Older" because only those terms are unambiguous in the context of a page employing reverse chronology, like a blog.

While the use of "previous / next" (and the similar "back / forward") is common on the web, it is unclear whether the terms are meant to apply to recency of posting or sequence of posts, and different users interpret this differently. I'd like to stay away from this kind of poor ergonomics on my site.

Note that I have no experience with coding and have selected Squarespace for the ease of working with the great templates and simple interface. Easy instructions, please!

Here's a link to one of my blog posts in Wells featuring the unwanted "Prev / Next".

And here's a link to a blog page in Flatiron that deploys "Newer / Older" instead.

I am a linguist, strategic namer, categorist and photographer. I am thrilled to be building my own website thanks to Squarespace. (I am also routinely bewildered as to how to proceed, simple interface and brilliant template-based system notwithstanding...)

Link to comment
  • Replies 8
  • Views 10.9k
  • Created
  • Last Reply

Anyone? It's my first time posting here, and I'm pretty sure this is a valid question. I tried using a ticket, but Squarespace said it's beyond the scope of what they help with. I appreciate any assistance.

I am a linguist, strategic namer, categorist and photographer. I am thrilled to be building my own website thanks to Squarespace. (I am also routinely bewildered as to how to proceed, simple interface and brilliant template-based system notwithstanding...)

Link to comment

I've looked into this, and actually have a solution, save for one thing. The Wells blog navigation seems to be backwards. I actually posted a 'Question' about this a couple days ago but the Answers page was down and I didn't bother to redo the question.

The problem is that (as far as I can tell) 'Prev' will take you to the next post, and 'Next' will take you to the previous post. And when you change it to 'Newer' and 'Older' it becomes even more confusing. Basically, with my hack, clicking on 'Newer' will open the blog post created before it. Not sure why its set up that way.

Link to comment

Thanks, Kale. I'm interested in your solution (as well as in your original question that went unposted), because maybe the terms can be entered in reverse, for an elegant solution?

Though I don't think that the present navigation can be simply called "backwards"—since both terms can refer to either posts or pages, they are doomed to be ambiguous. (In Wells "previous" and "next", are basically referring to pages, not posts; "older" posts are on the "next" page; "newer" ones on a "previous" one. Many blogs do this and it's as messy as when "next" and "previous" are used the other way around.)

I am a linguist, strategic namer, categorist and photographer. I am thrilled to be building my own website thanks to Squarespace. (I am also routinely bewildered as to how to proceed, simple interface and brilliant template-based system notwithstanding...)

Link to comment

Here is how I was able to replace the 'Prev' with 'Older' and 'Next' with 'Newer'. It uses jQuery, so you will have to load jQuery into your site before you can use this script. To load jQuery, go to 'Manage Site' > 'Settings' > 'Code Injection' and paste this into the header:


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>

Then, go to your blog that you want to change the navigation on, and go to 'Blog Settings' > 'Advanced' and paste this into the 'Page Header Code Injection'


<script>
 $(document).ready(function() {
 var text = $('.pagination').html();
 text = text.replace('Prev', 'Older');
 text = text.replace('Next', 'Newer');
 $('.pagination').html(text);
});
</script>

You can change the 'Older' and 'Newer' to whatever you want (and even "reverse" them by switching the two) -- however, it will not change the actual position of the navigation, so the "Prev / Older" will always be to the left and "Next / Newer" will always be to the right. Hope that helps.

Link to comment

Your advice worked without a hiccup. I am exulting in a moment of personal mastery. Kale—I owe you one.

I am a linguist, strategic namer, categorist and photographer. I am thrilled to be building my own website thanks to Squarespace. (I am also routinely bewildered as to how to proceed, simple interface and brilliant template-based system notwithstanding...)

Link to comment
  • 1 year later...
  • 3 weeks later...

Hi, with my blog it doesn't show 'next/prev' or 'older/newer' but the entire blog post title. Do you know how I can change it show just a simple next/prev or remove that navigation completely? Would greatly appreciate your help as I'm not finding answers for this.

Link to comment
  • 2 years later...

Archived

This topic is now archived and is closed to further replies.

Guest
This topic is now closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.