{"id":835,"date":"2026-05-16T17:54:39","date_gmt":"2026-05-16T17:54:39","guid":{"rendered":"https:\/\/xtremehdiptve.io\/?page_id=835"},"modified":"2026-05-17T20:08:32","modified_gmt":"2026-05-17T20:08:32","slug":"m3u-to-xtream","status":"publish","type":"page","link":"https:\/\/xtremehdiptve.io\/xtreme\/m3u-to-xtream\/","title":{"rendered":"M3u to Xtream"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"835\" class=\"elementor elementor-835\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2fc7d49 e-con-full e-flex e-con e-parent\" data-id=\"2fc7d49\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;ekit_has_onepagescroll_dot&quot;:&quot;yes&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-61c9f71 elementor-widget elementor-widget-html\" data-id=\"61c9f71\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;ekit_we_effect_on&quot;:&quot;none&quot;}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>M3U to Xtream Codes Converter<\/title>\r\n    <style>\r\n        \/* \r\n         ============================================\r\n         Base Styles & Scoped Container\r\n         ============================================\r\n        *\/\r\n        :root {\r\n            --m3u-bg-light: #f3f4f6;\r\n            --m3u-bg-dark: #111827;\r\n            --m3u-card-bg-light: #ffffff;\r\n            --m3u-card-bg-dark: #1f2937;\r\n            --m3u-text-light: #1f2937;\r\n            --m3u-text-dark: #d1d5db;\r\n            --m3u-text-muted-light: #6b7280;\r\n            --m3u-text-muted-dark: #9ca3af;\r\n            --m3u-border-light: #e5e7eb;\r\n            --m3u-border-dark: #4b5563;\r\n            --m3u-input-bg-light: #ffffff;\r\n            --m3u-input-bg-dark: #374151;\r\n            --m3u-blue: #3b82f6;\r\n            --m3u-blue-hover: #2563eb;\r\n            --m3u-green: #10b981;\r\n            --m3u-red: #ef4444;\r\n            --m3u-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);\r\n        }\r\n\r\n        html, body {\r\n            margin: 0;\r\n            padding: 0;\r\n            width: 100%;\r\n            scroll-behavior: smooth;\r\n        }\r\n\r\n        #m3u-converter-app {\r\n            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';\r\n            background-color: var(--m3u-bg-light);\r\n            color: var(--m3u-text-light);\r\n            box-sizing: border-box;\r\n            transition: background-color 0.3s, color 0.3s;\r\n            line-height: 1.5;\r\n            \r\n            \/* Center content and ensure full viewport coverage *\/\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n            min-height: 100vh;\r\n            padding: 1rem;\r\n        }\r\n\r\n        #m3u-converter-app.dark {\r\n            background-color: var(--m3u-bg-dark);\r\n            color: var(--m3u-text-dark);\r\n        }\r\n        \r\n        #m3u-converter-app * {\r\n            box-sizing: border-box;\r\n        }\r\n\r\n        #m3u-converter-app .m3u-container {\r\n            max-width: 36rem;\r\n            width: 100%;\r\n            margin: 0 auto;\r\n            position: relative;\r\n        }\r\n\r\n        \/* \r\n         ============================================\r\n         Typography & Header\r\n         ============================================\r\n        *\/\r\n        #m3u-converter-app h1, #m3u-converter-app h2, #m3u-converter-app h3 {\r\n            margin: 0;\r\n            font-weight: 700;\r\n        }\r\n\r\n        #m3u-converter-app .m3u-header {\r\n            text-align: center;\r\n            margin-bottom: 2rem;\r\n        }\r\n\r\n        #m3u-converter-app .m3u-header h1 {\r\n            font-size: 1.875rem; \/* 30px *\/\r\n            line-height: 2.25rem;\r\n            letter-spacing: -0.025em;\r\n            color: var(--m3u-text-light);\r\n        }\r\n\r\n        #m3u-converter-app.dark .m3u-header h1 {\r\n            color: #f9fafb;\r\n        }\r\n\r\n        #m3u-converter-app .m3u-header p {\r\n            margin-top: 0.5rem;\r\n            color: var(--m3u-text-muted-light);\r\n        }\r\n        \r\n        #m3u-converter-app.dark .m3u-header p {\r\n             color: var(--m3u-text-muted-dark);\r\n        }\r\n\r\n        \/* \r\n         ============================================\r\n         Card & Section Styles\r\n         ============================================\r\n        *\/\r\n        #m3u-converter-app .m3u-card {\r\n            background-color: var(--m3u-card-bg-light);\r\n            border-radius: 1rem;\r\n            padding: 2rem;\r\n            box-shadow: var(--m3u-shadow);\r\n            margin-top: 2rem;\r\n            transition: background-color 0.3s;\r\n        }\r\n        \r\n        #m3u-converter-app.dark .m3u-card {\r\n            background-color: var(--m3u-card-bg-dark);\r\n        }\r\n        \r\n        #m3u-converter-app .m3u-card h2 {\r\n            font-size: 1.5rem;\r\n            color: var(--m3u-text-light);\r\n            margin-bottom: 1.5rem;\r\n            padding-bottom: 0.75rem;\r\n            border-bottom: 1px solid var(--m3u-border-light);\r\n        }\r\n\r\n        #m3u-converter-app.dark .m3u-card h2 {\r\n            color: #f9fafb;\r\n            border-bottom-color: var(--m3u-border-dark);\r\n        }\r\n\r\n        \/* \r\n         ============================================\r\n         Form Elements\r\n         ============================================\r\n        *\/\r\n        #m3u-converter-app .m3u-form-group {\r\n            margin-bottom: 1.25rem;\r\n        }\r\n        \r\n        #m3u-converter-app label {\r\n            display: block;\r\n            font-size: 0.875rem;\r\n            font-weight: 600;\r\n            margin-bottom: 0.25rem;\r\n            color: var(--m3u-text-muted-light);\r\n        }\r\n\r\n        #m3u-converter-app.dark label {\r\n             color: var(--m3u-text-muted-dark);\r\n        }\r\n\r\n        #m3u-converter-app input[type=\"text\"] {\r\n            width: 100%;\r\n            padding: 0.75rem 1rem;\r\n            border: 1px solid var(--m3u-border-light);\r\n            border-radius: 0.5rem;\r\n            background-color: var(--m3u-input-bg-light);\r\n            color: var(--m3u-text-light);\r\n            transition: border-color 0.3s, background-color 0.3s, box-shadow 0.3s;\r\n        }\r\n        \r\n        #m3u-converter-app.dark input[type=\"text\"] {\r\n            border-color: var(--m3u-border-dark);\r\n            background-color: var(--m3u-input-bg-dark);\r\n            color: #f9fafb;\r\n        }\r\n\r\n        #m3u-converter-app input[type=\"text\"]:focus {\r\n            outline: none;\r\n            border-color: var(--m3u-blue);\r\n            box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.5);\r\n        }\r\n        \r\n        \/* \r\n         ============================================\r\n         Buttons\r\n         ============================================\r\n        *\/\r\n        #m3u-converter-app .m3u-button {\r\n            width: 100%;\r\n            padding: 0.85rem 1rem;\r\n            font-weight: 700;\r\n            color: #ffffff;\r\n            border: none;\r\n            border-radius: 0.5rem;\r\n            cursor: pointer;\r\n            transition: background-color 0.3s, transform 0.2s;\r\n            background-color: var(--m3u-blue);\r\n            margin-top: 1rem;\r\n        }\r\n        \r\n        #m3u-converter-app .m3u-button:hover {\r\n            background-color: var(--m3u-blue-hover);\r\n            transform: scale(1.02);\r\n        }\r\n\r\n        #m3u-converter-app .m3u-button.copy-btn {\r\n            background-color: #4b5563;\r\n        }\r\n        #m3u-converter-app.dark .m3u-button.copy-btn {\r\n            background-color: #4b5563;\r\n        }\r\n        #m3u-converter-app .m3u-button.copy-btn:hover {\r\n            background-color: #374151;\r\n        }\r\n\r\n        #m3u-converter-app .m3u-button.copied {\r\n            background-color: var(--m3u-green);\r\n        }\r\n\r\n        #m3u-converter-app .m3u-instructions-toggle {\r\n            background: none;\r\n            border: none;\r\n            color: var(--m3u-blue);\r\n            font-weight: 600;\r\n            cursor: pointer;\r\n            display: flex;\r\n            align-items: center;\r\n            margin: 1.5rem auto 0 auto;\r\n            padding: 0;\r\n        }\r\n\r\n        #m3u-converter-app.dark .m3u-instructions-toggle {\r\n             color: #60a5fa;\r\n        }\r\n\r\n        #m3u-converter-app .m3u-instructions-toggle svg {\r\n            width: 1.25rem;\r\n            height: 1.25rem;\r\n            margin-left: 0.25rem;\r\n            transition: transform 0.3s;\r\n        }\r\n\r\n        #m3u-converter-app .m3u-instructions-toggle.open svg {\r\n            transform: rotate(180deg);\r\n        }\r\n\r\n        \/* \r\n         ============================================\r\n         Output & Instructions & Email Sections\r\n         ============================================\r\n        *\/\r\n        #m3u-converter-app .m3u-output-row h3 {\r\n            font-size: 0.875rem;\r\n            font-weight: 600;\r\n            color: var(--m3u-text-muted-light);\r\n            margin-bottom: 0.25rem;\r\n        }\r\n\r\n        #m3u-converter-app.dark .m3u-output-row h3 {\r\n            color: var(--m3u-text-muted-dark);\r\n        }\r\n        \r\n        #m3u-converter-app .m3u-output-row p {\r\n            background-color: var(--m3u-bg-light);\r\n            padding: 0.75rem;\r\n            border-radius: 0.375rem;\r\n            word-break: break-all;\r\n            margin: 0 0 1rem 0;\r\n        }\r\n\r\n        #m3u-converter-app.dark .m3u-output-row p {\r\n             background-color: var(--m3u-input-bg-dark);\r\n        }\r\n\r\n        #m3u-converter-app #instructions-section, \r\n        #m3u-converter-app #output-section, \r\n        #m3u-converter-app #email-section {\r\n            display: none;\r\n            animation: fade-in 0.5s ease-out;\r\n        }\r\n\r\n        #m3u-converter-app #instructions-section ul {\r\n            padding-left: 1.5rem;\r\n            margin-top: 0.5rem;\r\n            margin-bottom: 1rem;\r\n        }\r\n        \r\n        #m3u-converter-app #instructions-section code {\r\n            display: block;\r\n            background-color: var(--m3u-bg-light);\r\n            padding: 0.5rem;\r\n            border-radius: 0.375rem;\r\n            font-family: monospace;\r\n            word-break: break-all;\r\n            margin-top: 0.5rem;\r\n        }\r\n        \r\n        #m3u-converter-app.dark #instructions-section code {\r\n            background-color: rgba(0,0,0,0.2);\r\n        }\r\n\r\n        #m3u-converter-app #email-template-content {\r\n            white-space: pre-wrap;\r\n            background-color: var(--m3u-bg-light);\r\n            padding: 1rem;\r\n            border-radius: 0.5rem;\r\n            font-size: 0.875rem;\r\n            border: 1px solid var(--m3u-border-light);\r\n        }\r\n\r\n        #m3u-converter-app.dark #email-template-content {\r\n             background-color: #111827;\r\n             border-color: var(--m3u-border-dark);\r\n        }\r\n        \r\n        #m3u-converter-app .m3u-error-alert {\r\n            display: none;\r\n            background-color: #fef2f2;\r\n            color: #b91c1c;\r\n            border-left: 4px solid var(--m3u-red);\r\n            padding: 1rem;\r\n            border-radius: 0.375rem;\r\n            margin-top: 1.5rem;\r\n        }\r\n\r\n        #m3u-converter-app.dark .m3u-error-alert {\r\n            background-color: rgba(239, 68, 68, 0.1);\r\n            color: #fca5a5;\r\n        }\r\n        \r\n        #m3u-converter-app .m3u-error-alert strong {\r\n            display: block;\r\n            font-weight: 700;\r\n        }\r\n\r\n        \/* \r\n         ============================================\r\n         Theme Toggle\r\n         ============================================\r\n        *\/\r\n        #m3u-converter-app #theme-toggle {\r\n            position: absolute;\r\n            top: 0;\r\n            right: 0;\r\n            transform: translateY(-150%);\r\n            background-color: var(--m3u-card-bg-light);\r\n            border: 1px solid var(--m3u-border-light);\r\n            border-radius: 9999px;\r\n            padding: 0.5rem;\r\n            cursor: pointer;\r\n            box-shadow: 0 1px 3px rgba(0,0,0,0.1);\r\n            z-index: 10;\r\n        }\r\n\r\n        #m3u-converter-app.dark #theme-toggle {\r\n            background-color: var(--m3u-card-bg-dark);\r\n            border-color: var(--m3u-border-dark);\r\n        }\r\n        \r\n        #m3u-converter-app #theme-toggle svg {\r\n            width: 1.5rem;\r\n            height: 1.5rem;\r\n            color: var(--m3u-text-muted-light);\r\n        }\r\n\r\n        #m3u-converter-app.dark #theme-toggle svg {\r\n            color: var(--m3u-text-muted-dark);\r\n        }\r\n\r\n        #m3u-converter-app #theme-toggle .sun-icon { display: block; }\r\n        #m3u-converter-app #theme-toggle .moon-icon { display: none; }\r\n        #m3u-converter-app.dark #theme-toggle .sun-icon { display: none; }\r\n        #m3u-converter-app.dark #theme-toggle .moon-icon { display: block; }\r\n\r\n\r\n        \/* \r\n         ============================================\r\n         Footer & Animation\r\n         ============================================\r\n        *\/\r\n        #m3u-converter-app .m3u-footer {\r\n            text-align: center;\r\n            margin-top: 2rem;\r\n            font-size: 0.875rem;\r\n            color: var(--m3u-text-muted-light);\r\n        }\r\n\r\n        #m3u-converter-app.dark .m3u-footer {\r\n            color: var(--m3u-text-muted-dark);\r\n        }\r\n\r\n        @keyframes fade-in {\r\n            from { opacity: 0; transform: translateY(10px); }\r\n            to { opacity: 1; transform: translateY(0); }\r\n        }\r\n        \r\n        \/* \r\n         ============================================\r\n         Responsive Design\r\n         ============================================\r\n        *\/\r\n        @media (min-width: 640px) {\r\n            #m3u-converter-app {\r\n                padding: 2rem;\r\n            }\r\n\r\n            #m3u-converter-app .m3u-header h1 {\r\n                font-size: 2.25rem; \/* 36px *\/\r\n                line-height: 2.5rem;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div id=\"m3u-converter-app\">\r\n    <div class=\"m3u-container\">\r\n        \r\n        <button id=\"theme-toggle\" aria-label=\"Toggle theme\">\r\n            <svg class=\"sun-icon\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z\" \/><\/svg>\r\n            <svg class=\"moon-icon\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z\" \/><\/svg>\r\n        <\/button>\r\n\r\n        <header class=\"m3u-header\">\r\n            <h1>M3U to Xtream Codes<\/h1>\r\n            <p>Instantly convert your M3U playlist links.<\/p>\r\n        <\/header>\r\n\r\n        <main class=\"m3u-card\">\r\n            <div class=\"m3u-form-group\">\r\n                <label for=\"m3u-link-input\">M3U Link<\/label>\r\n                <input type=\"text\" id=\"m3u-link-input\" placeholder=\"http:\/\/server.com\/get.php?username=...\">\r\n            <\/div>\r\n            <div class=\"m3u-form-group\">\r\n                <label for=\"playlist-name-input\">Playlist Name<\/label>\r\n                <input type=\"text\" id=\"playlist-name-input\" placeholder=\"My Awesome Playlist\">\r\n            <\/div>\r\n            <button id=\"convert-btn\" class=\"m3u-button\">Convert to Xtream Code<\/button>\r\n            <div id=\"error-alert\" class=\"m3u-error-alert\">\r\n                <strong>Error<\/strong>\r\n                <p id=\"error-message\"><\/p>\r\n            <\/div>\r\n        <\/main>\r\n\r\n        <button id=\"instructions-toggle-btn\" class=\"m3u-instructions-toggle\">\r\n            Show Instructions\r\n            <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 20 20\" fill=\"currentColor\"><path fill-rule=\"evenodd\" d=\"M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z\" clip-rule=\"evenodd\" \/><\/svg>\r\n        <\/button>\r\n\r\n        <section id=\"instructions-section\" class=\"m3u-card\">\r\n             <h2>How to Use This Tool<\/h2>\r\n            <div>\r\n                <h3>Step 1: Find Your M3U Link<\/h3>\r\n                <p>Your M3U link is a unique URL from your IPTV service, usually found in your welcome email or account dashboard.<\/p>\r\n                <p>Example:<\/p>\r\n                <code>http:\/\/yourprovider.com\/get.php?username=YOUR_USER&password=YOUR_PASSWORD&type=m3u<\/code>\r\n            <\/div>\r\n            <br>\r\n            <div>\r\n                <h3>Step 2: Convert the Link<\/h3>\r\n                <ul>\r\n                    <li>Paste the M3U link into the \"M3U Link\" field.<\/li>\r\n                    <li>Enter a name for your playlist.<\/li>\r\n                    <li>Click the \"Convert to Xtream Code\" button.<\/li>\r\n                <\/ul>\r\n            <\/div>\r\n            <div>\r\n                <h3>Step 3: Use Your Xtream Codes<\/h3>\r\n                <p>Use the generated Server URL, Username, and Password to log into IPTV player apps like IPTV Smarters or TiviMate using the \"Login with Xtream Codes API\" option.<\/p>\r\n            <\/div>\r\n        <\/section>\r\n\r\n        <section id=\"email-section\" class=\"m3u-card\">\r\n            <h2>Email Template<\/h2>\r\n            <div id=\"email-template-content\"><\/div>\r\n            <button id=\"copy-email-btn\" class=\"m3u-button\">Copy Email<\/button>\r\n        <\/section>\r\n\r\n        <section id=\"output-section\" class=\"m3u-card\">\r\n            <h2>Xtream Codes Details<\/h2>\r\n            <div class=\"m3u-output-row\">\r\n                <h3>Playlist Name<\/h3>\r\n                <p id=\"output-playlist-name\"><\/p>\r\n            <\/div>\r\n            <div class=\"m3u-output-row\">\r\n                <h3>Username<\/h3>\r\n                <p id=\"output-username\"><\/p>\r\n            <\/div>\r\n            <div class=\"m3u-output-row\">\r\n                <h3>Password<\/h3>\r\n                <p id=\"output-password\"><\/p>\r\n            <\/div>\r\n            <div class=\"m3u-output-row\">\r\n                <h3>Server URL<\/h3>\r\n                <p id=\"output-url\"><\/p>\r\n            <\/div>\r\n            <div class=\"m3u-output-row\">\r\n                <h3>M3U Link (Xtream)<\/h3>\r\n                <p id=\"output-m3u\"><\/p>\r\n            <\/div>\r\n            <button id=\"copy-details-btn\" class=\"m3u-button copy-btn\">Copy Details<\/button>\r\n        <\/section>\r\n\r\n        <footer class=\"m3u-footer\">\r\n            <p>A modern utility for IPTV users.<\/p>\r\n        <\/footer>\r\n    <\/div>\r\n<\/div>\r\n\r\n<script>\r\n    document.addEventListener('DOMContentLoaded', () => {\r\n        \/\/ --- DOM Element References ---\r\n        const app = document.getElementById('m3u-converter-app');\r\n        const m3uLinkInput = document.getElementById('m3u-link-input');\r\n        const playlistNameInput = document.getElementById('playlist-name-input');\r\n        const convertBtn = document.getElementById('convert-btn');\r\n        const errorAlert = document.getElementById('error-alert');\r\n        const errorMessage = document.getElementById('error-message');\r\n        \r\n        const instructionsToggleBtn = document.getElementById('instructions-toggle-btn');\r\n        const instructionsSection = document.getElementById('instructions-section');\r\n        \r\n        const outputSection = document.getElementById('output-section');\r\n        const outputPlaylistName = document.getElementById('output-playlist-name');\r\n        const outputUsername = document.getElementById('output-username');\r\n        const outputPassword = document.getElementById('output-password');\r\n        const outputUrl = document.getElementById('output-url');\r\n        const outputM3u = document.getElementById('output-m3u');\r\n        const copyDetailsBtn = document.getElementById('copy-details-btn');\r\n        \r\n        const emailSection = document.getElementById('email-section');\r\n        const emailTemplateContent = document.getElementById('email-template-content');\r\n        const copyEmailBtn = document.getElementById('copy-email-btn');\r\n\r\n        const themeToggle = document.getElementById('theme-toggle');\r\n\r\n        let outputDetails = null;\r\n\r\n        \/\/ --- Theme Management ---\r\n        const applyTheme = (theme) => {\r\n            if (theme === 'dark') {\r\n                app.classList.add('dark');\r\n            } else {\r\n                app.classList.remove('dark');\r\n            }\r\n        };\r\n\r\n        themeToggle.addEventListener('click', () => {\r\n            const newTheme = app.classList.contains('dark') ? 'light' : 'dark';\r\n            localStorage.setItem('theme', newTheme);\r\n            applyTheme(newTheme);\r\n        });\r\n\r\n        \/\/ Initialize theme on load\r\n        const savedTheme = localStorage.getItem('theme') || (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');\r\n        applyTheme(savedTheme);\r\n\r\n        \/\/ --- UI Helper Functions ---\r\n        const showError = (message) => {\r\n            errorMessage.textContent = message;\r\n            errorAlert.style.display = 'block';\r\n        };\r\n\r\n        const hideError = () => {\r\n            errorAlert.style.display = 'none';\r\n        };\r\n\r\n        const hideResults = () => {\r\n            outputSection.style.display = 'none';\r\n            emailSection.style.display = 'none';\r\n        };\r\n\r\n        const showButtonFeedback = (button, originalText, feedbackText = 'Copied!') => {\r\n            button.textContent = feedbackText;\r\n            button.classList.add('copied');\r\n            setTimeout(() => {\r\n                button.textContent = originalText;\r\n                button.classList.remove('copied');\r\n            }, 2000);\r\n        };\r\n        \r\n        \/\/ --- Event Listeners ---\r\n        instructionsToggleBtn.addEventListener('click', () => {\r\n            const isOpen = instructionsSection.style.display === 'block';\r\n            instructionsSection.style.display = isOpen ? 'none' : 'block';\r\n            instructionsToggleBtn.classList.toggle('open', !isOpen);\r\n            instructionsToggleBtn.firstChild.textContent = isOpen ? 'Show Instructions' : 'Hide Instructions';\r\n        });\r\n\r\n        convertBtn.addEventListener('click', () => {\r\n            hideError();\r\n            hideResults();\r\n\r\n            const m3uLink = m3uLinkInput.value.trim();\r\n            const playlistName = playlistNameInput.value.trim();\r\n\r\n            if (!m3uLink || !playlistName) {\r\n                showError('Please enter both the M3U link and a playlist name.');\r\n                return;\r\n            }\r\n\r\n            try {\r\n                const url = new URL(m3uLink);\r\n                const username = url.searchParams.get('username');\r\n                const password = url.searchParams.get('password');\r\n\r\n                if (!username || !password) {\r\n                    showError('The M3U link must contain \"username\" and \"password\" parameters.');\r\n                    return;\r\n                }\r\n\r\n                const hostUrl = `${url.protocol}\/\/${url.host}`;\r\n                const xtreamM3uLink = `${hostUrl}\/get.php?username=${username}&password=${password}&type=m3u&output=ts`;\r\n                \r\n                outputDetails = { playlistName, username, password, url: hostUrl, m3uLink: xtreamM3uLink };\r\n                \r\n                \/\/ Populate and show email section\r\n                const emailText = generateEmailTemplate(outputDetails);\r\n                emailTemplateContent.textContent = emailText;\r\n                emailSection.style.display = 'block';\r\n\r\n                \/\/ Populate and show output section\r\n                outputPlaylistName.textContent = outputDetails.playlistName;\r\n                outputUsername.textContent = outputDetails.username;\r\n                outputPassword.textContent = outputDetails.password;\r\n                outputUrl.textContent = outputDetails.url;\r\n                outputM3u.textContent = outputDetails.m3uLink;\r\n                outputSection.style.display = 'block';\r\n                \r\n                \/\/ --- Auto-copy generated email template ---\r\n                navigator.clipboard.writeText(emailText).then(() => {\r\n                    showButtonFeedback(copyEmailBtn, 'Copy Email', 'Auto-copied!');\r\n                }).catch(err => {\r\n                    console.error('Auto-copy of email failed:', err);\r\n                });\r\n\r\n            } catch (e) {\r\n                showError('Invalid M3U link format. Please check the URL and try again.');\r\n                console.error(e);\r\n\r\n            }\r\n        });\r\n\r\n        copyDetailsBtn.addEventListener('click', () => {\r\n            if (!outputDetails) return;\r\n            const textToCopy = `Playlist Name: ${outputDetails.playlistName}\\nUsername: ${outputDetails.username}\\nPassword: ${outputDetails.password}\\nURL: ${outputDetails.url}\\n-------------------------------\\nM3U Link: ${outputDetails.m3uLink}`;\r\n            navigator.clipboard.writeText(textToCopy).then(() => {\r\n                showButtonFeedback(copyDetailsBtn, 'Copy Details');\r\n            }).catch(err => console.error('Failed to copy details:', err));\r\n        });\r\n\r\n        copyEmailBtn.addEventListener('click', () => {\r\n            const emailText = emailTemplateContent.textContent;\r\n            if (!emailText) return;\r\n            navigator.clipboard.writeText(emailText).then(() => {\r\n                showButtonFeedback(copyEmailBtn, 'Copy Email');\r\n            }).catch(err => console.error('Failed to copy email:', err));\r\n        });\r\n\r\n        \/\/ --- Template Generation ---\r\n        const generateEmailTemplate = (details) => {\r\n            return `Cher client(e) pr\u00e9cieux(se),\r\n\r\nGreat news! \ud83d\ude80 We're thrilled to let you know that your subscription with us has been activated and is ready to use!\r\n\r\nYOUR LOGIN CREDENTIALS\r\n---------------------------------------------\r\n* Xtream Codes\r\nPlaylist Name: ${details.playlistName}\r\nUsername: ${details.username}\r\nPassword: ${details.password}\r\nURL: ${details.url}\r\n\r\n* M3U URL\r\n${details.m3uLink}\r\n---------------------------------------------\r\nNote: If you're using the Smarter app on your TV, please use this link:\r\nhttp:\/\/eagle2024.xyz:2082\r\n\r\nInstallation Guide:\r\nhttps:\/\/aerotv.fr\/installation-tutorial\/\r\n\r\nVPN: Active \u2705\r\n\r\nIf you have any questions, please don't hesitate to contact us.\r\n\ud83d\udc49 https:\/\/wa.link\/3zbjw0\r\n\r\nJoin our community\r\n\ud83d\udc49 https:\/\/telegram.me\/xtreme\r\n\r\nThank you again for choosing our ${details.playlistName} service. \r\nWe hope you\u2019re enjoying your viewing experience.\r\n\r\n${details.playlistName} Support`;\r\n        };\r\n    });\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>M3U to Xtream Codes Converter M3U to Xtream Codes Instantly convert your M3U playlist links. M3U Link Playlist Name Convert to Xtream Code Error Show Instructions How to Use This Tool Step 1: Find Your M3U Link Your M3U link is a unique URL from your IPTV service, usually found in your welcome email or [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-835","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/xtremehdiptve.io\/xtreme\/wp-json\/wp\/v2\/pages\/835","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/xtremehdiptve.io\/xtreme\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/xtremehdiptve.io\/xtreme\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/xtremehdiptve.io\/xtreme\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/xtremehdiptve.io\/xtreme\/wp-json\/wp\/v2\/comments?post=835"}],"version-history":[{"count":4,"href":"https:\/\/xtremehdiptve.io\/xtreme\/wp-json\/wp\/v2\/pages\/835\/revisions"}],"predecessor-version":[{"id":841,"href":"https:\/\/xtremehdiptve.io\/xtreme\/wp-json\/wp\/v2\/pages\/835\/revisions\/841"}],"wp:attachment":[{"href":"https:\/\/xtremehdiptve.io\/xtreme\/wp-json\/wp\/v2\/media?parent=835"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}