{"product_id":"n8n-workflow-tailwind-landing-page-generator-to-google-drive","title":"n8n Workflow: Tailwind Landing Page Generator to Google Drive","description":"\u003ch3\u003eGenerate a complete Tailwind landing page from an idea—then automatically upload it to Google Drive\u003c\/h3\u003e\n\u003cp\u003eThis n8n workflow turns a simple “Website Description” submitted via an n8n form into a polished, multi-section Tailwind CSS HTML page using Google Gemini. Once assembled, it converts the result into an HTML file and uploads it to your selected folder in Google Drive.\u003c\/p\u003e\n\n\u003ch3\u003eWhat this workflow does\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003e\n\u003cstrong\u003eForm-triggered input:\u003c\/strong\u003e The workflow starts when a user submits the \u003cem\u003e“AI Website Generator”\u003c\/em\u003e form with a \u003cstrong\u003eWebsite Description\u003c\/strong\u003e.\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003eGoogle Gemini section generation:\u003c\/strong\u003e It sends your description to the \u003cstrong\u003eGoogle Gemini generateContent API\u003c\/strong\u003e to generate a \u003cstrong\u003eTailwind CSS Hero\u003c\/strong\u003e section.\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003eBuilds a full page:\u003c\/strong\u003e It makes successive Gemini API requests to generate additional Tailwind sections: \u003cstrong\u003eFeatures\u003c\/strong\u003e, \u003cstrong\u003eAbout\u003c\/strong\u003e, \u003cstrong\u003eTestimonials\u003c\/strong\u003e, \u003cstrong\u003ePricing\u003c\/strong\u003e, and \u003cstrong\u003eFooter\u003c\/strong\u003e.\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003eAssembles the final HTML:\u003c\/strong\u003e The workflow combines all returned section HTML into one complete HTML document, including the \u003cstrong\u003eTailwind CDN\u003c\/strong\u003e script.\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003eConverts to a file:\u003c\/strong\u003e It converts the generated HTML string into an HTML file.\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003eUploads to Google Drive:\u003c\/strong\u003e The finished file is uploaded to your chosen `Drive` and `folder`.\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch3\u003eUse cases\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003eProduce landing pages for SaaS experiments and quickly store drafts in Google Drive.\u003c\/li\u003e\n  \u003cli\u003eStreamline marketing ideation: collect a description from stakeholders and generate Tailwind sections automatically.\u003c\/li\u003e\n  \u003cli\u003eAutomation engineers: create an AI-assisted content pipeline that outputs ready-to-use HTML assets.\u003c\/li\u003e\n\u003c\/ul\u003e\n\n\u003ch3\u003eTechnical details\u003c\/h3\u003e\n\u003cul\u003e\n  \u003cli\u003e\n\u003cstrong\u003en8n nodes \/ components:\u003c\/strong\u003e form trigger, code, wait, HTTP request, convert to file, and Google Drive.\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003eIntegrations:\u003c\/strong\u003e Google Gemini (via HTTP requests) and Google Drive (OAuth2).\u003c\/li\u003e\n  \u003cli\u003e\n\u003cstrong\u003eSetup required:\u003c\/strong\u003e connect Google Drive OAuth2, select target Drive\/folder, add a Google Gemini API key (replace the hard-coded key in each Gemini request URL), and publish the n8n form to share its URL.\u003c\/li\u003e\n\u003c\/ul\u003e","brand":"N8N Commerce","offers":[{"title":"Default Title","offer_id":45742767145139,"sku":"N8N-17642","price":15.99,"currency_code":"GBP","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0749\/6279\/6723\/files\/aNwphn0fPc-ea8M_Ly2p_LzZxNtrA.png?v=1785402145","url":"https:\/\/buyflowscripts.com\/products\/n8n-workflow-tailwind-landing-page-generator-to-google-drive","provider":"N8N Commerce","version":"1.0","type":"link"}