[Video] Pagination for Repeater in Oxygen

As of Oxygen 3.0, the Repeater component does not include pagination.

Thanks to the workaround by Steve Crandall, it is possible by adding an Easy Posts component with the same query as that of the Repeater followed by deleting the Template PHP & CSS.

Watch the screencast below to learn how:

Step 1

Add a Repeater component and set it up including whether the query should be default or custom and what to show in each of the repeater rows.

Step 2

Add an Easy Posts component right below the Repeater.

Set the same query as in Step 1.

Delete all the code in Template PHP and CSS.

Step 3

Add the following sample CSS (for the default Atomic design set) in Easy Posts’ Template CSS area and modify to suit:

%%EPID%% .oxy-posts + .oxy-easy-posts-pages {
  text-align: start;
}

%%EPID%% a.page-numbers {
  color: color(7);
  padding: 12px;
}

%%EPID%% a.page-numbers:hover {
  color: color(7);
}

%%EPID%% span.page-numbers {
  color: color(8);
  background: color(2);
  padding: 12px 18px;
  margin: 0 8px;
}