GeoMobile Marketing website redesign
Developer handoff - September 21, 2026
What this delivery is
A designed, coded, responsive ten-page website prototype, plus a WordPress developer starter. It is ready for a programmer to implement and connect, not a deployed replacement for geomobilemktg.com. The current public websites have not been modified. The standalone preview is the review artifact; site/ is the front-end source of truth.
The visual direction retains the existing GeoMobile mark: graphite, brand red, white and warm light-neutral sections; large headlines; generous space; custom location illustrations; and a consistent demo/contact path. No third-party stock photography, external fonts, map services or tracking scripts are required by the design.
1. Pages and URL structure
| Page | Front-end file | WordPress route | Template |
|---|---|---|---|
| Platform / Home | index.html | / | page-templates/index.php |
| Solutions | solutions.html | /solutions/ | page-templates/solutions.php |
| GeoMobile Competitor | competitor.html | /solutions/competitor/ | page-templates/competitor.php |
| GeoMobile Home | home-audiences.html | /solutions/home/ | page-templates/home-audiences.php |
| GeoBlocker | geoblocker.html | /solutions/geoblocker/ | page-templates/geoblocker.php |
| Event GeoMobile | events.html | /solutions/events/ | page-templates/events.php |
| Technology | technology.html | /technology/ | page-templates/technology.php |
| Results | results.html | /results/ | page-templates/results.php |
| About | about.html | /about/ | page-templates/about.php |
| Contact / Demo | contact-page.html | /contact-page/ | page-templates/contact-page.php |
Preserve the existing Platform, Solutions, Technology, About and Contact paths. The four solution detail pages and Results are additions. Create child pages below Solutions for the nested paths. The Privacy Policy remains the existing legal page; its copy is not newly authored in this redesign. Assign the real WordPress privacy page and carry its current approved content forward.
All important navigation and calls to action are linked in the prototype. The page selector in the self-contained preview is for design review only, not the live site.
2. Implementation approach
The supplied geomobile-market folder is a classic WordPress starter theme with page templates, local assets, theme.json, default page partials and section-level Custom HTML block patterns. It is deliberately not a paid page-builder export and has no page-builder dependency.
Install only on staging first. It does not auto-create pages or overwrite existing content. Assign a GeoMobile - ... page template and leave the new page content empty to display its default designed page. Set the Platform page as the static homepage. Existing page content takes priority over the fallback design.
For immediate developer editing, update the named HTML/PHP sections and shared CSS. For block-editor editing, insert the corresponding GeoMobile page pattern: the pattern contains one Custom HTML block per section. This preserves visual fidelity, but it is not a set of custom native, field-editable blocks. Build those from the component/field map below when a nontechnical editor needs them. Raw SVG and Custom HTML editing require a suitably trusted account. A child theme or site plugin should hold live integrations.
The header navigation is currently developer-editable PHP with escaped, environment-relative links, not a registered WordPress menu location. Map it to a managed menu or Navigation block during CMS integration. The fallback templates, assets, markup, route map and visual behavior are already supplied.
Suggested editable components
| Component | CSS reference | Suggested WordPress treatment | Editable fields |
|---|---|---|---|
| Global header | site-header, main-nav | Header template part + managed navigation | GeoMobile mark, menu entries, CTA label/URL |
| Split hero | hero-grid, hero-copy | Group / Columns / Heading / Paragraph / Buttons | Eyebrow, heading, emphasis, introduction, CTA pair, diagram variant |
| Inner hero | inner-hero | Reusable Group / Columns pattern | Heading, introduction, side panel |
| Location illustration | market-visual | Trusted SVG/presentation component | Diagram variant and approved labels; not live geographic data |
| Solution grid | solution-grid | Four editable cards or a solution content type query | Name, summary, icon, route, sort order |
| Solution scope strip | scope-stats | Columns / Group pattern | Value, label, scope caveat |
| Feature list | feature-grid, check-list | Groups, headings, paragraphs, lists | Icon, title, copy, order |
| Four-step method | steps-list, tech-flow | Reusable group/repeater | Step number, title, description |
| Results | results-table, results-visual | Editable result repeater and semantic table | Region label, impressions, clicks, reach, visits, source, campaign date, window, spend |
| FAQ | faqs | Native Details blocks | Question, answer |
| Shared conversion band | cta-section | Reusable/synced pattern | Heading, description, button, phone/extension |
| Contact form | demo-form | Reviewed form plugin or secure backend | Field configuration, destination, validation, error/success copy |
| Footer | site-footer | Footer template part | Links, phone, extension, powered-by credit, privacy destination |
Keep shared content in one controlled place rather than maintaining separate copies after conversion to CMS fields. page-content.json contains the designed page copy/markup; research/products.json contains the product structure; route-map.json provides the implementation paths. The default source can also be adapted to a team's existing Elementor/Bricks workflow, but no proprietary builder import is included.
3. Design system
Colors
| Token | Hex | Use |
|---|---|---|
| --navy | #0C181F | Header, hero, dark sections, footer |
| --ink | #111F26 | Body headings, dark text/buttons |
| --red | #C72F29 | Primary CTA, light-background accents |
| --coral | #FF7269 | Emphasis and accents on dark surfaces |
| --pale | #F3F5F4 | Alternating sections |
| --muted | #54656C | Supporting copy on light surfaces |
| --light-muted | #B4C2C6 | Supporting copy on dark surfaces |
| --line | #DBE2E2 | Cards, input and section borders |
Typography uses the system stack Arial, Helvetica Neue, Helvetica, sans-serif; no font files are included. Default body copy is 18 px, product descriptions typically 17-20 px, section headings up to 49 px, and the home headline up to 78 px. Responsive rules reduce sizes without forcing content into fixed-height text boxes. Preserve heading hierarchy and do not make long text fit by shrinking it arbitrarily.
Desktop content max-width is 1240 px with responsive side gutters. Sections use 96 px vertical spacing on wide screens, stepping down to 74 and 58 px. Primary buttons are normally at least 54 px tall. Cards use an 18 px corner radius; buttons use 6 px. The diagram is decorative and labeled as an illustrative location plan, not a screenshot of a real campaign or dashboard.
Responsive rules
- Wide desktop: paired hero columns; four solution cards across; three feature columns.
- At 1000 px and below: hamburger navigation; solution cards two across.
- At 800 px and below: split sections stack; hero artwork follows copy; technology steps use a two-by-two grid.
- At 580 px and below: cards, forms and campaign scope stack into one column. Main CTAs expand to a comfortable full width. The results table stays horizontally scrollable inside its own labeled region, not across the whole page.
- Honor reduced-motion preferences. No autoplay video, hidden-on-load animation, cookie gate or map-library dependency is included.
4. Interactions already represented
Navigation and detail links are functional in the static files and standalone preview. The Solutions page has working category filters. FAQs use native disclosure controls. The mobile menu updates its expanded state and closes with Escape or a link click. A product CTA carries its selected interest into the contact page.
The contact form checks required fields in the prototype but never submits or stores them. Its button explicitly reports that it is a design preview. This behavior must be replaced, not disguised, when the live form is connected. No calendar time is booked by the prototype.
5. Contact and scheduling integration
Required fields: name, dealership, work email. Optional fields: phone, solution interest and campaign goal. Keep requests limited to dealership/business contact information; do not solicit customer lists or device-level data.
The theme provides the geomobile_market_contact_shortcode filter to insert a reviewed form plugin in the default contact template. If using the Custom HTML contact pattern instead, replace its preview form with the actual form block/shortcode. Supply the real email/CRM destination and approved direct scheduling URL if a booking widget is desired. A contact-page URL is not a booking-calendar URL.
Live implementation requirements: server-side validation and sanitization, appropriate CSRF protection, rate limiting/spam protection, authenticated mail delivery, minimal logging/retention, accessible error summaries and field associations, and an explicit success state only after accepted submission. Avoid recording free-text fields or personal contact details in analytics. Any optional marketing consent must be handled separately from merely requesting a response. Review these requirements with the site's privacy/compliance owners.
No recipient address, credentials, customer data, SMTP configuration, CRM connector or calendar account has been invented or embedded.
6. Content and claims approval
See CONTENT-AND-SOURCES.md and content-review.csv. The two public sources differ on impression quantities. This design uses the AutomotiveOnly page's up-to-50,000 core tactic quantities and flags the discrepancy; Event scope is left proposal-specific. The GeoBlocker creative does not promise guaranteed 90% blocking, complete coverage of every device, or capture without permissions.
The Results page reproduces six published regional examples without inventing client names, campaign dates, budgets or attribution methods. Reported CTR values were not displayed because some do not reconcile with the supplied click/impression counts. They remain in the source data for review. Do not replace them with an invented metric, or present an attributed visit as an incremental sale.
The $5,595 Q4 multi-product offer from the earlier deck is not applied to GeoMobile: a standalone GeoMobile price was not supplied for this website request.
7. SEO, analytics and performance handoff
seo-metadata.csv supplies draft titles, descriptions and route mapping. Use the chosen SEO implementation for canonical URLs, sitemap inclusion and organization data. Retain existing route equity; set explicit redirects only for approved URL changes. Do not publish the prototype's noindex setting on the final site. Keep staging noindexed until approvals are complete.
Suggested tracking events (not installed): cta_click with page/component/solution labels, phone_click, and generate_lead only after an accepted live submission. A click on a form button or telephone link is not itself a confirmed lead. Configure permitted tags and consent behavior using the site's actual requirements; no advertising tags or external scripts run in this delivery.
Maintain local optimized assets, explicit image dimensions and inline SVG. Prefer no external font dependency. Suggested acceptance budgets, to be validated on the actual host: avoid render-blocking third-party scripts; keep template JS dependency-free where practical; optimize images; and measure Core Web Vitals after integrations. These are development targets, not measured production performance claims.
8. QA and launch gates
Automated visual/structural checks were run in local Chromium at 320, 375, 390, 768, 1024 and 1440 px across all ten pages. Checks cover one H1 per page, loaded images, no whole-page horizontal overflow, script errors and local link resolution. Six interaction paths cover preview navigation, solution filtering, selected-interest handoff, safe preview-form feedback, FAQ expansion and mobile-menu keyboard dismissal. PHP files were syntax-checked. See qa-report.json and php-lint.txt.
The WordPress theme has not been executed inside a WordPress database/runtime. Real Safari/Firefox/device testing, assistive-technology testing, production performance, analytics, consent configuration, CRM/email delivery and security testing remain staging tasks.
Before launch: obtain final content/package approval; wire the form and booking path; review privacy/consent setup; verify every phone/link; set CMS pages, metadata and redirects; run browser/accessibility checks; verify backups and rollback; test mail/CRM delivery; then deploy through the site's existing release process. Nothing in this package changes the current live site automatically.
9. Implementation references
- WordPress template files: https://developer.wordpress.org/themes/classic-themes/basics/template-files/
- Patterns: https://developer.wordpress.org/themes/patterns/registering-patterns/
- Global settings/styles: https://developer.wordpress.org/block-editor/how-to-guides/themes/global-settings-and-styles/
- Template parts: https://developer.wordpress.org/themes/templates/template-parts/
These references were reviewed while preparing the starter. Use the project host's supported WordPress/PHP versions and staging policy when integrating.