diff --git a/src/app/(isr)/og/page.tsx b/src/app/(isr)/og/page.tsx
index e8272969..3183cefb 100644
--- a/src/app/(isr)/og/page.tsx
+++ b/src/app/(isr)/og/page.tsx
@@ -1,14 +1,30 @@
-import StaggeredPhotos from '@/photo/StaggeredPhotos';
-import { getPhotos } from '@/services/postgres';
+import MorePhotos from '@/components/MorePhotos';
+import { getPhotosLimitForQuery } from '@/photo';
+import StaggeredOgPhotos from '@/photo/StaggeredOgPhotos';
+import { getPhotos, getPhotosCount } from '@/services/postgres';
 
 export const runtime = 'edge';
 
-export default async function GridPage() {
-  const photos = await getPhotos();
+export default async function GridPage({
+  searchParams,
+}: {
+  searchParams: { next: string };
+}) {
+  const { offset, limit } = getPhotosLimitForQuery(searchParams.next);
+
+  const photos = await getPhotos(undefined, limit);
+
+  const count = await getPhotosCount();
+
+  const showMorePhotos = count > photos.length;
   
   return (
-    <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-3">
-      <StaggeredPhotos photos={photos} />
+    <div className="space-y-3">
+      <div className="grid gap-3 grid-cols-2 md:grid-cols-3 lg:grid-cols-4">
+        <StaggeredOgPhotos photos={photos} />
+      </div>
+      {showMorePhotos &&
+        <MorePhotos path={`/og?next=${offset + 1}`} />}
     </div>
   );
 }
diff --git a/src/photo/StaggeredPhotos.tsx b/src/photo/StaggeredOgPhotos.tsx
similarity index 97%
rename from src/photo/StaggeredPhotos.tsx
rename to src/photo/StaggeredOgPhotos.tsx
index 12a6eeff..cb7c2700 100644
--- a/src/photo/StaggeredPhotos.tsx
+++ b/src/photo/StaggeredOgPhotos.tsx
@@ -8,7 +8,7 @@ const DEFAULT_MAX_CONCURRENCY = 3;
 
 type PhotoLoadingState = Record<string, OGLoadingState>;
 
-export default function StaggeredPhotos({
+export default function StaggeredOgPhotos({
   photos,
   maxConcurrency = DEFAULT_MAX_CONCURRENCY,
 }: {