Advocate is a nonprofit PR agency landing page template built on an overlap and layered layout. It uses a darkroom-inspired Monochrome Steel palette, floating documentary photography, and a Gallery Walk scroll experience to show outcomes before asking for anything. The lead generation flow guides visitors through three proof-filled rooms and ends with a focused contact form.
by Rocket studio
Advocate is a single-page template for nonprofit PR agencies that need to earn trust fast. The layout layers documentary images, impact metrics, and editorial typography into a darkroom-inspired scroll. Visitors move through three distinct gallery rooms, each adding another layer of proof, before reaching a lead generation form that feels like a natural next step.
This template is built for communications professionals who serve nonprofits and social-sector organizations. It speaks directly to the work of turning a mission into a media story.
Most agency landing pages lead with credentials and bury the proof. Nonprofit clients visit with skepticism and a tight budget, so they need to see results before they trust anyone. This template fixes that by front-loading outcomes and letting the design itself communicate editorial authority.
The template delivers a fully structured, single-page layout with distinct visual sections, a branded contact modal, and a secondary lead capture path. Every component is intentional and directly tied to the brief.




Theme
Lens & Frame
Creative direction
Gallery Walk
Color system
Monochrome Steel
Style
Overlap/Layered
Direction
Lead Generation
Page Sections
Floating Documentary Photo Header
Three-room Gallery Walk Scroll
Persistent Amber Call to Action Pill
On-brand Overlapping Contact Modal
Gated Case Study Download Path
Translucent Impact Metric Cards
Who is this landing page template designed for?
Can I customize the gallery room content and impact metrics?
What does the contact modal form collect from visitors?
How does the secondary case study download path work?
Is the amber accent color used throughout the whole page?
A paragraph introduction to the features: every capability listed below comes directly from the template brief and reflects what the layout is built to do.
Eight to ten black-and-white documentary images sit at varying scales and slight rotations, layered over one another. As the visitor scrolls, soft parallax depth makes the images drift gently, as though pinned to an invisible wall. The headline threads between the images like a gallery wall label.
The page is divided into three scroll rooms. Each room lets content planes slide over and under each other as new material surfaces. Room one expands a campaign image to full bleed with floating metric cards. Room two brings a rotated quote from a nonprofit executive director over the receding image. Room three presents a before-and-after media landscape with coverage logos stacking on the right.
The primary call-to-action, labeled "Tell Us Your Story," appears first as an amber pill in the top navigation. It reappears as a full-width section after the third gallery room. The amber accent migrates down the page like a guide light, always marking the next interactive moment.
Clicking the primary call-to-action opens an on-brand modal form. The form presents three fields in sequence: organization name, a dropdown for engagement type, and a short text area labeled "What does the world need to know?" The modal stays within the Monochrome Steel visual identity throughout.
A secondary conversion path offers a downloadable case study PDF gated behind a single email field. This path is designed to capture visitors who want more proof before committing to a conversation. It widens the top of the lead funnel without distracting from the primary call to action.
Impact figures such as media impressions, op-eds placed, and legislative outcomes float above full-bleed imagery on translucent steel cards. The cards keep data readable without obscuring the photography underneath, reinforcing the editorial tone of the entire page.
| Section | Purpose |
|---|---|
| Floating Photo Header | Establishes editorial identity and hooks attention with layered documentary images |
| Top Navigation Bar | Houses the persistent amber "Tell Us Your Story" pill call to action |
| Gallery Room One | Expands a campaign image to full bleed and surfaces key impact metrics |
| Gallery Room Two | Overlays a rotated nonprofit ED quote over the receding campaign image |
| Gallery Room Three | Shows the before-and-after media landscape with stacking coverage logos |
| Full-Width call to action Section | Delivers the primary lead generation prompt after three rooms of proof |
| Contact Modal Form | Captures organization name, engagement type, and mission brief in sequence |
| Case Study Download Gate | Secondary email capture for visitors not yet ready to start a conversation |
The visual identity follows a Lens and Frame theme built on a Monochrome Steel color system. The palette references a photojournalist's proof sheet on a steel light table: cool, editorial, and stripped of decoration.
The overlap and layered layout is designed to translate the Gallery Walk experience across screen sizes without losing its editorial depth. Key visual moments are preserved on smaller viewports.
The page earns the click by showing outcomes before asking for anything. By the time the call to action appears, the visitor has already walked through three walls of undeniable results.
This template is categorized under Portfolio and Agency, with a specific focus on Nonprofit Marketing and Agency work. It is well suited to any nonprofit PR agency that wants its landing page to feel like a curated editorial exhibition rather than a standard services page.