SEOOS | AI Website Editor

Website AI

Tell me what to change

Hi! I'm your AI website builder. I can help you:

  • • Change colors and styles
  • • Add sections (hero, about, testimonials)
  • • Edit text and images
  • • Optimize for mobile
  • • Add lead capture forms

What would you like to do first?

Press Enter to send, Shift+Enter for new line

Preview:
Auto-save: On Saved

Changes

No changes yet

Start chatting to make edits

Find Your Dream Home

Expert real estate services tailored to your needs. Let me help you find the perfect property.

Buy a Home

Find your perfect property with personalized search and expert guidance.

Sell a Home

Get top dollar for your property with strategic marketing and negotiation.

Market Analysis

Stay informed with the latest market trends and property valuations.

Ready to Get Started?

Let's discuss your real estate goals.

`; // State let currentHTML = defaultTemplate; let changesHistory = []; let changeIndex = -1; // DOM Elements const chatMessages = document.getElementById('chatMessages'); const chatInput = document.getElementById('chatInput'); const sendBtn = document.getElementById('sendBtn'); const previewFrame = document.getElementById('previewFrame'); const changesList = document.getElementById('changesList'); const undoBtn = document.getElementById('undoBtn'); const saveStatus = document.getElementById('saveStatus'); // Initialize preview function updatePreview() { const blob = new Blob([currentHTML], { type: 'text/html' }); const url = URL.createObjectURL(blob); previewFrame.src = url; // Update save status saveStatus.innerHTML = 'Saved'; setTimeout(() => { saveStatus.classList.remove('text-emerald-600'); saveStatus.classList.add('text-gray-400'); }, 2000); } // Add message to chat function addMessage(text, isUser = false) { const messageDiv = document.createElement('div'); messageDiv.className = 'chat-message flex gap-3'; if (isUser) { messageDiv.innerHTML = `

${text}

`; } else { messageDiv.innerHTML = `

${text}

`; } chatMessages.appendChild(messageDiv); chatMessages.scrollTop = chatMessages.scrollHeight; } // Add typing indicator function addTypingIndicator() { const indicator = document.createElement('div'); indicator.id = 'typingIndicator'; indicator.className = 'chat-message flex gap-3'; indicator.innerHTML = `
`; chatMessages.appendChild(indicator); chatMessages.scrollTop = chatMessages.scrollHeight; } // Remove typing indicator function removeTypingIndicator() { const indicator = document.getElementById('typingIndicator'); if (indicator) indicator.remove(); } // Process AI request (simulated) async function processAIRequest(prompt) { addTypingIndicator(); // Simulate AI processing time await new Promise(resolve => setTimeout(resolve, 1500)); removeTypingIndicator(); // Parse the request and make changes const change = applyChange(prompt); if (change) { addMessage(change.message); addChangeToHistory(change); updatePreview(); updateUndoButton(); } else { addMessage("I understand you want to make changes. Could you be more specific? For example:\n\n• \"Change the header color to blue\"\n• \"Add a testimonials section\"\n• \"Make the hero section taller\""); } } // Apply changes based on prompt function applyChange(prompt) { const lowerPrompt = prompt.toLowerCase(); let change = null; // Color changes if (lowerPrompt.includes('header') && (lowerPrompt.includes('blue') || lowerPrompt.includes('color'))) { currentHTML = currentHTML.replace('bg-white border-b', 'bg-blue-900 border-b border-blue-800'); currentHTML = currentHTML.replace(/text-gray-600/g, 'text-blue-200'); currentHTML = currentHTML.replace(/text-slate-900/g, 'text-white'); change = { type: 'style', description: 'Changed header to dark blue', message: '✅ Changed the header to a dark blue theme. The navigation now has a professional blue appearance.' }; } else if (lowerPrompt.includes('luxury') || lowerPrompt.includes('high-end')) { currentHTML = currentHTML.replace('Find Your Dream Home', 'Luxury Real Estate'); currentHTML = currentHTML.replace('Expert real estate services', 'Exclusive properties for discerning clients'); currentHTML = currentHTML.replace('bg-emerald-500', 'bg-amber-500'); currentHTML = currentHTML.replace('bg-emerald-600', 'bg-amber-600'); currentHTML = currentHTML.replace('bg-emerald-100', 'bg-amber-100'); currentHTML = currentHTML.replace('text-emerald-600', 'text-amber-600'); currentHTML = currentHTML.replace('text-emerald-700', 'text-amber-700'); change = { type: 'content', description: 'Changed to luxury theme', message: '✅ Updated to a luxury real estate theme with gold/amber accents and premium messaging.' }; } else if (lowerPrompt.includes('testimonial') || lowerPrompt.includes('review')) { const testimonialsSection = `

What Clients Say

"Absolutely incredible service! Found our dream home in just two weeks."

- Sarah M.

"Professional, knowledgeable, and always available. Highly recommend!"

- Michael R.

"Sold our house above asking price. The marketing was exceptional."

- Jennifer K.

`; // Insert before contact section currentHTML = currentHTML.replace( '', testimonialsSection + '\n\n ' ); change = { type: 'section', description: 'Added testimonials section', message: '✅ Added a testimonials section with 3 client reviews and 5-star ratings.' }; } else if (lowerPrompt.includes('agent') && lowerPrompt.includes('photo')) { currentHTML = currentHTML.replace( '
Your Name
', `
Agent
Your Name
` ); change = { type: 'content', description: 'Added agent photo to header', message: '✅ Added a professional headshot to the header next to your name.' }; } else if (lowerPrompt.includes('lead') && lowerPrompt.includes('form')) { const leadForm = `

Get a Free Home Valuation

Enter your details and I'll send you a comprehensive market analysis.

`; currentHTML = currentHTML.replace( '', leadForm + '\n\n ' ); change = { type: 'section', description: 'Added lead capture form', message: '✅ Added a lead capture form with name/email fields for home valuation requests.' }; } else if (lowerPrompt.includes('mobile') || lowerPrompt.includes('phone')) { currentHTML = currentHTML.replace( '