Instructions
Make Callwell yours.
Everything you need to set the template up, in the order you will need it.
Quick answers
Can’t find something? Start here.
Where is my remix link?
In your order email and on your order page. Open it, sign in to Framer and click Copy.
Do I need a paid Framer plan?
No. A free Framer account can copy, edit and publish the template on a framer.app address. A custom domain needs a paid Framer site plan.
It opens, but I can’t edit?
Sign in to Framer first, then click Copy. You edit your own copy, not the original.
The theme toggle does nothing?
It works only in Preview and on the published site, not on the editor canvas.
My form sends nothing?
Forms send nowhere until you add a destination in each form’s settings.
Who do I contact?
Email support at nibforge@gmail.com, replies within 2 business days.
01
Start here
Open the remix link from your order, sign in or sign up to Framer, and click Copy. The project lands in your Framer workspace.
02
Light and dark
Callwell starts in dark mode and includes a full light version. The sun/moon button in the navbar switches between them and remembers the visitor’s choice.
The button only works in Preview and on the published site, not on the editor canvas. To check light styles on the canvas, use Framer’s own light/dark canvas switch.
To start in light mode, open the Nav component, select the Theme toggle and set Default to Light.
03
Your details
Replace the sample phone number (555) 010-2040 and its tel: link in the Nav, the Footer, the Mobile call bar in the Main layout, and the call buttons on each page. Then replace the licence number, address and hours.
04
CMS content
Services, Team, Reviews and Guides are CMS collections (Guides holds the blog posts). Services and Guides each have their own detail pages (/services/… and /blog/…) with SEO title and description fields per item.
05
Prices and figures
Every price, response time, rating, review, person and licence number is a sample and labelled that way. Replace them with your own before publishing, and remove the word “sample” as you go.
06
Forms
Seven forms need a destination: the quick-estimate form on Home, the booking form on Emergency, the invoice form on Pay invoice, the Contact form, and the forms on Commercial, Careers and Leave a review. Select each form and add an email or webhook destination in the editor.
07
Fonts and styles
Archivo and Martian Mono (Google Fonts). Colour styles each have a light and dark value; text styles are named Callwell/… in Assets.
08
SEO
Each page has its own title and description in Page settings. The site title, description and social image are in Site settings.
09
Photo and video uploads
Framer forms have no file field, so the quick-estimate form uses the Estimate upload component. Create a free Cloudinary account, add an unsigned upload preset (Settings → Upload), then paste the Cloud name and Preset name into the component. Each file’s link then arrives in the form submission as “media_links”.
Until you do, files are previewed on the visitor’s device but not sent. Visitors can also paste a link to a photo or video.
10
Payments, invoices and plans
Callwell does not take payments, create invoices or run subscriptions. It links to your own tools: Stripe, Square, Jobber, Housecall Pro or similar.
Pay invoice (/pay): set the form to redirect to your payment link, or replace the button with a link. Plans (/plans): paste a payment or subscription link into each Join button. Starting-at prices: edit them on Pricing and Home; “Book at this price” opens the booking form.
11
Line art
The illustrations are the Line art code component: pick the drawing in Art, and set Stroke, Highlight and Draw in. Base lines use the Accent colour, the highlight uses Signal. With reduced motion on, they show fully drawn.
12
Photo slots
Recent jobs (page and Home section) uses dashed photo slots. Select a slot, set Fill → Image and add your own before and after photos, then delete the line drawing inside. Use only photos you took or have the rights to.
13
Estimate wording and arrival fee
Every starting-at price carries the line “Estimate only. The price may change after the technician arrives and assesses the job. Some companies charge a technician arrival (trip/dispatch) fee.” Edit it to match your policy.
Pricing has an optional Arrival fee block with sample wording: set your amount or delete it. The Terms page has a matching placeholder section.
14
Extra pages
Recent jobs, Offers, Financing, Commercial, Careers, FAQ, Leave a review, Terms and Thank you are ready to edit or delete. Financing and Terms are placeholders: use your lender’s and lawyer’s wording. The forms on Commercial, Careers and Leave a review are three of the seven in step 06 and each need a destination.
Thank you (/thank-you) can be the redirect after any form: select the form and set its success action to this page.
15
Support
Email support at nibforge@gmail.com, replies within 2 business days.