Downloading a Google AI Studio app in a convertible shape
React / Vite / static
Google AI Studio apps export as source projects. They convert cleanly once API-key usage and runtime model calls are removed.
Quick answer
In Google AI Studio use the app's download/export option to get the project files, zip them and upload — the engine renders the app before converting.
Where do I find the ZIP?
- Open your app in Google AI Studio (Build / Apps section)
- Use the download or 'Get code' option to obtain the project files
- Keep package.json and the src/ folder together in one folder
- Zip that folder and upload it
What your upload should contain
package.jsonindex.htmlsrc/ or components/vite.config or equivalent
Google AI Studio troubleshooting
The app needs an API key at runtime
Gemini API calls are runtime features. The converter renders the UI with placeholder values; dynamic AI responses are not part of a static theme.
Blank page after conversion
The app renders client-side only. The runtime render pass handles this automatically — check the render diagnostics if it still fails.
Missing styles
Ensure the CSS import is in the entry file rather than injected at runtime.
Best practices before exporting
- Replace live model calls with static example content
- Provide placeholder environment variables so the build succeeds
- Keep the UI shell — that is what becomes your WordPress theme
- Ensure the project builds without a Google API key
How to export
Method 1 — Download project ZIP (best result)
- Open the app in AI Studio
- Use the download/export code option
- Keep the ZIP as-is
- Upload it to the converter
Method 2 — GitHub push
- Export the code to GitHub
- Copy the repository URL
- Paste it into the converter
Method 3 — Static build
- Install dependencies and run the build locally
- Zip the dist/ output
- Upload the ZIP
Accepted input
- ZIP archive
- GitHub repository
- Static export
- Source project
- Build output
Not recommended
- Old build folders from a previous version of the project
- Incomplete exports that are missing package.json or index.html
- Screenshots, Figma files, PSD files or design mockups
- node_modules — always exclude it, it makes uploads slow and adds nothing
Supported features
- React UI shell
- Static pages and layout
- Tailwind/CSS
- Images and fonts
Unsupported features
- Live Gemini model calls
- Server-side keys
- Streaming responses
Common mistakes
- Leaving required API keys undefined so the build crashes
- Exporting an app whose entire content is generated at runtime
- Including node_modules
Conversion tips
- Freeze one representative model response as static content before exporting
- Remove the API key input screen from the exported UI
Readiness checklist
- Navigation — Use real anchor links with readable labels. Menus built purely from JavaScript state are harder to map to WordPress menu locations.
- Images — Reference images from your project folder (imports or /public). Images loaded from a temporary preview host may not be reachable at conversion time.
- Assets — Fonts, icons and CSS should live inside the project. Locally hosted assets are copied into the theme automatically.
- Forms — Standard form markup is converted to Contact Form 7 or WPForms. Custom JavaScript submit handlers are replaced by the WordPress form handler.
- Routing — Every route you want as a WordPress page must be reachable from the navigation, a sitemap or a route manifest.
- Animations — CSS animations and common libraries survive. Heavy scroll-timeline or canvas effects may render differently in WordPress.
- SEO — Titles, meta descriptions and canonical tags are extracted per page and mapped into the theme and your SEO plugin.
- Responsive — Breakpoints are preserved as-is. Check mobile before exporting — the converter never fixes a layout that was already broken.
Google AI Studio FAQ
Will my Gemini integration keep working in WordPress?
No. The converted theme is static markup; live AI calls need to be rebuilt as a WordPress plugin or external service.
Which export is best?
The source project ZIP, because the sandbox can build and render every route.
Does AI Studio produce a static site?
It produces a React/Vite app that is rendered to static HTML during conversion.
Will Gemini features keep working?
No. Live AI calls require a backend; the converted theme keeps the layout and content.
Can I paste a share link?
No, upload the downloaded project ZIP.
Do I need to install anything to convert a Google AI Studio project?
No. Everything runs server-side. You upload a ZIP or paste a repository URL and receive a WordPress theme ZIP plus a live preview in the browser.
Should I remove node_modules before uploading?
Yes, always. node_modules is reinstalled during conversion, so including it only makes the upload slow and can push you over the size limit.
Can I preview the result before paying?
Yes. The WordPress preview is free for every conversion. Payment is only required when you download the theme ZIP.
What happens to my forms?
Standard HTML form markup is mapped to Contact Form 7 or WPForms shortcodes. Custom JavaScript submit handlers are replaced by the WordPress form handler.
Will my SEO titles and meta descriptions survive?
Yes. Titles, meta descriptions and canonical tags are extracted per page and written into the theme templates so your SEO plugin can take over.