{"id":16859,"date":"2026-04-15T13:09:38","date_gmt":"2026-04-15T13:09:38","guid":{"rendered":"https:\/\/siteskyline.com\/?page_id=16859"},"modified":"2026-04-19T03:45:18","modified_gmt":"2026-04-19T03:45:18","slug":"ai-chatbot-for-wordpress","status":"publish","type":"page","link":"https:\/\/siteskyline.com\/it\/ai-chatbot-for-wordpress\/","title":{"rendered":"AI Chatbot For WordPress : Intellichat"},"content":{"rendered":"\n<!-- ==========================================\n         1. HERO SECTION (ABOVE THE FOLD)\n    =========================================== -->\n<section class=\"relative pt-16 pb-20 lg:pt-24 lg:pb-28 overflow-hidden border-b border-scandi-border\">\n    <div class=\"max-w-[1200px] mx-auto w-full px-4 sm:px-6 lg:px-8\">\n        <div class=\"lg:grid lg:grid-cols-12 lg:gap-16 items-center\">\n\n            <!-- Left: Copy &amp; CTA -->\n            <div class=\"lg:col-span-6 text-center lg:text-left\">\n\n                <!-- Trust Indicator -->\n                <div class=\"flex items-center justify-center lg:justify-start gap-2 mb-6\">\n                    <div class=\"flex text-yellow-400\">\n                        \n                            \n                        \n                        \n                            \n                        \n                        \n                            \n                        \n                        \n                            \n                        \n                        \n                            \n                        \n                    <\/div>\n                    <span class=\"text-sm font-medium text-gray-700\">Trusted by 5,000+ WordPress Sites<\/span>\n                <\/div>\n\n                <!-- SEO H1 Headline &amp; H2 Subheadline -->\n                <h1 class=\"text-4xl sm:text-5xl lg:text-6xl font-bold tracking-tight text-gray-900 mb-6 leading-tight\">\n                    AI Chatbot For WordPress with <span class=\"text-brand\">RAG &amp; Gemini.<\/span>\n                <\/h1>\n                <h2 class=\"text-lg sm:text-xl text-scandi-muted mb-8 leading-relaxed max-w-2xl mx-auto lg:mx-0\">\n                    Transform your WordPress site with an intelligent AI chatbot that learns from your actual content.\n                    Answer visitor questions instantly and accurately without hallucination.\n                <\/h2>\n\n                <!-- CTAs -->\n                <div class=\"flex flex-col sm:flex-row gap-4 justify-center lg:justify-start\">\n                    <a href=\"#pricing\" class=\"inline-flex justify-center items-center px-8 py-4 text-base font-semibold !text-white bg-brand hover:bg-brand-hover rounded-lg shadow-sm hover:shadow-md transition-all duration-200\">\n                        Get Intellichat Pro\n                        \n                            \n                        \n                    <\/a>\n                    <button class=\"inline-flex justify-center items-center px-8 py-4 text-base font-medium text-gray-700 bg-white border border-scandi-border hover:bg-gray-50 rounded-lg transition-all duration-200\">\n                        \n                            \n                            \n                        \n                        Watch Video\n                    <\/button>\n                <\/div>\n            <\/div>\n\n            <!-- Right: Hero Tailwind Graphic -->\n            <div class=\"lg:col-span-6 mt-16 lg:mt-0\">\n                <div class=\"relative w-full max-w-lg mx-auto bg-scandi-surface rounded-2xl p-4 border border-scandi-border scandi-shadow h-96 flex flex-col justify-between overflow-hidden\">\n                    <!-- Browser Header -->\n                    <div class=\"flex space-x-2 mb-4\">\n                        <div class=\"w-3 h-3 rounded-full bg-red-400\"><\/div>\n                        <div class=\"w-3 h-3 rounded-full bg-yellow-400\"><\/div>\n                        <div class=\"w-3 h-3 rounded-full bg-green-400\"><\/div>\n                    <\/div>\n                    <!-- Page Content Placeholder -->\n                    <div class=\"flex-1 bg-white rounded-lg border border-gray-100 p-6 flex flex-col gap-6\">\n                        <div class=\"w-3\/4 h-8 bg-gray-100 rounded\"><\/div>\n                        <div class=\"space-y-3\">\n                            <div class=\"w-full h-3 bg-gray-100 rounded\"><\/div>\n                            <div class=\"w-full h-3 bg-gray-100 rounded\"><\/div>\n                            <div class=\"w-5\/6 h-3 bg-gray-100 rounded\"><\/div>\n                        <\/div>\n                        <div class=\"grid grid-cols-3 gap-4 mt-4\">\n                            <div class=\"h-20 bg-gray-50 rounded border border-gray-100\"><\/div>\n                            <div class=\"h-20 bg-gray-50 rounded border border-gray-100\"><\/div>\n                            <div class=\"h-20 bg-gray-50 rounded border border-gray-100\"><\/div>\n                        <\/div>\n                    <\/div>\n                    <!-- Floating Widget Mockup -->\n                    <div class=\"absolute bottom-6 right-6 flex flex-col items-end\">\n                        <div class=\"w-72 h-56 bg-white border border-gray-200 shadow-xl rounded-xl mb-3 flex flex-col overflow-hidden\">\n                            <div class=\"bg-brand text-white p-3 font-semibold flex items-center justify-between\">\n                                <div class=\"flex items-center gap-2\">\n                                    <div class=\"w-2 h-2 bg-green-400 rounded-full animate-pulse\"><\/div>\n                                    Intellichat AI\n                                <\/div>\n                                \n                                    \n                                \n                            <\/div>\n                            <div class=\"flex-1 p-3 space-y-3 text-sm bg-gray-50 overflow-y-auto\">\n                                <div class=\"bg-white border border-gray-100 rounded-2xl rounded-tl-sm p-3 max-w-[85%] self-start shadow-sm text-gray-700\">\n                                    Hi! I&#8217;m trained on this website&#8217;s content. What can I help you find?\n                                <\/div>\n                                <div class=\"bg-brand text-white rounded-2xl rounded-tr-sm p-3 max-w-[85%] self-end ml-auto shadow-sm\">\n                                    Do you integrate with WooCommerce?\n                                <\/div>\n                                <div class=\"bg-white border border-gray-100 rounded-2xl rounded-tl-sm p-3 max-w-[85%] self-start shadow-sm text-gray-700 flex flex-col gap-2\">\n                                    <span>Yes! The Pro version includes WooCommerce integration allowing customers to\n                                        check order status directly in chat.<\/span>\n                                <\/div>\n                            <\/div>\n                            <div class=\"p-2 border-t border-gray-100 bg-white\">\n                                <div class=\"bg-gray-100 rounded-full px-4 py-2 text-gray-400 text-xs flex justify-between items-center\">\n                                    Type your message&#8230;\n                                    \n                                        \n                                    \n                                <\/div>\n                            <\/div>\n                        <\/div>\n                        <div class=\"w-14 h-14 bg-brand rounded-full flex items-center justify-center text-white shadow-lg shadow-brand\/40 hover:scale-105 transition-transform cursor-pointer\">\n                            \n                                \n                                \n                            \n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/section>\n\n<!-- Video Modal -->\n<div id=\"videoModal\" class=\"fixed inset-0 z-50 flex items-center justify-center hidden bg-black\/80 backdrop-blur-sm transition-opacity\">\n    <div class=\"relative w-full max-w-4xl mx-4 aspect-video bg-black rounded-xl shadow-2xl border border-white\/10\">\n        <button class=\"absolute -top-12 right-0 text-white\/70 hover:text-white mb-2 z-50 flex items-center gap-2 transition-colors\">\n            Close\n            \n        <\/button>\n        <div class=\"w-full h-full rounded-xl overflow-hidden\">\n            \n        <\/div>\n    <\/div>\n<\/div>\n\n<!-- ==========================================\n         2. THE PROCESS (How It Works)\n    =========================================== -->\n<section class=\"py-20 bg-scandi-surface border-b border-scandi-border\">\n    <div class=\"max-w-[1200px] mx-auto w-full px-4 sm:px-6 lg:px-8\">\n        <div class=\"text-center max-w-3xl mx-auto mb-16\">\n            <h2 class=\"text-3xl md:text-4xl font-bold text-gray-900 mb-4\">Set up your AI Assistant in minutes<\/h2>\n            <p class=\"text-lg text-scandi-muted\">No coding required. Use our quick setup wizard to connect your API,\n                train your data, and deploy your chatbot.<\/p>\n        <\/div>\n\n        <div class=\"grid md:grid-cols-3 gap-10 text-center\">\n            <!-- Step 1 -->\n            <div class=\"relative\">\n                <div class=\"w-16 h-16 mx-auto bg-brand-light text-brand rounded-full flex items-center justify-center text-2xl font-bold mb-6 relative z-10 border-4 border-scandi-surface shadow-sm\">\n                    1<\/div>\n                <h3 class=\"text-xl font-bold text-gray-900 mb-3\">Connect API<\/h3>\n                <p class=\"text-scandi-muted leading-relaxed\">Enter your Google Gemini API key with our onboarding wizard\n                    featuring live validation.<\/p>\n                <div class=\"hidden md:block absolute top-8 left-[60%] w-full h-[2px] bg-brand-light -z-0\"><\/div>\n            <\/div>\n            <!-- Step 2 -->\n            <div class=\"relative\">\n                <div class=\"w-16 h-16 mx-auto bg-brand text-white rounded-full flex items-center justify-center text-2xl font-bold mb-6 relative z-10 border-4 border-scandi-surface shadow-sm\">\n                    2<\/div>\n                <h3 class=\"text-xl font-bold text-gray-900 mb-3\">Train on Content<\/h3>\n                <p class=\"text-scandi-muted leading-relaxed\">Select specific posts and pages. Intellichat converts them\n                    to high-dimensional vectors for semantic search.<\/p>\n                <div class=\"hidden md:block absolute top-8 left-[60%] w-full h-[2px] bg-brand-light -z-0\"><\/div>\n            <\/div>\n            <!-- Step 3 -->\n            <div class=\"relative\">\n                <div class=\"w-16 h-16 mx-auto bg-brand-light text-brand rounded-full flex items-center justify-center text-2xl font-bold mb-6 relative z-10 border-4 border-scandi-surface shadow-sm\">\n                    3<\/div>\n                <h3 class=\"text-xl font-bold text-gray-900 mb-3\">Customize &amp; Launch<\/h3>\n                <p class=\"text-scandi-muted leading-relaxed\">Customize widget colors and icons with live preview, then\n                    instantly activate the chatbot on your site.<\/p>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/section>\n\n<!-- ==========================================\n         3. FEATURES SECTION\n    =========================================== -->\n\n<!-- Feature 1: RAG Technology -->\n<section id=\"features\" class=\"py-16 lg:py-24 bg-white border-b border-scandi-border\">\n    <div class=\"max-w-[1200px] mx-auto w-full px-4 sm:px-6 lg:px-8\">\n        <div class=\"lg:grid lg:grid-cols-2 gap-16 items-center\">\n\n            <!-- Left: Tailwind Graphic -->\n            <div class=\"mb-12 lg:mb-0\">\n                <div class=\"relative w-full aspect-video bg-scandi-surface rounded-2xl p-6 border border-scandi-border scandi-shadow flex items-center justify-center\">\n                    <div class=\"relative w-full h-full flex items-center justify-between\">\n                        <!-- Document -->\n                        <div class=\"w-20 h-28 bg-white border border-gray-200 rounded-lg flex flex-col items-center justify-center gap-2 shadow-sm relative\">\n                            <div class=\"absolute -top-3 -right-3 bg-blue-100 text-blue-600 rounded-full w-8 h-8 flex items-center justify-center shadow-sm\">\n                                \n                                    \n                                    \n                                \n                            <\/div>\n                            <div class=\"w-12 h-1.5 bg-gray-200 rounded\"><\/div>\n                            <div class=\"w-14 h-1.5 bg-gray-200 rounded\"><\/div>\n                            <div class=\"w-10 h-1.5 bg-gray-200 rounded\"><\/div>\n                            <div class=\"w-12 h-1.5 bg-gray-200 rounded mt-2\"><\/div>\n                            <div class=\"w-8 h-1.5 bg-gray-200 rounded\"><\/div>\n                        <\/div>\n\n                        <!-- Arrow -->\n                        <div class=\"flex-1 flex items-center justify-center relative\">\n                            <div class=\"w-full h-[2px] border-t-2 border-dashed border-brand\/40 absolute top-1\/2 -translate-y-1\/2\">\n                            <\/div>\n                            <div class=\"bg-brand\/10 text-brand px-3 py-1 rounded-full text-[10px] font-bold z-10 uppercase tracking-wider border border-brand\/20 backdrop-blur-sm\">\n                                Embed<\/div>\n                        <\/div>\n\n                        <!-- Vector DB -->\n                        <div class=\"w-28 h-32 bg-white border border-gray-200 rounded-lg flex flex-col shadow-lg overflow-hidden relative\">\n                            <div class=\"h-8 bg-gray-900 flex items-center justify-center text-xs text-white font-mono gap-1\">\n                                \n                                    \n                                    \n                                \n                                Vector DB\n                            <\/div>\n                            <div class=\"flex-1 p-3 flex flex-col gap-2 justify-center bg-gray-50\">\n                                <div class=\"bg-white p-1.5 rounded border border-gray-100 flex items-center gap-2\">\n                                    <div class=\"w-1.5 h-1.5 bg-brand rounded-full\"><\/div>\n                                    <div class=\"text-[9px] font-mono text-gray-500\">[0.12, -0.4&#8230;]<\/div>\n                                <\/div>\n                                <div class=\"bg-white p-1.5 rounded border border-gray-100 flex items-center gap-2\">\n                                    <div class=\"w-1.5 h-1.5 bg-purple-500 rounded-full\"><\/div>\n                                    <div class=\"text-[9px] font-mono text-gray-500\">[0.88, 0.23&#8230;]<\/div>\n                                <\/div>\n                                <div class=\"bg-white p-1.5 rounded border border-gray-100 flex items-center gap-2\">\n                                    <div class=\"w-1.5 h-1.5 bg-blue-500 rounded-full\"><\/div>\n                                    <div class=\"text-[9px] font-mono text-gray-500\">[-0.5, 0.91&#8230;]<\/div>\n                                <\/div>\n                            <\/div>\n                        <\/div>\n\n                        <!-- Arrow -->\n                        <div class=\"flex-1 flex items-center justify-center relative\">\n                            <div class=\"w-full h-[2px] border-t-2 border-dashed border-brand\/40 absolute top-1\/2 -translate-y-1\/2\">\n                            <\/div>\n                            <div class=\"bg-brand\/10 text-brand px-3 py-1 rounded-full text-[10px] font-bold z-10 uppercase tracking-wider border border-brand\/20 backdrop-blur-sm\">\n                                RAG<\/div>\n                        <\/div>\n\n                        <!-- AI Generation -->\n                        <div class=\"w-20 h-28 bg-gradient-to-br from-brand to-purple-600 rounded-lg text-white flex flex-col items-center justify-center shadow-lg gap-3 relative overflow-hidden\">\n                            <div class=\"absolute inset-0 bg-white\/10 opacity-50 bg-[radial-gradient(circle_at_50%_50%,rgba(255,255,255,0.4),transparent_70%)]\">\n                            <\/div>\n                            \n                                \n                                \n                            \n                            <span class=\"text-[10px] font-bold relative z-10\">Gemini<\/span>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- Right: Text -->\n            <div>\n                <h2 class=\"text-3xl lg:text-4xl font-bold text-gray-900 mb-8\">Smarter AI with <span class=\"text-brand\">RAG Technology<\/span><\/h2>\n                <ul class=\"space-y-6\">\n                    <li class=\"flex items-start gap-4\">\n                        <div class=\"w-6 h-6 rounded-full bg-brand-light flex items-center justify-center text-brand flex-shrink-0 mt-0.5\">\n                            \n                                \n                            \n                        <\/div>\n                        <div>\n                            <span class=\"block text-gray-900 text-base\"><strong>Retrieval-Augmented Generation:<\/strong>\n                                RAG ensures answers are grounded in your actual content, combining semantic search with\n                                AI generation.<\/span>\n                        <\/div>\n                    <\/li>\n                    <li class=\"flex items-start gap-4\">\n                        <div class=\"w-6 h-6 rounded-full bg-brand-light flex items-center justify-center text-brand flex-shrink-0 mt-0.5\">\n                            \n                                \n                            \n                        <\/div>\n                        <div>\n                            <span class=\"block text-gray-900 text-base\"><strong>Vector Embeddings:<\/strong>\n                                Your WordPress content is converted into high-dimensional vectors and stored locally in\n                                your database for blazing-fast similarity matching.<\/span>\n                        <\/div>\n                    <\/li>\n                    <li class=\"flex items-start gap-4\">\n                        <div class=\"w-6 h-6 rounded-full bg-brand-light flex items-center justify-center text-brand flex-shrink-0 mt-0.5\">\n                            \n                                \n                            \n                        <\/div>\n                        <div>\n                            <span class=\"block text-gray-900 text-base\"><strong>Zero Hallucinations:<\/strong>\n                                The chatbot relies on your documentation and posts to generate answers, drastically\n                                reducing false information.<\/span>\n                        <\/div>\n                    <\/li>\n                <\/ul>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/section>\n\n<!-- Feature 2: Floating Chat Widget -->\n<section class=\"py-16 lg:py-24 bg-scandi-surface border-b border-scandi-border\">\n    <div class=\"max-w-[1200px] mx-auto w-full px-4 sm:px-6 lg:px-8\">\n        <div class=\"lg:grid lg:grid-cols-2 gap-16 items-center flex flex-col-reverse\">\n\n            <!-- Left: Text -->\n            <div class=\"mt-12 lg:mt-0\">\n                <h2 class=\"text-3xl lg:text-4xl font-bold text-gray-900 mb-8\">Beautiful <span class=\"text-brand\">Floating Widget<\/span><\/h2>\n                <ul class=\"space-y-5\">\n                    <li class=\"flex items-start gap-4\">\n                        <div class=\"w-6 h-6 rounded-full bg-brand flex items-center justify-center text-white flex-shrink-0 mt-0.5\">\n                            \n                                \n                            \n                        <\/div>\n                        <div>\n                            <span class=\"block text-gray-900 font-bold text-base\">Live Preview Customization<\/span>\n                            <span class=\"block text-sm text-scandi-muted mt-1\">See changes in real-time as you tweak\n                                colors, adjust themes, and edit the custom welcome message.<\/span>\n                        <\/div>\n                    <\/li>\n                    <li class=\"flex items-start gap-4\">\n                        <div class=\"w-6 h-6 rounded-full bg-brand flex items-center justify-center text-white flex-shrink-0 mt-0.5\">\n                            \n                                \n                            \n                        <\/div>\n                        <div>\n                            <span class=\"block text-gray-900 font-bold text-base\">Shadow DOM Isolation<\/span>\n                            <span class=\"block text-sm text-scandi-muted mt-1\">Widget CSS is isolated, meaning your\n                                theme&#8217;s stylesheets won&#8217;t break the chatbot UI, ensuring it always looks perfect.<\/span>\n                        <\/div>\n                    <\/li>\n                    <li class=\"flex items-start gap-4\">\n                        <div class=\"w-6 h-6 rounded-full bg-brand flex items-center justify-center text-white flex-shrink-0 mt-0.5\">\n                            \n                                \n                            \n                        <\/div>\n                        <div>\n                            <span class=\"block text-gray-900 font-bold text-base\">Dark Mode &amp; Responsiveness<\/span>\n                            <span class=\"block text-sm text-scandi-muted mt-1\">Automatically adapts to user&#8217;s system\n                                preferences. Works beautifully on desktop, tablet, and mobile devices.<\/span>\n                        <\/div>\n                    <\/li>\n                <\/ul>\n            <\/div>\n\n            <!-- Right: Tailwind Graphic -->\n            <div class=\"mb-12 lg:mb-0\">\n                <div class=\"w-full aspect-square md:aspect-video bg-white rounded-2xl p-6 border border-scandi-border scandi-shadow flex flex-col items-center justify-center space-y-8 relative overflow-hidden\">\n                    <!-- Background blobs -->\n                    <div class=\"absolute top-0 right-0 w-32 h-32 bg-brand\/5 rounded-full blur-2xl\"><\/div>\n                    <div class=\"absolute bottom-0 left-0 w-40 h-40 bg-purple-500\/5 rounded-full blur-2xl\"><\/div>\n\n                    <!-- Icon Switcher Mockup -->\n                    <div class=\"flex gap-4 z-10\">\n                        <div class=\"w-14 h-14 bg-brand rounded-full flex items-center justify-center text-white shadow-lg ring-4 ring-brand\/20 cursor-pointer\">\n                            \n                                \n                                \n                            \n                        <\/div>\n                        <div class=\"w-14 h-14 bg-gray-100 rounded-full flex items-center justify-center text-gray-500 hover:bg-gray-200 cursor-pointer transition-colors\">\n                            \n                                \n                                \n                            \n                        <\/div>\n                        <div class=\"w-14 h-14 bg-gray-100 rounded-full flex items-center justify-center text-gray-500 hover:bg-gray-200 cursor-pointer transition-colors\">\n                            \n                                \n                            \n                        <\/div>\n                    <\/div>\n\n                    <!-- Widget Preview UI -->\n                    <div class=\"bg-gray-900 border border-gray-800 rounded-xl shadow-2xl w-full max-w-sm p-5 z-10\">\n                        <div class=\"flex items-center justify-between mb-5 pb-3 border-b border-gray-800\">\n                            <div class=\"font-semibold text-white flex items-center gap-2\">\n                                <div class=\"w-2.5 h-2.5 bg-green-500 rounded-full shadow-[0_0_8px_rgba(34,197,94,0.6)]\">\n                                <\/div>\n                                Chat Support (Dark Mode)\n                            <\/div>\n                            \n                                \n                            \n                        <\/div>\n                        <div class=\"space-y-4\">\n                            <div class=\"flex items-start gap-3\">\n                                <div class=\"w-8 h-8 rounded-full bg-brand flex items-center justify-center text-white text-xs shrink-0\">\n                                    AI<\/div>\n                                <div class=\"bg-gray-800 text-gray-200 rounded-2xl rounded-tl-sm p-3 text-sm\">\n                                    Hello! How can I assist you with your site today?\n                                <\/div>\n                            <\/div>\n                            <div class=\"h-3 bg-gray-800 rounded-full w-3\/4 ml-auto opacity-50\"><\/div>\n                            <div class=\"h-3 bg-gray-800 rounded-full w-1\/2 ml-auto opacity-50\"><\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/section>\n\n<!-- Feature 3: Train on Your Content -->\n<section class=\"py-16 lg:py-24 bg-white border-b border-scandi-border\">\n    <div class=\"max-w-[1200px] mx-auto w-full px-4 sm:px-6 lg:px-8\">\n        <div class=\"lg:grid lg:grid-cols-2 gap-16 items-center\">\n            <!-- Left: Tailwind Graphic -->\n            <div class=\"mb-12 lg:mb-0\">\n                <div class=\"w-full aspect-video bg-scandi-surface rounded-2xl p-6 border border-scandi-border scandi-shadow flex flex-col items-center justify-center relative overflow-hidden\">\n                    <div class=\"absolute top-10 left-10 w-20 h-20 bg-blue-400\/10 rounded-full blur-xl\"><\/div>\n                    <div class=\"absolute bottom-10 right-10 w-32 h-32 bg-brand\/10 rounded-full blur-xl\"><\/div>\n\n                    <div class=\"w-full max-w-sm bg-white rounded-xl shadow-sm border border-gray-100 overflow-hidden z-10\">\n                        <div class=\"bg-gray-50 px-4 py-3 border-b border-gray-100 flex justify-between items-center\">\n                            <span class=\"font-semibold text-gray-700 text-sm\">Select Content to Train<\/span>\n                            <span class=\"text-xs bg-brand\/10 text-brand px-2 py-1 rounded font-medium\">Pages &amp;\n                                Posts<\/span>\n                        <\/div>\n                        <div class=\"divide-y divide-gray-100\">\n                            <!-- Item 1 -->\n                            <div class=\"p-3 flex items-center gap-3 hover:bg-gray-50 transition-colors\">\n                                <div class=\"w-5 h-5 rounded border border-brand bg-brand flex items-center justify-center text-white\">\n                                    \n                                        \n                                    \n                                <\/div>\n                                <div class=\"flex-1\">\n                                    <div class=\"text-sm font-medium text-gray-800\">About Our Company<\/div>\n                                    <div class=\"text-xs text-gray-400\">Page \u2022 Last modified 2 days ago<\/div>\n                                <\/div>\n                                <span class=\"text-[10px] font-bold text-green-600 bg-green-50 px-2 py-1 rounded border border-green-100\">Trained<\/span>\n                            <\/div>\n                            <!-- Item 2 -->\n                            <div class=\"p-3 flex items-center gap-3 hover:bg-gray-50 transition-colors\">\n                                <div class=\"w-5 h-5 rounded border border-brand bg-brand flex items-center justify-center text-white\">\n                                    \n                                        \n                                    \n                                <\/div>\n                                <div class=\"flex-1\">\n                                    <div class=\"text-sm font-medium text-gray-800\">Shipping Policy<\/div>\n                                    <div class=\"text-xs text-gray-400\">Page \u2022 Last modified 1 week ago<\/div>\n                                <\/div>\n                                <span class=\"text-[10px] font-bold text-green-600 bg-green-50 px-2 py-1 rounded border border-green-100\">Trained<\/span>\n                            <\/div>\n                            <!-- Item 3 -->\n                            <div class=\"p-3 flex items-center gap-3 hover:bg-gray-50 transition-colors opacity-60\">\n                                <div class=\"w-5 h-5 rounded border border-gray-300 bg-white\"><\/div>\n                                <div class=\"flex-1\">\n                                    <div class=\"text-sm font-medium text-gray-800\">Summer Sale 2024<\/div>\n                                    <div class=\"text-xs text-gray-400\">Post \u2022 Draft<\/div>\n                                <\/div>\n                                <span class=\"text-[10px] font-medium text-gray-500 bg-gray-100 px-2 py-1 rounded border border-gray-200\">Pending<\/span>\n                            <\/div>\n                        <\/div>\n                        <div class=\"p-3 bg-gray-50 border-t border-gray-100 flex justify-end\">\n                            <div class=\"bg-brand text-white text-xs font-semibold py-2 px-4 rounded shadow flex items-center gap-2 cursor-pointer\">\n                                \n                                    \n                                    \n                                \n                                Retrain Selected\n                            <\/div>\n                        <\/div>\n                    <\/div>\n                <\/div>\n            <\/div>\n\n            <!-- Right: Text -->\n            <div>\n                <h2 class=\"text-3xl lg:text-4xl font-bold text-gray-900 mb-6\"><span class=\"text-brand\">Train<\/span> on\n                    Your Content<\/h2>\n                <p class=\"text-lg text-scandi-muted mb-8\">You have complete control over what the AI learns. Filter and\n                    select specific content easily from your dashboard.<\/p>\n\n                <ul class=\"space-y-6\">\n                    <li class=\"flex items-start gap-4\">\n                        <div class=\"w-6 h-6 rounded-full bg-brand-light flex items-center justify-center text-brand flex-shrink-0 mt-0.5\">\n                            \n                                \n                            \n                        <\/div>\n                        <div>\n                            <span class=\"block text-gray-900 text-base\"><strong>Selective Training:<\/strong> Choose\n                                exactly which posts and pages to embed. Avoid feeding outdated or irrelevant information\n                                to the AI.<\/span>\n                        <\/div>\n                    <\/li>\n                    <li class=\"flex items-start gap-4\">\n                        <div class=\"w-6 h-6 rounded-full bg-brand-light flex items-center justify-center text-brand flex-shrink-0 mt-0.5\">\n                            \n                                \n                            \n                        <\/div>\n                        <div>\n                            <span class=\"block text-gray-900 text-base\"><strong>Manage Data Easily:<\/strong> View\n                                trained data at a glance, and instantly delete embeddings when your content changes to\n                                keep the bot up-to-date.<\/span>\n                        <\/div>\n                    <\/li>\n                    <li class=\"flex items-start gap-4\">\n                        <div class=\"w-6 h-6 rounded-full bg-brand-light flex items-center justify-center text-brand flex-shrink-0 mt-0.5\">\n                            \n                                \n                            \n                        <\/div>\n                        <div>\n                            <span class=\"block text-gray-900 text-base\"><strong>Pagination &amp; Filters:<\/strong> Manage\n                                massive content libraries effortlessly with built-in pagination and filtering by post\n                                types.<\/span>\n                        <\/div>\n                    <\/li>\n                <\/ul>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/section>\n\n<!-- Feature 4: Pro Features -->\n<section class=\"py-16 lg:py-24 bg-scandi-surface border-b border-scandi-border\">\n    <div class=\"max-w-[1200px] mx-auto w-full px-4 sm:px-6 lg:px-8\">\n        <div class=\"text-center max-w-3xl mx-auto mb-16\">\n            <span class=\"text-brand font-semibold tracking-wider uppercase text-sm mb-2 block\">Premium Features<\/span>\n            <h2 class=\"text-3xl md:text-4xl font-bold text-gray-900 mb-4\">Upgrade to Intellichat Pro<\/h2>\n            <p class=\"text-lg text-scandi-muted\">Take your AI chatbot to the next level with powerful tools designed for\n                businesses and eCommerce stores.<\/p>\n        <\/div>\n\n        <div class=\"grid md:grid-cols-2 lg:grid-cols-4 gap-8\">\n            <!-- Pro Feature 1 -->\n            <div class=\"bg-white rounded-xl p-6 border border-scandi-border scandi-shadow\">\n                <div class=\"w-12 h-12 bg-gradient-to-br from-indigo-500 to-purple-600 rounded-lg flex items-center justify-center text-white mb-6\">\n                    \n                        \n                        \n                    \n                <\/div>\n                <h3 class=\"text-lg font-bold text-gray-900 mb-2\">Multi-Provider Models<\/h3>\n                <p class=\"text-sm text-scandi-muted\">Unlock OpenAI (GPT-4o) and Anthropic (Claude 3.5 Sonnet) models\n                    alongside Gemini for unparalleled reasoning capabilities.<\/p>\n            <\/div>\n\n            <!-- Pro Feature 2 -->\n            <div class=\"bg-white rounded-xl p-6 border border-scandi-border scandi-shadow\">\n                <div class=\"w-12 h-12 bg-gradient-to-br from-blue-500 to-cyan-500 rounded-lg flex items-center justify-center text-white mb-6\">\n                    \n                        \n                        \n                    \n                <\/div>\n                <h3 class=\"text-lg font-bold text-gray-900 mb-2\">AI Ticketing System<\/h3>\n                <p class=\"text-sm text-scandi-muted\">Automatically create and manage support tickets when users need\n                    human help. Streamline your customer service pipeline.<\/p>\n            <\/div>\n\n            <!-- Pro Feature 3 -->\n            <div class=\"bg-white rounded-xl p-6 border border-scandi-border scandi-shadow\">\n                <div class=\"w-12 h-12 bg-gradient-to-br from-green-400 to-emerald-600 rounded-lg flex items-center justify-center text-white mb-6\">\n                    \n                        \n                        \n                    \n                <\/div>\n                <h3 class=\"text-lg font-bold text-gray-900 mb-2\">WooCommerce Ready<\/h3>\n                <p class=\"text-sm text-scandi-muted\">Allow customers to securely check their order status and tracking\n                    details directly inside the chat window.<\/p>\n            <\/div>\n\n            <!-- Pro Feature 4 -->\n            <div class=\"bg-white rounded-xl p-6 border border-scandi-border scandi-shadow relative overflow-hidden\">\n                <div class=\"absolute -right-4 -top-4 w-16 h-16 bg-yellow-400\/20 rounded-full blur-xl\"><\/div>\n                <div class=\"w-12 h-12 bg-gradient-to-br from-gray-700 to-gray-900 rounded-lg flex items-center justify-center text-white mb-6\">\n                    \n                        \n                        \n                    \n                <\/div>\n                <h3 class=\"text-lg font-bold text-gray-900 mb-2\">White-Labeling<\/h3>\n                <p class=\"text-sm text-scandi-muted\">Make it entirely yours. Remove the &#8220;Powered by Intellichat&#8221; badge\n                    from the widget footer and keep your brand in focus.<\/p>\n            <\/div>\n        <\/div>\n\n        <div class=\"mt-12 text-center\">\n            <a href=\"#pricing\" class=\"inline-flex justify-center items-center px-8 py-4 text-base font-semibold !text-white bg-gray-900 hover:bg-gray-800 rounded-lg shadow-lg hover:shadow-xl transition-all duration-200 gap-2\">\n                View Pricing Plans\n                \n                    \n                \n            <\/a>\n        <\/div>\n    <\/div>\n<\/section>\n\n<!-- ==========================================\n         5. PRICING PLANS\n    =========================================== -->\n<section id=\"pricing\" class=\"py-24 bg-scandi-surface border-b border-scandi-border\">\n    <div class=\"max-w-[1200px] mx-auto w-full px-4 sm:px-6 lg:px-8\">\n        <div class=\"text-center max-w-2xl mx-auto mb-16\">\n            <h2 class=\"text-3xl md:text-4xl font-bold text-gray-900 mb-4\">Choose Your Pro Plan<\/h2>\n            <p class=\"text-lg text-scandi-muted\">Unlock powerful features to elevate your customer support. All plans\n                are billed annually.<\/p>\n        <\/div>\n\n        <!-- Pricing Grid -->\n        <div class=\"grid md:grid-cols-3 gap-8 max-w-6xl mx-auto mb-16\">\n\n            <!-- Plan 1 -->\n            <div class=\"bg-white rounded-2xl border border-scandi-border p-8 flex flex-col hover:shadow-lg transition-shadow duration-300\">\n                <h3 class=\"text-xl font-semibold text-gray-900 mb-2\">1 Site License<\/h3>\n                <p class=\"text-scandi-muted text-sm mb-6\">Perfect for a single website.<\/p>\n                <div class=\"mb-6 border-b border-scandi-border pb-6\">\n                    <span class=\"text-4xl font-bold text-gray-900\">$49<\/span>\n                    <span class=\"text-scandi-muted\">\/Year<\/span>\n                <\/div>\n                <ul class=\"space-y-4 mb-8 flex-1\">\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        Multi-Provider Models (OpenAI, Anthropic)\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        AI Ticketing System\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        WooCommerce Integration\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        White-Labeling\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        Priority Support\n                    <\/li>\n                <\/ul>\n                <a href=\"https:\/\/app.siteskyline.com\/product\/intellichat-pro\/?add-to-cart=1258&amp;variation_id=1259&amp;attribute_sites=1%20Site\" class=\"block w-full py-3 px-4 bg-brand-light text-brand font-semibold text-center rounded-lg hover:bg-brand hover:text-white transition-colors\">\n                    Choose Plan\n                <\/a>\n            <\/div>\n\n            <!-- Plan 2 (Highlighted) -->\n            <div class=\"bg-white rounded-2xl border-2 border-brand p-8 flex flex-col relative shadow-xl transform md:-translate-y-4\">\n                <div class=\"absolute top-0 left-1\/2 -translate-x-1\/2 -translate-y-1\/2 bg-brand text-white px-4 py-1 rounded-full text-sm font-semibold tracking-wide\">\n                    MOST POPULAR\n                <\/div>\n                <h3 class=\"text-xl font-semibold text-gray-900 mb-2\">5 Sites License<\/h3>\n                <p class=\"text-scandi-muted text-sm mb-6\">Ideal for multiple projects or client work.<\/p>\n                <div class=\"mb-6 border-b border-scandi-border pb-6\">\n                    <span class=\"text-4xl font-bold text-gray-900\">$99<\/span>\n                    <span class=\"text-scandi-muted\">\/Year<\/span>\n                <\/div>\n                <ul class=\"space-y-4 mb-8 flex-1\">\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        Multi-Provider Models (OpenAI, Anthropic)\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        AI Ticketing System\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        WooCommerce Integration\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        White-Labeling\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        Priority Support\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-900 font-bold text-sm\">\n                        \n                            \n                            \n                        \n                        Up to 5 Websites\n                    <\/li>\n                <\/ul>\n                <a href=\"https:\/\/app.siteskyline.com\/product\/intellichat-pro\/?add-to-cart=1258&amp;variation_id=1260&amp;attribute_sites=5%20Sites\" class=\"block w-full py-3 px-4 bg-brand text-white font-semibold text-center rounded-lg hover:bg-brand-hover transition-colors shadow-md hover:shadow-lg\">\n                    Choose Plan\n                <\/a>\n            <\/div>\n\n            <!-- Plan 3 -->\n            <div class=\"bg-white rounded-2xl border border-scandi-border p-8 flex flex-col hover:shadow-lg transition-shadow duration-300\">\n                <h3 class=\"text-xl font-semibold text-gray-900 mb-2\">20 Sites License<\/h3>\n                <p class=\"text-scandi-muted text-sm mb-6\">For agencies and power users.<\/p>\n                <div class=\"mb-6 border-b border-scandi-border pb-6\">\n                    <span class=\"text-4xl font-bold text-gray-900\">$149<\/span>\n                    <span class=\"text-scandi-muted\">\/Year<\/span>\n                <\/div>\n                <ul class=\"space-y-4 mb-8 flex-1\">\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        Multi-Provider Models (OpenAI, Anthropic)\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        AI Ticketing System\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        WooCommerce Integration\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        White-Labeling\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-700 text-sm\">\n                        \n                            \n                            \n                        \n                        Priority Support\n                    <\/li>\n                    <li class=\"flex items-center gap-3 text-gray-900 font-bold text-sm\">\n                        \n                            \n                            \n                        \n                        Up to 20 Websites\n                    <\/li>\n                <\/ul>\n                <a href=\"https:\/\/app.siteskyline.com\/product\/intellichat-pro\/?add-to-cart=1258&amp;variation_id=1261&amp;attribute_sites=20%20Sites\" class=\"block w-full py-3 px-4 bg-brand-light text-brand font-semibold text-center rounded-lg hover:bg-brand hover:text-white transition-colors\">\n                    Choose Plan\n                <\/a>\n            <\/div>\n        <\/div>\n\n        <!-- Trust Badges -->\n        <div class=\"mt-8 flex flex-col sm:flex-row items-center justify-center gap-6 text-sm text-scandi-muted\">\n            <div class=\"flex items-center gap-2\">\n                \n                    \n                \n                <span class=\"font-medium text-gray-700\">14-Day Money-Back Guarantee<\/span>\n            <\/div>\n            <div class=\"hidden sm:block w-1.5 h-1.5 bg-gray-300 rounded-full\"><\/div>\n            <div class=\"flex items-center gap-2\">\n                \n                    \n                \n                <span class=\"font-medium text-gray-700\">Payments Protected by Stripe<\/span>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/section>\n\n<!-- ==========================================\n         6. FREE VERSION CTA\n    =========================================== -->\n<section class=\"py-20 bg-white border-b border-scandi-border text-center\">\n    <div class=\"max-w-3xl mx-auto px-4 sm:px-6 lg:px-8\">\n        <h2 class=\"text-3xl md:text-4xl font-bold text-gray-900 mb-6\">Not ready for Pro yet?<\/h2>\n        <p class=\"text-lg text-scandi-muted mb-8 leading-relaxed\">\n            Try our free version first to see how easy it is to set up an AI chatbot for your website, trained on your exact content.\n        <\/p>\n        <div class=\"flex flex-col items-center justify-center gap-4\">\n            <a href=\"https:\/\/wordpress.org\/plugins\/intellichat-ai-chatbot\/\" target=\"_blank\" class=\"inline-flex justify-center items-center px-8 py-4 text-base font-semibold text-gray-700 bg-white border-2 border-gray-200 hover:border-gray-300 hover:bg-gray-50 rounded-lg shadow-sm hover:shadow-md transition-all duration-200\">\n                \n                    \n                \n                Download Free Version\n            <\/a>\n            <p class=\"text-sm text-gray-500 mt-3 font-medium\">\n                <a href=\"https:\/\/wordpress.org\/plugins\/intellichat-ai-chatbot\/\" target=\"_blank\" class=\"hover:text-brand hover:underline transition-colors block px-2\">\n                    intellichat \u2013 AI Chatbot For WordPress with RAG \u2013 WordPress plugin | WordPress.org\n                <\/a>\n            <\/p>\n        <\/div>\n<\/section>\n\n<!-- ==========================================\n         7. FAQs SECTION\n    =========================================== -->\n<section class=\"py-20 bg-scandi-surface border-b border-scandi-border\">\n    <div class=\"max-w-[1000px] mx-auto w-full px-4 sm:px-6 lg:px-8\">\n        <div class=\"text-center max-w-3xl mx-auto mb-16\">\n            <h2 class=\"text-3xl md:text-4xl font-bold text-gray-900 mb-4\">Frequently Asked Questions<\/h2>\n            <p class=\"text-lg text-scandi-muted\">Have a question? We&#8217;re here to help clarify everything before you buy.<\/p>\n        <\/div>\n\n        <div class=\"grid gap-6\">\n            <!-- FAQ Item 1 -->\n            <div class=\"bg-white rounded-xl p-6 border border-scandi-border scandi-shadow\">\n                <h3 class=\"text-lg font-bold text-gray-900 mb-3 flex items-center gap-2\">\n                    \n                    Will this slow down my website load time?\n                <\/h3>\n                <p class=\"text-scandi-muted leading-relaxed\">\n                    Not at all! Intellichat loads asynchronously and defers loading of non-critical scripts. Vector embeddings are primarily computed and searched on the server, meaning the customer browser won&#8217;t lag while answering queries.\n                <\/p>\n            <\/div>\n            <!-- FAQ Item 2 -->\n            <div class=\"bg-white rounded-xl p-6 border border-scandi-border scandi-shadow\">\n                <h3 class=\"text-lg font-bold text-gray-900 mb-3 flex items-center gap-2\">\n                    \n                    Do I need to know how to code to set this up?\n                <\/h3>\n                <p class=\"text-scandi-muted leading-relaxed\">\n                    Zero coding experience is required! We have an interactive installation wizard built directly into WordPress that guides you through the process of connecting your API and embedding your WordPress pages in less than 5 minutes.\n                <\/p>\n            <\/div>\n            <!-- FAQ Item 3 -->\n            <div class=\"bg-white rounded-xl p-6 border border-scandi-border scandi-shadow\">\n                <h3 class=\"text-lg font-bold text-gray-900 mb-3 flex items-center gap-2\">\n                    \n                    What happens if I go over my website limits?\n                <\/h3>\n                <p class=\"text-scandi-muted leading-relaxed\">\n                    If you exhaust your license limits (e.g. 1 Site or 5 Sites), you will need to upgrade to the corresponding higher plan. Doing so simply prorates the cost, so you only pay the difference.\n                <\/p>\n            <\/div>\n            <!-- FAQ Item 4 -->\n            <div class=\"bg-white rounded-xl p-6 border border-scandi-border scandi-shadow\">\n                <h3 class=\"text-lg font-bold text-gray-900 mb-3 flex items-center gap-2\">\n                    \n                    Can I cancel my subscription?\n                <\/h3>\n                <p class=\"text-scandi-muted leading-relaxed\">\n                    Yes. You&#8217;re never locked in. You can cancel your subscription inside your account dashboad any time, and you&#8217;ll maintain access to Pro features until your billing cycle ends. In your first 14 days, you can request a no-questions-asked refund.\n                <\/p>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/section>\n\n\n<div class=\"skyseo-related-links\"><p><strong>Related content:<\/strong><\/p><ul><li><a href=\"https:\/\/siteskyline.com\/wordpress-hosting\/\">WordPress Hosting.<\/a><\/li><li><a href=\"https:\/\/siteskyline.com\/skyseomanagerpro\/\">SkySEOManager Pro<\/a><\/li><\/ul><\/div>","protected":false},"excerpt":{"rendered":"<p>Trusted by 5,000+ WordPress Sites AI Chatbot For WordPress with RAG &amp; Gemini. Transform your WordPress site with an intelligent AI chatbot that learns from your actual content. Answer visitor questions instantly and accurately without hallucination. Get Intellichat Pro Watch Video Intellichat AI Hi! I&#8217;m trained on this website&#8217;s content. What can I help you [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"full-width-temp.php","meta":{"footnotes":""},"class_list":["post-16859","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/siteskyline.com\/it\/wp-json\/wp\/v2\/pages\/16859","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/siteskyline.com\/it\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/siteskyline.com\/it\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/siteskyline.com\/it\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/siteskyline.com\/it\/wp-json\/wp\/v2\/comments?post=16859"}],"version-history":[{"count":7,"href":"https:\/\/siteskyline.com\/it\/wp-json\/wp\/v2\/pages\/16859\/revisions"}],"predecessor-version":[{"id":16900,"href":"https:\/\/siteskyline.com\/it\/wp-json\/wp\/v2\/pages\/16859\/revisions\/16900"}],"wp:attachment":[{"href":"https:\/\/siteskyline.com\/it\/wp-json\/wp\/v2\/media?parent=16859"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}