Embed live Google Sheet data in any Framer site
Add a menu, product catalogue, or team page to your Framer site in minutes. One Code component. Updates automatically when you edit the spreadsheet. No Framer CMS setup.
Live demo
This widget is powered by a real Google Sheet
The data below comes live from a Google Sheet. This exact widget can be embedded on your site using a single embed code.
<div data-sheetrocket="cmt7a2ijb000cd8xez5dsseav" data-widget="menu-widget"> </div> <script src="https://sheetrocket.com/catalog-widget.js" async> </script> <!-- Framer Code component -->
How it works
From Google Sheet to Framer in three steps
Connect your Google Sheet
Sign in to SheetRocket and paste your Google Sheet URL. SheetRocket reads your columns and data automatically.
Configure your widget
Pick a template and map your columns. Customise colors and layout. Preview updates instantly.
Paste into a Framer Code component
In Framer click Insert, add a Code component, and paste the SheetRocket embed code. Publish. Done.
<div data-sheetrocket="cmt7a2ijb000cd8xez5dsseav" data-widget="menu-widget"> </div> <script src="https://sheetrocket.com/catalog-widget.js" async> </script> <!-- Framer Code component -->
What Framer creators use SheetRocket for
Framer AI generates your site. SheetRocket powers the live data layer. Your clients update a spreadsheet and the site stays current.
AI generated Framer sites
Framer AI builds the layout. SheetRocket adds live menus, products, or team data without rebuilding the site.
Restaurant menus
Your restaurant client updates prices and dishes in their sheet. The menu on their site updates instantly.
Product catalogues
Ecommerce clients manage inventory in a sheet. SheetRocket renders a searchable product grid on their site.
Team and staff pages
HR updates the team sheet when someone joins or leaves. The team page updates automatically.
Job boards
Clients post new roles in a sheet. Open positions appear on their careers page within seconds.
Event schedules
Event clients update their schedule in a sheet. Attendees see live schedules on the event site.
With or without SheetRocket
The difference for you and your clients.
| Situation | Without SheetRocket | With SheetRocket |
|---|---|---|
| Client wants to update menu | Emails you. You update the CMS. Republish. | Client edits their Google Sheet. Done. |
| Client adds a new product | You add a CMS item. Bill for an hour. | Client adds a row to their sheet. |
| Someone joins the team | You update the team page manually. | HR adds a row to the team sheet. |
| Client needs a new job listing | CMS update and publish. | Client adds a row to the jobs sheet. |
| Client changes a price | You edit the site. Republish. | Client edits one cell in the sheet. |
Questions about Framer and SheetRocket
Does this work with Framer AI generated sites?
Yes. Whether your Framer site was built manually or generated with Framer AI, SheetRocket works the same way. Add a Code component and paste the embed code.
How do I add it in Framer?
In Framer click Insert, then Assets, then Code. Create a new Code component. Paste the SheetRocket code and click Save. Drag the component onto your canvas.
Can my client update the content themselves?
Yes. Your client edits their Google Sheet. The Framer site updates automatically without republishing from Framer for every content change.
Does it slow down my Framer site?
The script loads asynchronously. Cached responses keep load times fast on published Framer sites.
Can I use multiple widgets on one page?
Yes. Add multiple Code components, each with its own SheetRocket embed pointing to different sheets or tabs.
Add live Google Sheet data to your Framer site today
Free to start. One Code component. Your spreadsheet becomes live site content.
Free plan available · No credit card required