Check out our Next.js example repository on GitHub, which includes implementations for both App Router and Page Router.
- App Router
- Page Router
Step 1: Embed Surface Tag
Add Surface Tag to your Next.js site with custom code components
Step 2: Surface Component
Create a Surface Component
Step 3: Inline
Embed Surface Forms directly in your Next.js applications
Step 3: Email Input Field Trigger
Trigger Popup and Slideover via email input field submission
Step 3: Popup
Display forms in modal overlays triggered by user interactions
Step 3: Slideover
Show forms that slide in from the side of the screen
Step 4: Optimize
Optimize form loading speed and user experience