diff --git a/wp-content/themes/moonshine/app/components/ui/UiLoadMore.vue b/wp-content/themes/moonshine/app/components/ui/UiLoadMore.vue
new file mode 100644
index 0000000..419c754
--- /dev/null
+++ b/wp-content/themes/moonshine/app/components/ui/UiLoadMore.vue
@@ -0,0 +1,10 @@
+<script setup lang="ts">
+defineProps<{ hasNextPage: boolean; isLoadingMore: boolean }>();
+defineEmits<{ loadMore: [] }>();
+</script>
+
+<template>
+  <div v-if="hasNextPage" class="flex justify-center">
+    <UButton @click="$emit('loadMore')" :loading="isLoadingMore"> En voir plus </UButton>
+  </div>
+</template>
diff --git a/wp-content/themes/moonshine/app/graphql/PageInfo.fragment.gql b/wp-content/themes/moonshine/app/graphql/PageInfo.fragment.gql
new file mode 100644
index 0000000..89396d3
--- /dev/null
+++ b/wp-content/themes/moonshine/app/graphql/PageInfo.fragment.gql
@@ -0,0 +1,4 @@
+fragment PageInfo on WPPageInfo {
+  hasNextPage
+  endCursor
+}