Same-day service in most Tampa Bay areas (sample).

Call (813) 555-0147

Same-day service in most Tampa Bay areas (sample).

Call (813) 555-0147

For template buyers

Template Guide

Everything you need to make this template yours: colors, fonts, the CMS, forms, embeds, images and the placeholders to replace before launch.

For template buyers

Template Guide

Everything you need to make this template yours: colors, fonts, the CMS, forms, embeds, images and the placeholders to replace before launch.

For template buyers

Template Guide

Everything you need to make this template yours: colors, fonts, the CMS, forms, embeds, images and the placeholders to replace before launch.

Quick start

1. Change the business name, phone and email in the Logo, Navigation, Footer, Mobile Action Bar and Same-Day Banner components (Assets → Components), then search the project for “(813) 555-0147” and “shieldlinepest.example”.

2. Replace the sample content in the CMS: Services, Pests, Service Areas, Plans, Reviews and Posts.

3. Replace the placeholder photos (see Image specs) and every block marked “Placeholder” or “(sample)”.

4. Connect the Quote and Contact form destinations.

5. Update SEO titles, descriptions, the social image and favicon.

6. Delete this page when you’re done, or keep it: it’s set to noindex, so search engines skip it.

Colors and fonts

All colors are color styles (Assets → Styles). Change Brand/Primary (teal #0B7A6F) and Accent (coral #FF7A66) and every button, chip, icon and card updates. Keep white text on Brand/Primary and dark text on Accent so contrast stays AA-readable.

Main styles: Brand/Primary, Brand/Primary Hover, Brand/Primary Soft, Brand/Secondary, Accent, Surface/Base, Surface/Mist, Surface/Inverse, Text/Primary, Text/Secondary, Border, State/Success, State/Warning and State/Critical.

Fonts: headings use Nunito (Display, H1–H4, Label) and body text uses Figtree. Change a font once in its text style and it updates everywhere. Each style has desktop, tablet and phone sizes.

Spacing follows a 4 / 8 / 12 / 16 / 24 / 32 / 48 / 64 / 96 / 128 px scale. Corners use 6, 14, 18, 24 and 28 px plus pill shapes. Sections use 112 px of padding on desktop, 88 px on tablet and 64 px on phone.

Layout, banner and navigation

Every page uses the “Main” layout template: the same-day banner, sticky navigation, footer and the phone-only action bar (Call • Free quote).

Same-day banner: open the Main template and switch “Show same-day banner” off to hide it on every page. Edit its message and link in the Banner / Same-Day component.

Footer: replace “FL Pest Control Business License #JB000000 (placeholder)” with your real license and insurance details.

In the editor, page canvases have a fixed height because they use a layout template. The live page grows with its content.

Editing the CMS

Services: name, segment (Residential or Commercial), summary, icon, image, process, what’s included, guarantee text, starting price note, Featured (shown on Home), related pests and reviews.

Pests: name, type (powers the Pest Library filter), icon (SVG image), season, summary and four rich-text sections: signs, risks, prevention tips and how we treat.

Service Areas: city, county, a unique intro (write real local copy for each city), local phone and Phone link (tel:+1…), response time, ZIP codes, Search keywords (city, county and ZIPs, used by the finder on /service-areas), common local pests, nearby areas and reviews.

Plans: name, price, unit, frequency, best for, covered pests, Highlighted (one plan only), badge text and sort order. Update the comparison table on /plans to match.

Reviews: quote, name, rating (1–5), source label, city and service. Publish only real reviews you have permission to use.

Posts: title, category (powers the blog filter), cover, excerpt, body, date and read time.

References don’t sync both ways. When you link a pest to a service, also link the service on that pest. The same goes for areas and pests, nearby areas, and reviews.

Lists inside rich text use “✓ ” paragraphs so they keep the brand font. Detail-page SEO titles use field tokens such as {{Name}} and {{City}}.

Every list uses pagination. In the editor, choose Load more or infinite scroll for each one.

Forms

Get a Free Quote (/quote) uses the Form / Quote component: four step variants (pest, property, location, contact) inside one form. Inactive steps are collapsed, not removed, so every answer submits together. Edit options freely, but don’t delete a step’s fields.

Contact (/contact) uses the Form / Contact component.

Choose where submissions go: select the form (the Step 1 root of Form / Quote, or the Form / Contact root) and add an email, webhook or Google Sheets destination in the form settings. Then send a test from your phone.

The City dropdowns in both forms are static. Edit them when your service areas change.

The consent text is a placeholder. Replace it with wording approved for your business.

Booking, reviews and other embeds

Scheduling (/quote): in “Scheduling Embed Slot”, turn on the hidden “Scheduling Embed (turn on, paste code)” layer, paste your Calendly, Cal.com or field-service booking code, then delete the placeholder group.

Review widget (/reviews): drop an Embed component into the dashed slot and paste your review platform’s code.

Financing or online payments: if you offer them, add an Embed component to /plans or /quote with your provider’s code, and show any terms your provider requires.

Maps: add Framer’s Google Maps component to a city page or /contact if you want one. Maps aren’t included by default to keep pages fast.

Image specs

Slot

Ratio

Minimum size

Home hero

4:5

1200 × 1500

Service image (CMS)

4:3

1200 × 900

City photo (CMS)

3:2

1800 × 1200

Post cover (CMS)

16:9

1600 × 900

Commercial photo

3:2

1800 × 1200

About story photo

3:2

1800 × 1200

Team portrait

4:5

960 × 1200

Guarantee band photo

4:3

1200 × 900

Social share image

1.91:1

1200 × 630

Favicon

1:1

512 × 512

Export JPG or WebP files under about 400 KB. Add alt text to every image: in the CMS for collection images, and in the image settings for page images. The pest icons are original SVGs; to recolor them, edit the files and upload them again.

Placeholders to replace

• Guarantee wording: Home guarantee band, service pages and Terms.

• License and insurance details: footer and the About credentials card.

• Consent text in both forms.

• Sample prices: plan cards, the comparison table and service price notes.

• Sample reviews, ratings and stats: Home and Reviews.

• Privacy Policy and Terms of Service.

• The commercial compliance note and team names and photos.

• Phone numbers, response times and ZIP codes in Service Areas.

None of the sample text is legal advice.

SEO and launch checklist

Every page has its own title and meta description (Page settings). CMS templates build theirs from fields.

Set your domain, social image and favicon in Site Settings.

This guide and the 404 page are noindex.

Filters create shareable links such as /pests?type=… and /service-areas?county=….

Before publishing, preview at 1440, 1200, 810 and 390 px: the menu, filters, quote steps and hover states.

Create a free website with Framer, the website builder loved by startups, designers and agencies.