Mortar is a gallery-and-detail landing page built for brick and block masons who win work through proof, not promises. A full-screen video hero and a plain-spoken lifetime structural guarantee open the scroll. Expandable project cards show before-and-after documentation, embedded testimonials, and material notes. A sticky booking form drives estimate requests from the first project detail onward.
by Rocket studio
Loading preview…
Quick summary
Mortar is a single-page template designed for masonry contractors who lead with earned trust. The page opens on a cinematic video of hands laying brick, anchors the scroll in a lifetime structural guarantee, then walks visitors through a project gallery that proves every claim. A sticky booking bar converts interest into scheduled estimates without friction.
Who this template is for
This template is built for masonry professionals who need a serious, craft-first web presence that also drives real inquiry volume. It fits businesses whose work speaks louder than ad copy.
Brick and block masons offering chimney repair, tuckpointing, retaining walls, and new construction
General contractors who need a reliable masonry subcontractor with a portfolio to back it up
Property managers and homeowners comparing local masonry services and vetting crews on quality
What problem this template solves
Masonry work is high-stakes and expensive. Visitors land on a page already nervous about cost, damage scope, and whether the crew will still be around if something goes wrong. Generic templates do nothing to address that anxiety.
There is no single section to build trust before the gallery loads, so visitors bounce before they see the work
Project galleries without context leave visitors guessing about materials, conditions, and timelines
Booking flows buried at the bottom of the page lose the visitor who is ready to act mid-scroll
What you get with this template
You get a fully designed, single-page layout that guides visitors from first impression through to booked estimate. Every section earns the next one.
A full-screen video hero with a floating guarantee badge and a bold headline that sets the tone immediately
An expandable project card gallery showing before condition, process shots, finished results, and embedded client testimonials
A sticky bottom booking bar with a multi-field form covering project type, address, preferred week, and photo upload
Theme
Industrial Raw
Creative direction
Guarantee-Led
Color system
Forest Trust
Style
Gallery + Detail
Direction
Booking/Scheduling
Page Sections
Full-screen Video Hero with Guarantee Badge
Guarantee-led Page Architecture
Expandable Before-and-after Project Cards
Sticky Booking Bar with Photo Upload
Services and Site Visit Process Section
FAQ Accordion
Related questions
Can I use this template without a video for the hero section?
How do the expandable project cards handle before-and-after content?
When does the sticky booking bar appear during the scroll?
What fields does the booking form include?
Is this template suitable for a masonry subcontractor working with general contractors?
Feature list
This template ships with a specific set of design and interactive components drawn directly from the project brief.
Full-Screen Video Hero
The header opens on a continuous video shot of a mason buttering and tapping brick into a running bond pattern. The camera pulls back slowly to reveal the wall rising against a gray sky. A bold headline fades in over the footage, and a floating glass badge anchors the guarantee above the fold.
Guarantee-Led Scroll Architecture
Immediately below the hero, a plain-spoken lifetime structural guarantee section anchors the page before the portfolio begins. Trust is established first. The gallery that follows is positioned as evidence for the guarantee, not decoration.
Expandable Project Card Gallery
Projects are displayed in a rotated card grid. Each card expands into a full detail view showing the before condition, crew process shots, the finished result, a short note on materials used, and the specific problem solved. Client testimonials live inside each project detail, not in a separate section.
Sticky Booking Bar with Smart Form
A sticky bottom bar appears after the visitor reaches the first expanded project detail. It carries the primary call to action: "Schedule Your Estimate." The embedded form collects project type, address, preferred week for the site visit, and a photo upload labeled "Show us what you're working with."
Services and Process Section
A dedicated section outlines the masonry services offered alongside a plain explanation of how the site visit and build process works. This gives first-time buyers a clear map of what happens after they submit the form.
FAQ Accordion
A collapsible FAQ section addresses common masonry questions without burying the visitor in text. Each answer stays concise and practical, reducing the back-and-forth that delays a booking decision.
Page sections overview
Section
Purpose
Video Hero
Opens on craft footage with headline and guarantee badge
Guarantee Banner
Establishes lifetime structural trust before the portfolio
Project Gallery
Expandable before-and-after cards with embedded testimonials
Services and Process
Outlines scope of work and the site visit workflow
FAQ Accordion
Answers common masonry questions in collapsible format
Booking Form
Collects project type, address, timing, and photo upload
Sticky call to action Bar
Persistent estimate prompt that appears mid-scroll
Footer
Horizontal flow footer with contact and navigation links
Design & branding system
The visual identity follows an Industrial Raw theme built on the Forest Trust color system. The palette feels like a stone retaining wall at the edge of a pine tree line. Materials age into the landscape rather than against it.
Colors: deep evergreen (#1B3A2D) and kiln-fired cream (#E8DCC8) alternate as section backgrounds; wet mortar gray (#6B6E70) handles body text on light sections; lichen accent (#7A9E7E) colors every button, hover state, and interactive element
Typography: Fraunces serif display handles headlines for weight and permanence; DM Sans handles body copy for clean legibility at any size
Animation and interactivity: GSAP ScrollTrigger drives scroll-based reveals; the video header uses a Ken Burns motion effect; project cards animate on expand; the sticky bar slides in on a GPU-accelerated transform
Mobile & speed optimization
The template is built mobile-first because homeowners commonly search for masonry help on a phone after spotting damage. Every interactive element is designed to work cleanly on a small screen.
The video header includes a poster image fallback for devices that do not autoplay video, keeping the above-the-fold experience intact
Project gallery images use lazy loading so the page does not front-load all visual assets before the visitor scrolls
The sticky booking bar is touch-friendly and remains accessible without covering critical content on smaller screens
How this template helps you convert
The conversion path is deliberate. Every section is ordered to lower resistance before asking for action.
The guarantee section appears before the gallery, so visitors understand the promise before they evaluate the portfolio. By the time they see finished projects, they are reading evidence rather than marketing.
Testimonials live inside project detail cards, not in a separate testimonials section. Social proof appears exactly where the visitor is already engaged with specific work.
The sticky booking bar with a phone number fallback ("Rather just call? We pick up") captures both form-preference and call-preference visitors without forcing either path.
Other information about this template
This template is a strong fit for masonry businesses that compete on quality and reputation in local markets. It is built for a single-page layout, so all content lives in one scrollable flow without separate pages to maintain.
The footer uses a horizontal flow pattern suited for contact details, service area notes, and navigation links
Project detail cards support before-and-after photography, process imagery, material callouts, and client quotes in one expandable view
The booking form includes a photo upload field, which is practical for masonry inquiries where visible damage or site conditions help the contractor prepare for the estimate visit
The template is localized for English-language, United States audiences using USD pricing references and US date formatting
