refariUserSession, RefariLoggedIn (Refari, 1 year): Keeps you signed in when you sign in to a Refari feature.
refari_jb_registered (Refari, Until you close the tab): Remembers that you have just registered (browser storage).
_grecaptcha (Google reCAPTCHA, Until you clear it): Keeps automated spam out of the forms; set only once you start using a form (browser storage).
_GRECAPTCHA (Google reCAPTCHA, 6 months): Google’s own cookie for the same check, on google.com; set only once you use a form.
Facebook and LinkedIn sign-in (Meta, LinkedIn, Set by them): Only if you choose “Continue with Facebook” or LinkedIn: their own cookies for signing you in.
Analytics
_ga (Google, 2 years): Tells visits apart to count visitors.
_ga_* (Google, 2 years): Keeps the state of a visit.
Set by the code (Ahrefs Web Analytics, Varies): Code this site added; it may set its own cookies.
Refari visit counts (Refari, No cookies): Counts page visits for us without cookies. Your browser sends the page, the site you came from and your device type. Your IP address is not kept, and we see totals only. A local setting, rf-nocount, is stored only if you ask us not to count your visits.
Designed your website in Framer? Place your Refari job board, job alerts and referral forms inside the page design with a code component, publish, and every application made on your site goes into your ATS.
Three Ways to Add Code in Framer, and Which to Use
Framer is a visual website builder: you design on a canvas, Framer AI can lay out pages and write components, and the site is published to Framer’s own hosting. You never edit a code repository, so third-party code goes in through one of three doors.
A Refari widget is an empty container plus the Refari scripts, in their original order. It has to run in the page itself, because its forms, job links and filters all read the page’s own web address. Two of Framer’s doors keep it there; the Embed element does not, because it runs your code inside a frame.
Code component: for the job board, job alerts, referral and registration forms and testimonials, placed in your layout like any other layer
Custom Code: for a floating widget such as the TopRec bar, which needs no spot in the layout
Your jobs stay in your ATS and Refari, never in the Framer project
Add the Job Board With a Code Component
Framer describes a code component as a file that exports a single React component, compatible with React 18, which renders on the canvas, in preview and on the published site. That is what lets the Refari container sit in your page as a real element.
1
Copy the Code From Refari
Open Widgets in your Refari dashboard, pick the job board, choose its colours and layout, then click COPY ALL. Only a Refari Admin or Manager sees Widgets.
2
Build the Code Component
Ask Framer AI for a code component with the prompt below, or create it under Assets > Code > Create Code File from the same brief. Name it after the widget, for example RefariJobBoard.
3
Drop It Onto the Careers Page
Drag the component from Assets onto your careers page. Let it fill the width of its stack and do not give it a fixed height: the board grows with your jobs.
4
Publish, Then Test the Live Page
Click Publish and open the careers page on its published address. Apply for a job there: if the reCAPTCHA box loads cleanly, the code is in the page. Then open a job, copy the address into a new tab, and check the same job opens.
5
Point Your Base URL at It
In Refari, under Settings > Job Board Settings, set the Base URL to the Framer careers page, so job links in alerts and emails open there. Click a job link in a Refari job alert email to confirm it opens that job.
Example prompt for Framer AI
Create a code component called RefariJobBoard for our Careers page from the Refari embed code below.
[paste the COPY ALL code from Refari here]
- Render the container div exactly as it is in the code, keeping its id, full width with no fixed height.
- Keep the Refari scripts in their original order. In a useEffect, add the Refari loader script only if it is not already on the page, so it never loads twice.
- Run the configuration script only after the loader has loaded (straight away if it already has), every time the careers page mounts.
- No raw script tags in the JSX, and no window or document outside that useEffect.
- Never put any part of the code in an iframe or Framer’s Embed element.
- Leave the page address alone, including its query string and the part after #.
Framer AI runs on the AI credits in your plan. Before you publish, check that the component keeps the container div and its id exactly as you pasted them.
Floating Widgets Go in Custom Code
A floating widget such as the TopRec bar has no place in your layout, so it does not need a component. Framer’s Custom Code setting adds a script to every page, or to the pages you choose.
1
Open Custom Code
Go to Project Settings and open the Custom Code tab. Framer’s Academy calls this Site Settings; it is the same place.
2
Add a Script
Click Add Script, give it a name you will recognise, paste the widget’s COPY ALL code with the Refari scripts in their original order, and choose End of body as its placement.
3
Choose Where and How Often
Limit it to chosen pages if you like. If the bar is missing after you move from page to page, set it to Run on every page visit and test again.
4
Publish to See It
Custom Code never runs on the canvas or in the editor preview, so publish and look at the live site.
Six Framer Traps to Avoid Before Launch
When a Refari widget misbehaves on a Framer site, the cause is nearly always where the code was put. Check these in order.
Pasting Into the Embed Element
Framer’s own help suggests the Embed element for scripts, and it runs the code inside a frame. Forms then show “Invalid domain”, and job links and filters stop working.
Delete the Embed and place the widget with a code component.
Splitting the Code in Two
Framer’s Trustpilot guide splits a widget between Custom Code and an Embed. Do not split Refari’s code that way.
Keep the container and the Refari scripts together in one code component.
Browser Code During Rendering
Framer pre-renders pages, and its troubleshooting guide says a component that touches window or document while rendering is hidden and retried on load.
Load the scripts inside useEffect(), never in the component body.
Judging It on the Canvas
Custom Code does not run on the canvas or in preview, and reCAPTCHA and job links need a real published address to prove themselves.
Publish, then test the live URL in a private window.
A Careers Page Hidden From Search
Every Framer page has a Search engines toggle in its settings. Switched off, it adds a noindex tag to that page.
Check the toggle is on for your careers page before launch.
A Security Policy That Blocks the Board
Framer does not say it sets a Content Security Policy by default, but you can add one through Custom Headers on Advanced Hosting or a meta tag at the start of the head.
If you add one, allow widget.refari.co, api.refari.co and Google reCAPTCHA, then test a registration form on the published site.
Five ATSs, One Framer Component
The code component is the same whichever ATS feeds Refari. What changes is what moves between that ATS and Refari, and what to check before your Framer page goes live.
JobAdder
What flows
Refari’s own two-way integration: webhooks put new ads on your Framer board and take expired ones off straight away, and edits follow within a few hours. Applications and registrations go into JobAdder, each referral arrives as a candidate record for the referred person, referrals logged in JobAdder come into Refari, and stages come back.
Watch for on Framer
Republishing in Framer never brings back a missing ad: check it was posted to the Refari job board in JobAdder. Screener answers reach JobAdder fields only once mapped under Tools > Question Mapping in Refari, and marketing consent needs a custom JobAdder field.
Through the Refari Integrator, Loxo sends new, changed and closed jobs by webhook, usually within minutes. Applications, registrations and referrals go into Loxo with Refari sources, and Refari reads your Loxo workflow stages; screener answers are not written to Loxo.
Watch for on Framer
Loxo’s own careers page keeps running after you connect Refari, so link your Framer navigation to one list of jobs, not both. A job shows only while it is Published and Active in Loxo.
Refari picks up public Atlas projects by polling about every 10 minutes, with a fuller reconcile every few hours. Applications, registrations and referrals go back to Atlas, and candidate stages come back for referral tracking and TopRec review requests on placement.
Watch for on Framer
Allow 10 to 12 minutes after saving a project before you look at the Framer page, and do not republish to hurry it. A missing project usually needs Public Job Advert or a Job Board Category set in Atlas.
Seven20 built this integration on Refari’s API for its Salesforce-based recruitment CRM. Jobs come in, applications and registrations go to Seven20, referrals stay in Refari, and candidate stages are not sent back.
Watch for on Framer
Refer a Friend on your Framer page still works, but each referral lands in your Refari dashboard rather than Seven20, so follow referrers up there.
RecruitWizard built this integration with Refari. Jobs come in, applications, registrations and referrals go out to RecruitWizard, and candidate stages are not sent back.
Watch for on Framer
Test all three forms on the published Framer page, not the canvas: send an application, a registration and a referral, then find each one in RecruitWizard.
Join the Success: 400+ Companies Thriving with Refari!
Framer Plans, Domains and Your Base URL
Framer’s plans are Free, Basic (from $10 a month billed yearly), Pro (from $30) and Enterprise. Free publishes on a Framer address and Framer calls it ideal for non-commercial use; connecting your own domain needs Basic or above. Framer’s help does not say whether Custom Code is limited by plan, so check in your project before you rely on it for a floating widget.
To use your own domain, open Site Settings > Hosting > Domains. For an apex domain Framer asks for two A records and a www CNAME to sites.framer.app; a subdomain such as careers.yourfirm.com needs only the CNAME.
Refari widgets are not tied to one domain, so the same code works on your Framer address and on your own domain
Once the domain is live, update the Base URL in Refari so alert links open on it
Framer AI uses AI credits: 1,000 a month on Basic and 3,000 on Pro, with a trial allowance on Free
Framer and Refari Questions Answered
What agencies and in-house recruiters ask before they add a Refari job board to a website designed in Framer.
Does Refari work on websites built with Framer?
Yes. Placed with a code component, a Refari widget runs in the page itself on your published Framer site, so it shows your live jobs, opens each role and takes applications.
Can I paste the Refari code into Framer’s Embed element?
No. The Embed element runs code inside a frame, so registration and application forms show “Invalid domain” and job links and filters fail. Use a code component for anything in your layout.
Where do I create a code component in Framer?
In the Assets panel. Open Code, choose Create Code File, write or paste the component, then drag it onto your page like any other layer. Framer AI can also write it from a prompt.
Can Framer AI build our careers page and the job board?
Yes, with a check. Framer AI builds editable layouts and can write a code component, but confirm that the component keeps Refari’s container div and its id as pasted and loads the Refari loader, not an Embed.
Why can’t I see the job board on the Framer canvas?
Test the published page instead. Custom Code never runs on the canvas or in preview, and reCAPTCHA and job links only prove themselves on the published address.
Which Framer plan do I need for a Refari job board?
Framer lists no plan limit for code components; your own domain needs a paid plan, Basic from $10 a month billed yearly or Pro from $30. Framer does not document a plan limit on Custom Code either, so check in your project if you use it.
Do Refari job links open the right job on a Framer page?
They should, as long as the component leaves the address alone, but test it on your published site because Framer does not document how its pages treat query strings. Open a job, copy the address into a new tab, then click a job link in a Refari job alert email: both should open that job.
Will the board still load after a visitor moves between pages?
It should, if the component is built for it. Framer does not document how components remount, so load the Refari loader once, run the configuration each time the component mounts, and test by arriving at the careers page from your home page.
How do I add the TopRec bar to every page of a Framer site?
With Custom Code. In Project Settings, add a script with the bar’s code, place it at the end of the body, leave it on all pages and publish.
Can I put two Refari widgets on one Framer page?
Yes. Give each widget its own code component, and have each one add the Refari loader only if it is not already on the page, so the loader loads once and each widget runs its own configuration.
Will my jobs appear in Google for Jobs from my Framer site?
No, not from the widget. Google for Jobs reads a separate page for every job, while a job board widget shows its jobs inside one careers page. Google for Jobs comes with a website Refari builds.
Google for Jobs Reads Job Pages. Refari Websites 2.0 Makes Them
Framer gives a design team close control of every page, and a code component gives that site a working Refari job board. What no widget can make is a separate, crawlable page for each job carrying the job posting markup Google for Jobs reads. Refari Websites 2.0 is built that way from the start, and Refari runs the site for you, so it is the option to choose when Google for Jobs matters.
What you getRefari widgets on your Framer siteRefari Websites 2.0
Live job board from your ATSRefari widgets on your Framer site: Yes, with search, filters, job alerts and referralsRefari Websites 2.0: Yes, built into the site
Applications into your ATSRefari widgets on your Framer site: Yes, through the Refari forms in the widgetRefari Websites 2.0: Yes, the same forms
Google for JobsRefari widgets on your Framer site: Not from the widget: jobs open inside your careers page, with no page of their own for Google to readRefari Websites 2.0: Included: every job has its own page with the job posting markup Google for Jobs reads
Who builds and looks after itRefari widgets on your Framer site: You, in your builder, on your planRefari Websites 2.0: Refari builds and hosts it, and you ask for changes in plain English
Great platform and service - they really go above and beyond for their clients! Refari's support is unmatched by any other website and technology partner we've ever used. They manage all website plug-ins that help us easily serve our candidates and clients.
G
Gemma Valentine
Refari has been a great asset to our business for all of the products and services that they offer. Aaron, Ritesh and the team are really quick and helpful, smart and passionate people who get recruitment.
R
Rachael Newton
Aaron and his team are amazing! Their advice has helped us improve the look and effectiveness of our website. I would highly recommend them.
Good Moves
I have worked with Refari on a couple of projects and I couldn't recommend them enough! The tech is the best on the market, their team are efficient, innovative and supportive. I have worked with a few other recruitment website suppliers over the years, I don't want to name names (bright pink) and they out beat and perform them in every sense! You can't go wrong with Refari
Emma Tawse
Working with Refari has been standout. A web developer who not only understands but embraces the need for design perfection is rare – and his collaborative approach makes the process seamless. He brings thoughtful UX insight that elevates our design work, and the end results are always stronger because of his input. Quite simply, the best web developer I’ve had the pleasure of working with.
Jay Daviot
Aaron and his team have been great to deal with throughout the entire process. Quick to act, responsive to our queries and worked through things methodically with an eye for detail. Couldn't recommend them more highly.
Ryan Corp
We had a fantastic experience working with Refari. Aaron and his team was professional, responsive, and really took the time to understand what we needed for our website. The end result was modern, easy to use, and exceeded our expectations. Communication throughout the process was clear and friendly, and they made the whole experience stress-free. I’d happily recommend Refari to anyone looking for a reliable and creative website partner!
Julianne Haines
Aaron is very prompt with responses and edits I highly recommend his service
Chris Twine
We've worked with Aaron and his team at Refari for over a year now, they've been great from the start. Always helpful, knowledgeable and willing to assist with any website development needs.
Liam Hynes
Super quick response and action time, really helpful and knows the industry to modern standards 5*
Theo Venables
Great team. Really responsive and explain things in a way that actually makes sense, even if you are not tech savvy.
Ellen Babij
Aaron and the team at Refari are great! Fab product and fab support. They go above and beyond for their clients and are always just an email away!
Vercel, the Vercel design, Next.js and related marks, designs and logos are trademarks or registered trademarks of Vercel, Inc. or its affiliates in the US and other countries.