{"id":10386,"date":"2025-06-21T18:58:35","date_gmt":"2025-06-21T17:58:35","guid":{"rendered":"https:\/\/stevepedwards.today\/DebianAdmin\/?p=10386"},"modified":"2025-06-21T19:39:02","modified_gmt":"2025-06-21T18:39:02","slug":"building-a-voice-activated-ai-chatbot-for-wordpress-using-local-llms","status":"publish","type":"post","link":"https:\/\/stevepedwards.today\/DebianAdmin\/building-a-voice-activated-ai-chatbot-for-wordpress-using-local-llms\/","title":{"rendered":"Building a Voice-Activated AI Chatbot for WordPress using Local LLMs"},"content":{"rendered":"
<\/div>\n

<\/path><\/svg><\/i> \"Loading\"<\/p>\n

<\/div>\n

Project Summary: Voice-Activated AI Chatbot for WordPress using Local LLMs<\/span><\/h1>\n

Project Goal:<\/span><\/strong> To build and integrate a voice-activated search feature into a WordPress site, leveraging local Large Language Models (LLMs) and Retrieval Augmented Generation (RAG) to provide contextual answers from the site's own content.<\/span><\/p>\n

I. Key Technologies & Tools Utilized:<\/span><\/strong><\/h3>\n
    \n
  • Operating System:<\/span><\/strong> Windows 11 (Host) with WSL2 (Ubuntu 24.04 LTS)<\/span><\/li>\n
  • Web Stack:<\/span><\/strong> Apache2, MySQL, WordPress (PHP)<\/span><\/li>\n
  • Local LLM Infrastructure:<\/span><\/strong> Ollama (Models: Llama 3, Mistral, Phi-3)<\/span><\/li>\n
  • Languages:<\/span><\/strong> PHP, JavaScript, Python<\/span><\/li>\n
  • Python Libraries:<\/span><\/strong> Flask, Flask-CORS, LangChain Community, LangChain Text Splitters, Scikit-learn, NumPy<\/span><\/li>\n
  • Linux Utilities:<\/span><\/strong> sudo<\/span><\/code>, <\/span>apt<\/span><\/code>, <\/span>vi<\/span><\/code>, <\/span>tree<\/span><\/code>, <\/span>nmap<\/span><\/code>, <\/span>ps<\/span><\/code>, <\/span>apachectl<\/span><\/code>, <\/span>systemctl<\/span><\/code>, <\/span>grep<\/span><\/code>, <\/span>chmod<\/span><\/code>, <\/span>chown<\/span><\/code>, <\/span>openssl<\/span><\/code>, <\/span>wsl<\/span><\/code><\/li>\n<\/ul>\n

    II. Core Components Developed & Configured:<\/span><\/strong><\/h3>\n
      \n
    1. WordPress Voice Search Plugin (Frontend):<\/span><\/strong>\n
        \n
      • Implemented a voice activation UI (microphone icon).<\/span><\/li>\n
      • Used <\/span>Web Speech API<\/span><\/strong> for browser-based Speech-to-Text.<\/span><\/li>\n
      • Configured JavaScript <\/span>fetch<\/span><\/code> API to send queries to a custom Python backend.<\/span><\/li>\n<\/ul>\n<\/li>\n
      • WordPress & Apache Web Server Setup:<\/span><\/strong>\n
          \n
        • Configured Apache2 to serve WordPress from a subdirectory (<\/span>\/DebianAdmin<\/span><\/code>) via HTTP.<\/span><\/li>\n
        • Enabled critical Apache modules (<\/span>mod_php<\/span><\/code>, <\/span>mod_rewrite<\/span><\/code>, <\/span>mod_alias<\/span><\/code>).<\/span><\/li>\n
        • Managed Apache Virtual Hosts (<\/span>wordpress.conf<\/span><\/code>) for correct site routing.<\/span><\/li>\n
        • Configured <\/span>wp-config.php<\/span><\/code> for database and site URLs.<\/span><\/li>\n
        • Implemented a <\/span>chrome:\/\/flags<\/span><\/code> workaround<\/span><\/strong> to enable microphone access on non-HTTPS custom hostnames (<\/span>https:\/\/stevepedwards.today<\/span><\/code>).<\/span><\/li>\n<\/ul>\n<\/li>\n
        • Local LLM Backend Server (Python Flask API):<\/span><\/strong>\n
            \n
          • Developed <\/span>rag_api_server.py<\/span><\/code> as a Flask web server, acting as middleware.<\/span><\/li>\n
          • Enabled <\/span>Cross-Origin Resource Sharing (CORS)<\/span><\/strong> for secure browser-to-server communication.<\/span><\/li>\n
          • Exposed a <\/span>\/ask<\/span><\/code> API endpoint for handling queries.<\/span><\/li>\n<\/ul>\n<\/li>\n
          • Retrieval Augmented Generation (RAG) Pipeline:<\/span><\/strong>\n
              \n
            • Content Extraction:<\/span><\/strong> Scripted <\/span>extract_text.py<\/span><\/code> to parse WordPress XML export, clean HTML, and save content as plain text files.<\/span><\/li>\n
            • Text Chunking:<\/span><\/strong> Used <\/span>langchain_text_splitters<\/span><\/code> to segment documents for LLM context.<\/span><\/li>\n
            • Embedding Generation:<\/span><\/strong> Developed <\/span>create_embeddings.py<\/span><\/code> to convert text chunks into numerical <\/span>Phi-3 vector embeddings<\/span><\/strong> using Ollama, saving them persistently in <\/span>vector_store.json<\/span><\/code>.<\/span><\/li>\n
            • Semantic Search:<\/span><\/strong> Utilized <\/span>scikit-learn<\/span><\/code> (cosine similarity) to retrieve top <\/span>k<\/span><\/code> most relevant content chunks based on user query embeddings.<\/span><\/li>\n
            • LLM Inference:<\/span><\/strong> Integrated with Ollama via <\/span>langchain_community<\/span><\/code> to pass retrieved context and the user's query to the <\/span>Phi-3 LLM<\/span><\/strong> for generating answers, ensuring responses are based <\/span>only<\/span><\/em> on provided content.<\/span><\/li>\n<\/ul>\n<\/li>\n<\/ol>\n

              III. Key Concepts Learned & Expertise Demonstrated:<\/span><\/strong><\/h3>\n