{"id":73,"date":"2025-09-27T03:52:43","date_gmt":"2025-09-27T00:52:43","guid":{"rendered":"https:\/\/xn--mkelmkel-0zadbd.fi\/?p=73"},"modified":"2025-09-27T03:52:43","modified_gmt":"2025-09-27T00:52:43","slug":"welcome-to-the-gutenberg-editor","status":"publish","type":"post","link":"https:\/\/xn--mkelmkel-0zadbd.fi\/?p=73","title":{"rendered":"Welcome to the Gutenberg Editor"},"content":{"rendered":"<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n<p><style>\n        \/* Base styling *\/\n        * {\n            margin: 0;\n            padding: 0;\n            box-sizing: border-box;\n            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n        }<\/p>\n<p>        body {\n            background-color: #f5f7fb;\n            color: #333;\n            line-height: 1.6;\n            min-height: 100vh;\n            display: flex;\n            justify-content: center;\n            align-items: center;\n            padding: 20px;\n        }<\/p>\n<p>        \/* Chat container *\/\n        .chat-container {\n            max-width: 100%;\n            width: 500px;\n            height: 80vh;\n            display: flex;\n            flex-direction: column;\n            background: white;\n            box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);\n            border-radius: 15px;\n            overflow: hidden;\n        }<\/p>\n<p>        \/* Header *\/\n        .chat-header {\n            background: linear-gradient(135deg, #003366, #0077b6);\n            color: white;\n            padding: 20px;\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n            border-bottom: 1px solid rgba(255, 255, 255, 0.1);\n        }<\/p>\n<p>        .chat-header h1 {\n            font-size: 18px;\n            font-weight: 600;\n            display: flex;\n            align-items: center;\n            gap: 10px;\n        }<\/p>\n<p>        .logo {\n            font-size: 24px;\n            font-weight: bold;\n        }<\/p>\n<p>        .header-controls {\n            display: flex;\n            gap: 10px;\n            align-items: center;\n        }<\/p>\n<p>        .status-indicator {\n            display: flex;\n            align-items: center;\n            gap: 5px;\n            font-size: 12px;\n            background: rgba(255, 255, 255, 0.2);\n            padding: 4px 8px;\n            border-radius: 15px;\n        }<\/p>\n<p>        .status-dot {\n            width: 8px;\n            height: 8px;\n            border-radius: 50%;\n            background-color: #28a745;\n            animation: pulse 2s infinite;\n        }<\/p>\n<p>        @keyframes pulse {\n            0% { opacity: 1; }\n            50% { opacity: 0.5; }\n            100% { opacity: 1; }\n        }<\/p>\n<p>        \/* Messages area *\/\n        .chat-messages {\n            flex: 1;\n            padding: 20px;\n            overflow-y: auto;\n            background: #f8f9fa;\n            display: flex;\n            flex-direction: column;\n            gap: 15px;\n        }<\/p>\n<p>        .message {\n            max-width: 80%;\n            padding: 12px 16px;\n            border-radius: 18px;\n            position: relative;\n            line-height: 1.4;\n            word-wrap: break-word;\n            box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);\n        }<\/p>\n<p>        .message.bot {\n            align-self: flex-start;\n            background: white;\n            color: #333;\n            border-bottom-left-radius: 4px;\n        }<\/p>\n<p>        .message.user {\n            align-self: flex-end;\n            background: #0077b6;\n            color: white;\n            border-bottom-right-radius: 4px;\n        }<\/p>\n<p>        .message-time {\n            font-size: 11px;\n            opacity: 0.7;\n            margin-top: 5px;\n            text-align: right;\n        }<\/p>\n<p>        \/* Typing indicator *\/\n        .typing-indicator {\n            display: none;\n            padding: 10px;\n            color: #666;\n            font-style: italic;\n        }<\/p>\n<p>        .typing-dots {\n            display: inline-block;\n        }<\/p>\n<p>        .typing-dots::after {\n            content: '...';\n            animation: dots 1.5s steps(5, end) infinite;\n        }<\/p>\n<p>        @keyframes dots {\n            0%, 20% { content: '.'; }\n            40% { content: '..'; }\n            60% { content: '...'; }\n        }<\/p>\n<p>        \/* Input area *\/\n        .chat-input-area {\n            padding: 15px;\n            border-top: 1px solid #e9ecef;\n            display: flex;\n            flex-direction: column;\n            gap: 10px;\n            background: white;\n        }<\/p>\n<p>        .chat-input {\n            flex: 1;\n            padding: 12px 15px;\n            border: 1px solid #ddd;\n            border-radius: 20px;\n            outline: none;\n            font-size: 14px;\n            resize: none;\n            min-height: 44px;\n            max-height: 120px;\n            transition: border-color 0.3s;\n        }<\/p>\n<p>        .chat-input:focus {\n            border-color: #0077b6;\n        }<\/p>\n<p>        .chat-controls {\n            display: flex;\n            justify-content: space-between;\n            align-items: center;\n        }<\/p>\n<p>        .quick-replies {\n            display: flex;\n            flex-wrap: wrap;\n            gap: 8px;\n            margin-bottom: 10px;\n        }<\/p>\n<p>        .quick-reply-btn {\n            background: #e9ecef;\n            color: #333;\n            border: none;\n            padding: 8px 12px;\n            border-radius: 15px;\n            cursor: pointer;\n            font-size: 12px;\n            transition: all 0.3s;\n        }<\/p>\n<p>        .quick-reply-btn:hover {\n            background: #0077b6;\n            color: white;\n        }<\/p>\n<p>        .action-buttons {\n            display: flex;\n            gap: 10px;\n        }<\/p>\n<p>        .send-btn, .admin-btn {\n            background: #0077b6;\n            color: white;\n            border: none;\n            padding: 10px 20px;\n            border-radius: 20px;\n            cursor: pointer;\n            font-size: 14px;\n            display: flex;\n            align-items: center;\n            gap: 5px;\n            transition: background 0.3s;\n        }<\/p>\n<p>        .send-btn:hover, .admin-btn:hover {\n            background: #005a8b;\n        }<\/p>\n<p>        .lang-toggle {\n            background: #f8f9fa;\n            border: 1px solid #ddd;\n            padding: 8px 12px;\n            border-radius: 15px;\n            cursor: pointer;\n            font-size: 12px;\n            transition: all 0.3s;\n        }<\/p>\n<p>        .lang-toggle:hover {\n            background: #e9ecef;\n        }<\/p>\n<p>        \/* Admin panel *\/\n        .admin-panel {\n            display: none;\n            position: fixed;\n            top: 50%;\n            left: 50%;\n            transform: translate(-50%, -50%);\n            background: white;\n            padding: 25px;\n            border-radius: 15px;\n            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);\n            width: 90%;\n            max-width: 400px;\n            z-index: 1000;\n        }<\/p>\n<p>        .admin-overlay {\n            display: none;\n            position: fixed;\n            top: 0;\n            left: 0;\n            width: 100%;\n            height: 100%;\n            background: rgba(0, 0, 0, 0.5);\n            z-index: 999;\n        }<\/p>\n<p>        .admin-panel h3 {\n            margin-bottom: 15px;\n            font-size: 16px;\n            font-weight: 600;\n            color: #0077b6;\n        }<\/p>\n<p>        .admin-notification {\n            background: #f8f9fa;\n            padding: 15px;\n            border-radius: 8px;\n            margin-bottom: 15px;\n            border-left: 4px solid #0077b6;\n        }<\/p>\n<p>        .notification-form {\n            display: flex;\n            flex-direction: column;\n            gap: 10px;\n        }<\/p>\n<p>        .notification-form input {\n            padding: 10px;\n            border: 1px solid #ddd;\n            border-radius: 5px;\n            font-size: 14px;\n        }<\/p>\n<p>        .notification-form button {\n            background: #28a745;\n            color: white;\n            border: none;\n            padding: 10px;\n            border-radius: 5px;\n            cursor: pointer;\n            transition: background 0.3s;\n        }<\/p>\n<p>        .notification-form button:hover {\n            background: #218838;\n        }<\/p>\n<p>        .admin-close {\n            position: absolute;\n            top: 15px;\n            right: 15px;\n            background: none;\n            border: none;\n            font-size: 20px;\n            cursor: pointer;\n            color: #666;\n        }<\/p>\n<p>        \/* Animation for new messages *\/\n        @keyframes fadeIn {\n            from { opacity: 0; transform: translateY(10px); }\n            to { opacity: 1; transform: translateY(0); }\n        }<\/p>\n<p>        .message {\n            animation: fadeIn 0.3s ease-out;\n        }<\/p>\n<p>        \/* Responsive styles *\/\n        @media (max-width: 480px) {\n            .chat-container {\n                height: 90vh;\n                border-radius: 0;\n            }<\/p>\n<p>            body {\n                padding: 0;\n            }<\/p>\n<p>            .chat-header h1 {\n                font-size: 16px;\n            }<\/p>\n<p>            .message {\n                max-width: 85%;\n            }\n        }\n    <\/style>\n<\/p>\n<div class=\"chat-container\">\n<div class=\"chat-header\">\n<h1><span class=\"logo\">M\u00c4KEL\u00c4<\/span> Asiakaspalveluchatti<\/h1>\n<div class=\"header-controls\">\n<div class=\"status-indicator\">\n<div class=\"status-dot\">\u00a0<\/div>\n<p><span id=\"statusText\">Vastaanotettavissa<\/span><\/div>\n<p><button id=\"langToggle\" class=\"lang-toggle\">EN<\/button> <button class=\"admin-btn\">\ud83d\udd27 Yll\u00e4pito<\/button><\/div>\n<\/div>\n<div id=\"chatMessages\" class=\"chat-messages\"><!-- Messages will be added here --><\/div>\n<div id=\"typingIndicator\" class=\"typing-indicator\"><span id=\"typingText\" class=\"typing-dots\">Asiakaspalvelija kirjoittaa<\/span><\/div>\n<div class=\"chat-input-area\">\n<div id=\"quickReplies\" class=\"quick-replies\"><!-- Quick replies will be added here --><\/div>\n<p><textarea id=\"chatInput\" class=\"chat-input\" rows=\"1\" placeholder=\"Kirjoita viestisi...\"><\/textarea><\/p>\n<div class=\"chat-controls\">\n<div class=\"action-buttons\"><button class=\"send-btn\"> <span id=\"sendText\">L\u00e4het\u00e4<\/span> \u27a4 <\/button><\/div>\n<\/div>\n<\/div>\n<\/div>\n<div id=\"adminOverlay\" class=\"admin-overlay\">\u00a0<\/div>\n<div id=\"adminPanel\" class=\"admin-panel\"><button class=\"admin-close\">\u00d7<\/button><\/p>\n<h3 id=\"adminTitle\">Yll\u00e4pidon asetukset<\/h3>\n<div class=\"admin-notification\">\n<h4 id=\"notificationTitle\">Ilmoitusasetukset<\/h4>\n<div class=\"notification-form\"><input id=\"adminEmail\" type=\"email\" value=\"jobmakelat@gmail.com\" placeholder=\"S\u00e4hk\u00f6postiosoite ilmoituksille\" \/> <button id=\"saveEmailText\">Tallenna s\u00e4hk\u00f6posti<\/button><\/div>\n<\/div>\n<div class=\"admin-notification\">\n<h4 id=\"testTitle\">Testaa ilmoitukset<\/h4>\n<div class=\"notification-form\"><button id=\"testText\">L\u00e4het\u00e4 testi-ilmoitus<\/button><\/div>\n<\/div>\n<\/div>\n<p><script>\n        \/\/ Language management\n        let currentLang = 'fi';<\/p>\n<p>        \/\/ Try to detect language based on browser or domain\n        function detectLanguage() {\n            const browserLang = navigator.language || navigator.userLanguage;\n            if (browserLang.startsWith('fi')) {\n                return 'fi';\n            }\n            return 'en';\n        }<\/p>\n<p>        const translations = {\n            fi: {\n                title: \"M\u00e4kel\u00e4 M\u00e4kel\u00e4 - Asiakaspalveluchatti\",\n                welcome: \"Hei! Tervetuloa M\u00e4kel\u00e4 M\u00e4kel\u00e4n asiakaspalveluun. Kuinka voimme auttaa sinua t\u00e4n\u00e4\u00e4n?\",\n                placeholder: \"Kirjoita viestisi...\",\n                send: \"L\u00e4het\u00e4\",\n                typing: \"Asiakaspalvelija kirjoittaa\",\n                status: \"Vastaanotettavissa\",\n                adminTitle: \"Yll\u00e4pidon asetukset\",\n                notificationTitle: \"Ilmoitusasetukset\",\n                saveEmailText: \"Tallenna s\u00e4hk\u00f6posti\",\n                testTitle: \"Testaa ilmoitukset\",\n                testText: \"L\u00e4het\u00e4 testi-ilmoitus\",\n                quickReplies: [\"Tietoa yrityksest\u00e4\", \"Aukioloajat\", \"Yhteystiedot\", \"Varaa aika\"],\n                quickResponses: {\n                    \"Tietoa yrityksest\u00e4\": \"M\u00e4kel\u00e4 M\u00e4kel\u00e4 on suomalainen perheyritys, joka on tarjonnut laadukkaita palveluja yli 30 vuoden ajan. Olemme erikoistuneet asiakastyytyv\u00e4isyyteen ja luotettavuuteen.\",\n                    \"Aukioloajat\": \"Aukioloajat: Ma-Pe 8-18, La 10-16, Su suljettu. Juhlapyhin\u00e4 eri aukioloajat, tarkista nettisivuiltamme m\u00e4kel\u00e4m\u00e4kel\u00e4.fi.\",\n                    \"Yhteystiedot\": \"S\u00e4hk\u00f6posti: info@makelamakela.fi\\nPuhelin: 09 123 4567\\nOsoite: M\u00e4kel\u00e4katu 1, 00100 Helsinki\",\n                    \"Varaa aika\": \"Ajanvaraukseen voit k\u00e4ytt\u00e4\u00e4 verkkopalveluamme m\u00e4kel\u00e4m\u00e4kel\u00e4.fi, soittaa meille tai j\u00e4tt\u00e4\u00e4 yhteystietosi ja palvelemme sinua mahdollisimman pian.\"\n                },\n                humanResponse: \"Yhdist\u00e4n sinut nyt asiakaspalvelijaan. Ole hyv\u00e4 ja odota hetki. Samalla l\u00e4het\u00e4mme ilmoituksen tiimillemme.\",\n                notificationSent: \"Ilmoitus l\u00e4hetetty yll\u00e4pit\u00e4jille.\",\n                settingsSaved: \"Asetukset tallennettu!\",\n                emailSaved: \"S\u00e4hk\u00f6posti tallennettu ilmoituksia varten.\",\n                testNotificationSent: \"Testi-ilmoitus l\u00e4hetetty onnistuneesti!\"\n            },\n            en: {\n                title: \"M\u00e4kel\u00e4 M\u00e4kel\u00e4 - Customer Service Chat\",\n                welcome: \"Hello! Welcome to M\u00e4kel\u00e4 M\u00e4kel\u00e4 customer service. How can we help you today?\",\n                placeholder: \"Type your message...\",\n                send: \"Send\",\n                typing: \"Customer service is typing\",\n                status: \"Available\",\n                adminTitle: \"Admin Settings\",\n                notificationTitle: \"Notification Settings\",\n                saveEmailText: \"Save email\",\n                testTitle: \"Test Notifications\",\n                testText: \"Send test notification\",\n                quickReplies: [\"About us\", \"Opening hours\", \"Contact info\", \"Schedule appointment\"],\n                quickResponses: {\n                    \"About us\": \"M\u00e4kel\u00e4 M\u00e4kel\u00e4 is a Finnish family business that has provided quality services for over 30 years. We specialize in customer satisfaction and reliability.\",\n                    \"Opening hours\": \"Opening hours: Mon-Fri 8am-6pm, Sat 10am-4pm, Sun closed. Different hours on holidays, check our website m\u00e4kel\u00e4m\u00e4kel\u00e4.fi.\",\n                    \"Contact info\": \"Email: info@makelamakela.fi\\nPhone: +358 9 123 4567\\nAddress: M\u00e4kel\u00e4katu 1, 00100 Helsinki\",\n                    \"Schedule appointment\": \"To schedule an appointment, you can use our online service at m\u00e4kel\u00e4m\u00e4kel\u00e4.fi, call us, or leave your contact details and we'll assist you as soon as possible.\"\n                },\n                humanResponse: \"Connecting you to a customer service agent now. Please wait a moment. We'll also send a notification to our team.\",\n                notificationSent: \"Notification sent to admins.\",\n                settingsSaved: \"Settings saved!\",\n                emailSaved: \"Email saved for notifications.\",\n                testNotificationSent: \"Test notification sent successfully!\"\n            }\n        };<\/p>\n<p>        \/\/ DOM elements\n        const chatMessages = document.getElementById('chatMessages');\n        const chatInput = document.getElementById('chatInput');\n        const typingIndicator = document.getElementById('typingIndicator');\n        const quickReplies = document.getElementById('quickReplies');\n        const chatTitle = document.querySelector('.chat-header h1');\n        const typingText = document.getElementById('typingText');\n        const statusText = document.getElementById('statusText');\n        const sendText = document.getElementById('sendText');\n        const adminPanel = document.getElementById('adminPanel');\n        const adminOverlay = document.getElementById('adminOverlay');\n        const adminTitle = document.getElementById('adminTitle');\n        const notificationTitle = document.getElementById('notificationTitle');\n        const saveEmailText = document.getElementById('saveEmailText');\n        const testTitle = document.getElementById('testTitle');\n        const testText = document.getElementById('testText');\n        const adminEmail = document.getElementById('adminEmail');<\/p>\n<p>        \/\/ Initialize\n        function init() {\n            currentLang = detectLanguage();\n            updateLanguage();\n            addMessage('bot', translations[currentLang].welcome);\n            setupQuickReplies();\n            loadAdminSettings();\n            setupInputHandling();<\/p>\n<p>            \/\/ Set default admin email\n            if (!localStorage.getItem('adminEmail')) {\n                adminEmail.value = 'jobmakelat@gmail.com';\n                saveAdminEmail();\n            }\n        }<\/p>\n<p>        \/\/ Language switching\n        function switchLanguage() {\n            currentLang = currentLang === 'fi' ? 'en' : 'fi';\n            updateLanguage();\n            addMessage('bot', currentLang === 'fi' ? \n                \"Kieli vaihdettu suomeksi.\" : \"Language switched to English.\");\n        }<\/p>\n<p>        function updateLanguage() {\n            const lang = translations[currentLang];\n            chatTitle.innerHTML = `<span class=\"logo\">M\u00c4KEL\u00c4<\/span> ${lang.title.split(' - ')[1]}`;\n            chatInput.placeholder = lang.placeholder;\n            sendText.textContent = lang.send;\n            typingText.textContent = lang.typing;\n            statusText.textContent = lang.status;\n            document.getElementById('langToggle').textContent = currentLang === 'fi' ? 'EN' : 'FI';<\/p>\n<p>            adminTitle.textContent = lang.adminTitle;\n            notificationTitle.textContent = lang.notificationTitle;\n            saveEmailText.textContent = lang.saveEmailText;\n            testTitle.textContent = lang.testTitle;\n            testText.textContent = lang.testText;<\/p>\n<p>            setupQuickReplies();\n        }<\/p>\n<p>        \/\/ Quick replies\n        function setupQuickReplies() {\n            quickReplies.innerHTML = '';\n            translations[currentLang].quickReplies.forEach(option => {\n                const btn = document.createElement('button');\n                btn.className = 'quick-reply-btn';\n                btn.textContent = option;\n                btn.onclick = () => sendQuickReply(option);\n                quickReplies.appendChild(btn);\n            });\n        }<\/p>\n<p>        function sendQuickReply(replyText) {\n            addMessage('user', replyText);<\/p>\n<p>            if (replyText === translations[currentLang].quickReplies[3]) {\n                \/\/ \"Varaa aika\" or \"Schedule appointment\"\n                simulateTyping();\n                setTimeout(() => {\n                    addMessage('bot', translations[currentLang].humanResponse);\n                    sendAdminNotification(\"Asiakas haluaa varata ajan: \" + replyText);\n                }, 2000);\n            } else {\n                simulateTyping();\n                setTimeout(() => {\n                    addMessage('bot', translations[currentLang].quickResponses[replyText]);\n                }, 1500);\n            }\n        }<\/p>\n<p>        \/\/ Messaging\n        function addMessage(sender, content) {\n            const messageDiv = document.createElement('div');\n            messageDiv.className = `message ${sender}`;<\/p>\n<p>            const time = new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });\n            messageDiv.innerHTML = `<\/p>\n<div>${content}<\/div>\n<div class=\"message-time\">${time}<\/div>\n<p>            `;<\/p>\n<p>            chatMessages.appendChild(messageDiv);\n            chatMessages.scrollTop = chatMessages.scrollHeight;\n        }<\/p>\n<p>        function simulateTyping() {\n            typingIndicator.style.display = 'block';\n            chatMessages.scrollTop = chatMessages.scrollHeight;<\/p>\n<p>            setTimeout(() => {\n                typingIndicator.style.display = 'none';\n            }, 1500);\n        }<\/p>\n<p>        function sendMessage() {\n            const message = chatInput.value.trim();\n            if (message) {\n                addMessage('user', message);\n                chatInput.value = '';<\/p>\n<p>                simulateTyping();\n                setTimeout(() => {\n                    handleBotResponse(message);\n                }, 1500);\n            }\n        }<\/p>\n<p>        function handleBotResponse(userMessage) {\n            \/\/ Simple response logic\n            const lowerMessage = userMessage.toLowerCase();\n            let response = \"\";<\/p>\n<p>            if (lowerMessage.includes('kiitos') || lowerMessage.includes('thank')) {\n                response = currentLang === 'fi' ? \n                    \"Ole hyv\u00e4! Voinko auttaa viel\u00e4 jollain muulla?\" : \n                    \"You're welcome! Can I help with anything else?\";\n            } else if (lowerMessage.includes('hinta') || lowerMessage.includes('price')) {\n                response = currentLang === 'fi' ? \n                    \"Hinnat vaihtelevat palvelun mukaan. Voit l\u00e4hett\u00e4\u00e4 meille kyselyn osoitteeseen info@makelamakela.fi, niin tarraamme henkil\u00f6kohtaisen tarjouksen.\" : \n                    \"Prices vary by service. You can send us an inquiry at info@makelamakela.fi for a personalized quote.\";\n            } else {\n                response = currentLang === 'fi' ?\n                    \"Kiitos viestist\u00e4si. Yhdist\u00e4n sinut nyt asiakaspalvelijaan, joka voi auttaa paremmin.\" :\n                    \"Thank you for your message. I'm connecting you to a customer service agent who can assist you better.\";<\/p>\n<p>                \/\/ Send notification for handoff to human\n                sendAdminNotification(\"Asiakas tarvitsee apua: \" + userMessage);\n            }<\/p>\n<p>            addMessage('bot', response);\n        }<\/p>\n<p>        \/\/ Admin notification system\n        function sendAdminNotification(message) {\n            const adminEmail = localStorage.getItem('adminEmail') || 'jobmakelat@gmail.com';<\/p>\n<p>            \/\/ In a real implementation, you would send this to your backend\n            \/\/ This is a simulation that logs to console\n            console.log(\"Sending notification to:\", adminEmail);\n            console.log(\"Message:\", message);\n            console.log(\"Timestamp:\", new Date().toLocaleString('fi-FI'));<\/p>\n<p>            \/\/ Simulate API call\n            simulateAPICall(adminEmail, message)\n                .then(() => {\n                    addMessage('bot', translations[currentLang].notificationSent);\n                })\n                .catch(error => {\n                    console.error(\"Notification error:\", error);\n                });\n        }<\/p>\n<p>        function simulateAPICall(email, message) {\n            return new Promise((resolve) => {\n                setTimeout(() => {\n                    console.log(\"Notification API: Message sent successfully\");\n                    resolve();\n                }, 500);\n            });\n        }<\/p>\n<p>        function testNotification() {\n            sendAdminNotification(\"T\u00e4m\u00e4 on testi-ilmoitus M\u00e4kel\u00e4 M\u00e4kel\u00e4 -chatista\");\n            addMessage('bot', translations[currentLang].testNotificationSent);\n            hideAdminPanel();\n        }<\/p>\n<p>        function saveAdminEmail() {\n            const email = adminEmail.value;\n            if (email) {\n                localStorage.setItem('adminEmail', email);\n                addMessage('bot', translations[currentLang].emailSaved);\n                hideAdminPanel();\n            }\n        }<\/p>\n<p>        function loadAdminSettings() {\n            const savedEmail = localStorage.getItem('adminEmail');\n            if (savedEmail) {\n                adminEmail.value = savedEmail;\n            }\n        }<\/p>\n<p>        \/\/ Admin panel\n        function showAdminPanel() {\n            adminPanel.style.display = 'block';\n            adminOverlay.style.display = 'block';\n        }<\/p>\n<p>        function hideAdminPanel() {\n            adminPanel.style.display = 'none';\n            adminOverlay.style.display = 'none';\n        }<\/p>\n<p>        \/\/ Input handling\n        function setupInputHandling() {\n            chatInput.addEventListener('keypress', function(e) {\n                if (e.key === 'Enter' && !e.shiftKey) {\n                    e.preventDefault();\n                    sendMessage();\n                }\n            });<\/p>\n<p>            \/\/ Auto-resize textarea\n            chatInput.addEventListener('input', function() {\n                this.style.height = 'auto';\n                this.style.height = (this.scrollHeight) + 'px';\n            });\n        }<\/p>\n<p>        \/\/ Initialize the chat\n        window.onload = init;\n    <\/script><\/p>\n","protected":false},"excerpt":{"rendered":"<p>&nbsp; &nbsp; M\u00c4KEL\u00c4 Asiakaspalveluchatti \u00a0 Vastaanotettavissa EN \ud83d\udd27 Yll\u00e4pito Asiakaspalvelija kirjoittaa L\u00e4het\u00e4 \u27a4 \u00a0 \u00d7 Yll\u00e4pidon asetukset Ilmoitusasetukset Tallenna s\u00e4hk\u00f6posti Testaa ilmoitukset L\u00e4het\u00e4 testi-ilmoitus<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-73","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"aioseo_notices":[],"acf":[],"_links":{"self":[{"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=\/wp\/v2\/posts\/73","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=73"}],"version-history":[{"count":1,"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=\/wp\/v2\/posts\/73\/revisions"}],"predecessor-version":[{"id":78,"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=\/wp\/v2\/posts\/73\/revisions\/78"}],"wp:attachment":[{"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=73"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=73"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/xn--mkelmkel-0zadbd.fi\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=73"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}<br />
<b>Notice</b>:  ob_end_flush(): Failed to send buffer of zlib output compression (1) in <b>/home/mkelmkel/public_html/wp-includes/functions.php</b> on line <b>5493</b><br />
<br />
<b>Notice</b>:  ob_end_flush(): Failed to send buffer of zlib output compression (1) in <b>/home/mkelmkel/public_html/wp-includes/functions.php</b> on line <b>5493</b><br />
<br />
<b>Notice</b>:  ob_end_flush(): Failed to send buffer of zlib output compression (1) in <b>/home/mkelmkel/public_html/wp-content/plugins/wpconsent-cookies-banner-privacy-suite/includes/class-wpconsent-cookie-blocking.php</b> on line <b>67</b><br />
<br />
<b>Notice</b>:  ob_end_flush(): Failed to send buffer of zlib output compression (1) in <b>/home/mkelmkel/public_html/wp-includes/functions.php</b> on line <b>5493</b><br />
<br />
<b>Notice</b>:  ob_end_flush(): Failed to send buffer of zlib output compression (1) in <b>/home/mkelmkel/public_html/wp-includes/functions.php</b> on line <b>5493</b><br />