Javascript pagination and SEO

Question

I have a single-page application based on react.js. In one view I have a paginated table containing links to other pages on the left side and some content on the right side. The pagination is done with reactjs and the pagination buttons don't have a href attribute like `?page=2.

I assume that google or other search engines won't be able to access links from the tables of second or later pages. Is this assumption valid?

If that's right I will add href tags like href=link?page=2 to the pagination and to make the following pages directly accessible.

This brings up another question:

I have cannonical tags on my page. Should I include page=2 in this tag? Because the content on the right side does not change, wouldn't this lead to duplicate content?

Answer 1

First, you need to add hrefs to your pagination, this will allow page rank to flow to all the pages you have.

Then make sure when you type in the URL bar: www.example.com/section-name?page=2 your system will return a new data set, also when you ask for page 3 and 4 etc.

Also make sure to update the pagination, for example if you are on page 3, the pagination should give you page 4,5,6 etc.

After doing this, Google will see all your pages and the page rank will flow into all of them.

Next you have to add relations "next" and "previous" to your pages. These relations will tell Google what pages to follow after the current page.

EX: we are on the second page, the next page is 2 and the previous page is 1

<link rel="prev" href="http://www.example.com/article-part1.html">
<link rel="next" href="http://www.example.com/article-part3.html">

Now you can use canonical links, there are many approach this for pagination, the best one is to always give a canonical link to the first page.