{"id":180748,"date":"2026-02-06T21:26:08","date_gmt":"2026-02-06T20:26:08","guid":{"rendered":"https:\/\/megatraining.africa\/?page_id=180748"},"modified":"2026-02-07T12:36:11","modified_gmt":"2026-02-07T11:36:11","slug":"cv-builder","status":"publish","type":"page","link":"https:\/\/megatraining.africa\/en\/cv-builder\/","title":{"rendered":"Cv builder"},"content":{"rendered":"\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t
\n\n\t\t\t\tHome\n\t\t\t<\/div>\n\n\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n G\u00e9n\u00e9rateur de CV - MegaTraining<\/title>\r\n <!-- Tailwind CSS -->\r\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n <!-- Fonts: Poppins (Titres Eduma) & Roboto (Corps Eduma) -->\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@400;500;600;700&family=Roboto:wght@300;400;500&display=swap\" rel=\"stylesheet\">\r\n <!-- html2pdf -->\r\n <script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/html2pdf.js\/0.10.1\/html2pdf.bundle.min.js\"><\/script>\r\n \r\n <script>\r\n tailwind.config = {\r\n theme: {\r\n extend: {\r\n colors: {\r\n eduma: {\r\n yellow: '#FFB606', \/\/ La couleur jaune typique d'Eduma\r\n dark: '#171c24', \/\/ Le fond sombre typique\r\n blue: '#242c42', \/\/ Bleu nuit section\r\n text: '#555555' \/\/ Gris texte standard\r\n }\r\n },\r\n fontFamily: {\r\n sans: ['Roboto', 'sans-serif'],\r\n heading: ['Poppins', 'sans-serif'],\r\n }\r\n }\r\n }\r\n }\r\n <\/script>\r\n\r\n <style>\r\n \/* Styles globaux Eduma *\/\r\n body {\r\n background-color: #f2f2f2;\r\n color: #555;\r\n font-family: 'Roboto', sans-serif;\r\n }\r\n\r\n h1, h2, h3, h4 {\r\n font-family: 'Poppins', sans-serif;\r\n }\r\n \r\n \/* A4 Paper Styling *\/\r\n #resume-template {\r\n width: 210mm;\r\n min-height: 297mm;\r\n background-color: white;\r\n margin: 0 auto;\r\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\r\n display: grid;\r\n grid-template-columns: 35% 65%; \/* Sidebar plus large pour style acad\u00e9mique *\/\r\n }\r\n\r\n \/* Sidebar Styling (MegaTraining Style) *\/\r\n .resume-sidebar {\r\n background-color: #171c24; \/* Dark Eduma Background *\/\r\n color: white;\r\n padding: 40px 25px;\r\n position: relative;\r\n }\r\n\r\n \/* Accent Lines *\/\r\n .sidebar-accent {\r\n height: 3px;\r\n width: 50px;\r\n background-color: #FFB606;\r\n margin-bottom: 15px;\r\n }\r\n\r\n \/* Main Content Styling *\/\r\n .resume-main {\r\n padding: 40px 40px;\r\n background-color: #ffffff;\r\n }\r\n\r\n \/* Form Styling to match Eduma Theme *\/\r\n .eduma-input {\r\n border: 1px solid #e5e5e5;\r\n background-color: #fff;\r\n padding: 12px;\r\n border-radius: 4px; \/* Slightly squared like Eduma *\/\r\n transition: border-color 0.3s;\r\n }\r\n .eduma-input:focus {\r\n outline: none;\r\n border-color: #FFB606; \/* Focus color *\/\r\n }\r\n\r\n .eduma-btn {\r\n background-color: #FFB606;\r\n color: #fff;\r\n font-family: 'Poppins', sans-serif;\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n letter-spacing: 0.5px;\r\n border-radius: 4px;\r\n transition: all 0.3s;\r\n }\r\n .eduma-btn:hover {\r\n background-color: #e6a300;\r\n transform: translateY(-2px);\r\n }\r\n\r\n \/* CV Typography *\/\r\n .res-name { \r\n font-family: 'Poppins', sans-serif; \r\n font-weight: 700; \r\n text-transform: uppercase; \r\n letter-spacing: 1px;\r\n color: #171c24;\r\n }\r\n .res-title { \r\n font-family: 'Poppins', sans-serif; \r\n font-weight: 500; \r\n color: #FFB606; \/* Yellow text for title *\/\r\n margin-top: 5px;\r\n }\r\n \r\n .section-title {\r\n font-family: 'Poppins', sans-serif;\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n font-size: 14px;\r\n letter-spacing: 1px;\r\n margin-bottom: 15px;\r\n }\r\n\r\n \/* Timeline Dots *\/\r\n .timeline-dot {\r\n width: 10px;\r\n height: 10px;\r\n background-color: #FFB606;\r\n border-radius: 50%;\r\n display: inline-block;\r\n margin-right: 10px;\r\n }\r\n\r\n \/* Header Imitation MegaTraining *\/\r\n .mt-header {\r\n background-color: #fff;\r\n border-bottom: 1px solid #eee;\r\n padding: 15px 0;\r\n }\r\n <\/style>\r\n<\/head>\r\n<body class=\"font-sans\">\r\n\r\n <!-- Faux Header MegaTraining pour l'immersion -->\r\n <header class=\"mt-header shadow-sm mb-8\">\r\n <div class=\"max-w-[1600px] mx-auto px-6 flex justify-between items-center\">\r\n <div class=\"flex items-center gap-3\">\r\n <!-- Logo Simul\u00e9 -->\r\n <div class=\"flex flex-col leading-tight\">\r\n <span class=\"text-2xl font-bold font-heading text-eduma-dark\">MEGA<span class=\"text-eduma-yellow\">TRAINING<\/span><\/span>\r\n <span class=\"text-[10px] tracking-widest text-gray-500 uppercase\">Africa<\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"hidden md:block\">\r\n <span class=\"text-sm font-heading font-semibold text-eduma-yellow bg-eduma-dark px-4 py-2 rounded\">G\u00e9n\u00e9rateur de CV Professionnel<\/span>\r\n <\/div>\r\n <\/div>\r\n <\/header>\r\n\r\n <main class=\"flex flex-col xl:flex-row gap-8 max-w-[1600px] mx-auto px-4 md:px-8 pb-12\">\r\n \r\n <!-- 1. LEFT SIDE: EDITOR (Style Eduma Form) -->\r\n <section class=\"xl:w-5\/12 h-fit space-y-6\">\r\n \r\n <!-- Personal Details -->\r\n <div class=\"bg-white p-6 rounded shadow-sm border-t-4 border-eduma-yellow\">\r\n <h2 class=\"text-lg font-heading font-bold text-eduma-dark mb-6 flex items-center gap-2\">\r\n <span class=\"text-eduma-yellow text-xl\">01.<\/span> Informations Personnelles\r\n <\/h2>\r\n \r\n <div class=\"grid grid-cols-1 md:grid-cols-2 gap-4\">\r\n <input type=\"text\" id=\"name\" placeholder=\"Nom Complet\" oninput=\"updatePreview()\" class=\"eduma-input col-span-2\">\r\n <input type=\"text\" id=\"title\" placeholder=\"Titre (ex: Formateur Digital)\" oninput=\"updatePreview()\" class=\"eduma-input col-span-2\">\r\n <input type=\"text\" id=\"phone\" placeholder=\"T\u00e9l\u00e9phone\" oninput=\"updatePreview()\" class=\"eduma-input\">\r\n <input type=\"text\" id=\"location\" placeholder=\"Ville, Pays\" oninput=\"updatePreview()\" class=\"eduma-input\">\r\n <input type=\"text\" id=\"email\" placeholder=\"Email\" oninput=\"updatePreview()\" class=\"eduma-input col-span-2\">\r\n <input type=\"text\" id=\"linkedin\" placeholder=\"LinkedIn URL\" oninput=\"updatePreview()\" class=\"eduma-input col-span-2\">\r\n <\/div>\r\n <textarea id=\"summary\" rows=\"4\" placeholder=\"R\u00e9sum\u00e9 de carri\u00e8re : Mettez en avant votre expertise...\" oninput=\"updatePreview()\" class=\"eduma-input mt-4 w-full\"><\/textarea>\r\n <\/div>\r\n\r\n <!-- Experience -->\r\n <div class=\"bg-white p-6 rounded shadow-sm border-t-4 border-eduma-dark\">\r\n <h2 class=\"text-lg font-heading font-bold text-eduma-dark mb-6 flex items-center gap-2\">\r\n <span class=\"text-eduma-yellow text-xl\">02.<\/span> Exp\u00e9rience Professionnelle\r\n <\/h2>\r\n <div id=\"work-experience-container\" class=\"space-y-4\"><\/div>\r\n <button type=\"button\" onclick=\"addWorkEntry()\" class=\"w-full mt-4 py-3 border border-dashed border-gray-300 text-gray-500 font-medium hover:border-eduma-yellow hover:text-eduma-yellow transition\">\r\n + Ajouter une exp\u00e9rience\r\n <\/button>\r\n <\/div>\r\n\r\n <!-- Education -->\r\n <div class=\"bg-white p-6 rounded shadow-sm border-t-4 border-eduma-dark\">\r\n <h2 class=\"text-lg font-heading font-bold text-eduma-dark mb-6 flex items-center gap-2\">\r\n <span class=\"text-eduma-yellow text-xl\">03.<\/span> Formation & Certifications\r\n <\/h2>\r\n <div id=\"education-container\" class=\"space-y-4\"><\/div>\r\n <button type=\"button\" onclick=\"addEducationEntry()\" class=\"w-full mt-4 py-3 border border-dashed border-gray-300 text-gray-500 font-medium hover:border-eduma-yellow hover:text-eduma-yellow transition\">\r\n + Ajouter une formation\r\n <\/button>\r\n <\/div>\r\n\r\n <!-- Skills & Languages -->\r\n <div class=\"bg-white p-6 rounded shadow-sm border-t-4 border-eduma-dark\">\r\n <h2 class=\"text-lg font-heading font-bold text-eduma-dark mb-6 flex items-center gap-2\">\r\n <span class=\"text-eduma-yellow text-xl\">04.<\/span> Comp\u00e9tences & Langues\r\n <\/h2>\r\n\r\n <!-- Skills -->\r\n <div class=\"mb-6\">\r\n <label class=\"block text-sm font-medium text-gray-600 mb-2\">Comp\u00e9tences Techniques (Entr\u00e9e pour ajouter)<\/label>\r\n <input type=\"text\" id=\"skill-input\" placeholder=\"Ex: Gestion de projet, PHP...\" class=\"eduma-input w-full\" onkeydown=\"handleSkillInput(event)\">\r\n <div id=\"input-skill-chips\" class=\"flex flex-wrap gap-2 mt-3\"><\/div>\r\n <\/div>\r\n\r\n <!-- Languages -->\r\n <div id=\"language-container\" class=\"space-y-3\"><\/div>\r\n <button type=\"button\" onclick=\"addLanguageEntry()\" class=\"text-sm text-eduma-yellow font-bold uppercase mt-3 hover:underline\">+ Ajouter une langue<\/button>\r\n <\/div>\r\n\r\n <!-- Export -->\r\n <div class=\"sticky bottom-4\">\r\n <button onclick=\"exportToPDF()\" class=\"eduma-btn w-full py-4 shadow-xl text-lg\">\r\n T\u00e9l\u00e9charger mon CV PDF\r\n <\/button>\r\n <\/div>\r\n\r\n <\/section>\r\n\r\n <!-- 2. RIGHT SIDE: PREVIEW (Eduma Theme Style) -->\r\n <section class=\"xl:w-7\/12 flex justify-center bg-gray-200 p-8 rounded overflow-hidden\">\r\n \r\n <div id=\"resume-template\">\r\n \r\n <!-- SIDEBAR (Dark Blue - #171c24) -->\r\n <div class=\"resume-sidebar\">\r\n \r\n <!-- Avatar\/Initials Circle -->\r\n <div class=\"flex justify-center mb-8\">\r\n <div id=\"preview-initials\" class=\"w-24 h-24 rounded-full bg-eduma-yellow text-eduma-dark flex items-center justify-center text-3xl font-heading font-bold border-4 border-[#2c3544]\">\r\n MT\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Contact -->\r\n <div class=\"mb-10\">\r\n <h3 class=\"section-title text-white\">Contact<\/h3>\r\n <div class=\"sidebar-accent\"><\/div>\r\n <ul class=\"text-sm text-gray-300 space-y-4 font-light\">\r\n <li id=\"box-phone\" class=\"flex items-start gap-3\" style=\"display:none\">\r\n <span class=\"text-eduma-yellow mt-1\">\ud83d\udcde<\/span> <span id=\"p-phone\"><\/span>\r\n <\/li>\r\n <li id=\"box-email\" class=\"flex items-start gap-3\" style=\"display:none\">\r\n <span class=\"text-eduma-yellow mt-1\">\u2709\ufe0f<\/span> <span id=\"p-email\" class=\"break-all\"><\/span>\r\n <\/li>\r\n <li id=\"box-location\" class=\"flex items-start gap-3\" style=\"display:none\">\r\n <span class=\"text-eduma-yellow mt-1\">\ud83d\udccd<\/span> <span id=\"p-location\"><\/span>\r\n <\/li>\r\n <li id=\"box-linkedin\" class=\"flex items-start gap-3\" style=\"display:none\">\r\n <span class=\"text-eduma-yellow mt-1\">\ud83d\udd17<\/span> <span id=\"p-linkedin\" class=\"break-all\"><\/span>\r\n <\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <!-- Education (Moved to sidebar for Academic look) -->\r\n <div id=\"p-edu-container\" class=\"mb-10\">\r\n <h3 class=\"section-title text-white\">Formation<\/h3>\r\n <div class=\"sidebar-accent\"><\/div>\r\n <div id=\"p-edu-list\" class=\"space-y-5 text-sm text-gray-300\">\r\n <!-- Dynamic Education -->\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Languages -->\r\n <div id=\"p-lang-section\" style=\"display:none;\">\r\n <h3 class=\"section-title text-white\">Langues<\/h3>\r\n <div class=\"sidebar-accent\"><\/div>\r\n <div id=\"p-lang-list\" class=\"space-y-3\">\r\n <!-- Dynamic Langs -->\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <!-- MAIN CONTENT (White) -->\r\n <div class=\"resume-main\">\r\n \r\n <!-- Header -->\r\n <div class=\"mb-10 pt-4\">\r\n <h1 id=\"preview-name\" class=\"res-name text-4xl mb-1\">Votre Nom<\/h1>\r\n <h2 id=\"preview-title\" class=\"res-title text-xl tracking-widest uppercase\">Titre du Poste<\/h2>\r\n <div class=\"w-20 h-1 bg-eduma-yellow mt-6\"><\/div>\r\n <\/div>\r\n\r\n <!-- Profile -->\r\n <div id=\"p-summary-container\" class=\"mb-10\">\r\n <h3 class=\"section-title text-eduma-dark\">Profil Professionnel<\/h3>\r\n <p id=\"p-summary\" class=\"text-gray-600 leading-7 text-justify\"><\/p>\r\n <\/div>\r\n\r\n <!-- Work Experience -->\r\n <div id=\"p-work-container\" class=\"mb-10\">\r\n <h3 class=\"section-title text-eduma-dark\">Exp\u00e9rience Professionnelle<\/h3>\r\n <div id=\"p-work-list\" class=\"mt-6 border-l-2 border-gray-100 pl-6 space-y-8\">\r\n <!-- Dynamic Work -->\r\n <\/div>\r\n <\/div>\r\n\r\n <!-- Skills (Main Area) -->\r\n <div id=\"p-skills-section\" class=\"mb-8\" style=\"display:none;\">\r\n <h3 class=\"section-title text-eduma-dark\">Comp\u00e9tences Cl\u00e9s<\/h3>\r\n <div id=\"p-skills-list\" class=\"flex flex-wrap gap-3 mt-4\">\r\n <!-- Skills Chips -->\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <\/div>\r\n <\/section>\r\n <\/main>\r\n\r\n <script>\r\n \/\/ --- State Management ---\r\n let workCount = 0;\r\n let eduCount = 0;\r\n let langCount = 0;\r\n let skills = [];\r\n\r\n \/\/ --- Core Functions ---\r\n\r\n function updatePreview() {\r\n \/\/ Personal Info\r\n const name = document.getElementById('name').value;\r\n const title = document.getElementById('title').value;\r\n const summary = document.getElementById('summary').value;\r\n\r\n \/\/ Initials Logic\r\n if(name) {\r\n const parts = name.trim().split(' ');\r\n let initials = parts[0][0];\r\n if(parts.length > 1) initials += parts[parts.length-1][0];\r\n document.getElementById('preview-initials').textContent = initials.toUpperCase();\r\n } else {\r\n document.getElementById('preview-initials').textContent = \"MT\";\r\n }\r\n\r\n document.getElementById('preview-name').textContent = name || 'VOTRE NOM';\r\n document.getElementById('preview-title').textContent = title || 'TITRE PROFESSIONNEL';\r\n document.getElementById('p-summary').innerText = summary;\r\n document.getElementById('p-summary-container').style.display = summary ? 'block' : 'none';\r\n\r\n \/\/ Contact Checks\r\n updateContactField('phone', 'p-phone', 'box-phone');\r\n updateContactField('email', 'p-email', 'box-email');\r\n updateContactField('location', 'p-location', 'box-location');\r\n updateContactField('linkedin', 'p-linkedin', 'box-linkedin');\r\n\r\n \/\/ Work Experience (Main Column)\r\n renderDynamicList('work', workCount, 'p-work-list', (i) => {\r\n const title = document.getElementById(`work-title-${i}`).value;\r\n const company = document.getElementById(`work-comp-${i}`).value;\r\n const start = document.getElementById(`work-start-${i}`).value;\r\n const end = document.getElementById(`work-end-${i}`).value;\r\n const desc = document.getElementById(`work-desc-${i}`).value;\r\n \r\n if(!title) return '';\r\n\r\n return `\r\n <div class=\"relative\">\r\n <div class=\"absolute -left-[31px] top-1.5 w-3 h-3 bg-eduma-yellow rounded-full border-2 border-white box-content\"><\/div>\r\n <div class=\"flex flex-col sm:flex-row justify-between sm:items-baseline mb-1\">\r\n <h4 class=\"font-heading font-bold text-lg text-eduma-dark\">${title}<\/h4>\r\n <span class=\"text-sm font-medium text-eduma-yellow\">${start} - ${end}<\/span>\r\n <\/div>\r\n <div class=\"text-sm font-semibold text-gray-500 mb-2 uppercase tracking-wide\">${company}<\/div>\r\n <p class=\"text-sm text-gray-600 leading-relaxed whitespace-pre-wrap\">${desc}<\/p>\r\n <\/div>`;\r\n });\r\n\r\n \/\/ Education (Sidebar)\r\n renderDynamicList('edu', eduCount, 'p-edu-list', (i) => {\r\n const degree = document.getElementById(`edu-deg-${i}`).value;\r\n const school = document.getElementById(`edu-school-${i}`).value;\r\n const year = document.getElementById(`edu-year-${i}`).value;\r\n\r\n if(!degree) return '';\r\n\r\n return `\r\n <div>\r\n <h4 class=\"font-heading font-bold text-white\">${degree}<\/h4>\r\n <div class=\"text-eduma-yellow text-xs mb-1\">${year}<\/div>\r\n <div class=\"text-gray-400 italic\">${school}<\/div>\r\n <\/div>`;\r\n });\r\n\r\n \/\/ Languages (Sidebar)\r\n renderDynamicList('lang', langCount, 'p-lang-list', (i) => {\r\n const name = document.getElementById(`lang-name-${i}`).value;\r\n const level = document.getElementById(`lang-level-${i}`).value;\r\n if(!name) return '';\r\n \r\n \/\/ Visual dots for language level\r\n let dots = 1;\r\n if(level === 'Interm\u00e9diaire') dots = 3;\r\n if(level === 'Avanc\u00e9') dots = 4;\r\n if(level === 'Natif') dots = 5;\r\n \r\n let dotsHtml = '';\r\n for(let j=0; j<5; j++) {\r\n dotsHtml += `<span class=\"inline-block w-2 h-2 rounded-full mr-1 ${j < dots ? 'bg-eduma-yellow' : 'bg-gray-600'}\"><\/span>`;\r\n }\r\n\r\n return `\r\n <div>\r\n <div class=\"flex justify-between items-center mb-1\">\r\n <span class=\"font-semibold text-white\">${name}<\/span>\r\n <\/div>\r\n <div class=\"flex\">${dotsHtml}<\/div>\r\n <\/div>`;\r\n });\r\n document.getElementById('p-lang-section').style.display = langCount > 0 ? 'block' : 'none';\r\n\r\n \/\/ Skills (Main Column - Chips)\r\n const skillContainer = document.getElementById('p-skills-list');\r\n skillContainer.innerHTML = skills.map(s => \r\n `<span class=\"bg-gray-100 text-eduma-dark font-medium px-3 py-1.5 rounded text-sm border-b-2 border-eduma-yellow\">${s}<\/span>`\r\n ).join('');\r\n document.getElementById('p-skills-section').style.display = skills.length > 0 ? 'block' : 'none';\r\n }\r\n\r\n \/\/ Helper to update contact fields\r\n function updateContactField(inputId, previewId, boxId) {\r\n const val = document.getElementById(inputId).value;\r\n if(val) {\r\n document.getElementById(previewId).textContent = val;\r\n document.getElementById(boxId).style.display = 'flex';\r\n } else {\r\n document.getElementById(boxId).style.display = 'none';\r\n }\r\n }\r\n\r\n \/\/ Helper for Dynamic Rendering\r\n function renderDynamicList(prefix, count, containerId, templateFn) {\r\n const container = document.getElementById(containerId);\r\n container.innerHTML = '';\r\n for(let i=0; i<count; i++) {\r\n if(document.getElementById(`${prefix}-entry-${i}`)) {\r\n const html = templateFn(i);\r\n if(html) container.innerHTML += html;\r\n }\r\n }\r\n }\r\n\r\n \/\/ --- Add\/Remove Logic ---\r\n\r\n function addWorkEntry() {\r\n const i = workCount++;\r\n const div = document.createElement('div');\r\n div.id = `work-entry-${i}`;\r\n div.className = \"p-4 bg-gray-50 rounded border border-gray-200 relative animate-fade-in mb-3\";\r\n div.innerHTML = `\r\n <button onclick=\"removeElement('work-entry-${i}')\" class=\"absolute top-2 right-2 text-red-400 hover:text-red-600 text-xl font-bold\">×<\/button>\r\n <input type=\"text\" id=\"work-title-${i}\" placeholder=\"Poste occup\u00e9\" class=\"eduma-input w-full mb-2 font-bold\" oninput=\"updatePreview()\">\r\n <input type=\"text\" id=\"work-comp-${i}\" placeholder=\"Entreprise\" class=\"eduma-input w-full mb-2 text-sm\" oninput=\"updatePreview()\">\r\n <div class=\"flex gap-2 mb-2\">\r\n <input type=\"text\" id=\"work-start-${i}\" placeholder=\"D\u00e9but (AAAA)\" class=\"eduma-input w-1\/2 text-sm\" oninput=\"updatePreview()\">\r\n <input type=\"text\" id=\"work-end-${i}\" placeholder=\"Fin\" class=\"eduma-input w-1\/2 text-sm\" oninput=\"updatePreview()\">\r\n <\/div>\r\n <textarea id=\"work-desc-${i}\" rows=\"2\" placeholder=\"Description des t\u00e2ches...\" class=\"eduma-input w-full text-sm\" oninput=\"updatePreview()\"><\/textarea>\r\n `;\r\n document.getElementById('work-experience-container').appendChild(div);\r\n }\r\n\r\n function addEducationEntry() {\r\n const i = eduCount++;\r\n const div = document.createElement('div');\r\n div.id = `edu-entry-${i}`;\r\n div.className = \"p-4 bg-gray-50 rounded border border-gray-200 relative mb-3\";\r\n div.innerHTML = `\r\n <button onclick=\"removeElement('edu-entry-${i}')\" class=\"absolute top-2 right-2 text-red-400 hover:text-red-600 text-xl font-bold\">×<\/button>\r\n <input type=\"text\" id=\"edu-deg-${i}\" placeholder=\"Dipl\u00f4me \/ Certificat\" class=\"eduma-input w-full mb-2 font-bold\" oninput=\"updatePreview()\">\r\n <input type=\"text\" id=\"edu-school-${i}\" placeholder=\"Institution\" class=\"eduma-input w-full mb-2 text-sm\" oninput=\"updatePreview()\">\r\n <input type=\"text\" id=\"edu-year-${i}\" placeholder=\"Ann\u00e9e d'obtention\" class=\"eduma-input w-full text-sm\" oninput=\"updatePreview()\">\r\n `;\r\n document.getElementById('education-container').appendChild(div);\r\n }\r\n\r\n function addLanguageEntry() {\r\n const i = langCount++;\r\n const div = document.createElement('div');\r\n div.id = `lang-entry-${i}`;\r\n div.className = \"flex gap-2 items-center mb-2\";\r\n div.innerHTML = `\r\n <input type=\"text\" id=\"lang-name-${i}\" placeholder=\"Langue\" class=\"eduma-input flex-1\" oninput=\"updatePreview()\">\r\n <select id=\"lang-level-${i}\" class=\"eduma-input flex-1 text-sm\" onchange=\"updatePreview()\">\r\n <option value=\"Natif\">Natif<\/option>\r\n <option value=\"Avanc\u00e9\">Avanc\u00e9<\/option>\r\n <option value=\"Interm\u00e9diaire\">Interm\u00e9diaire<\/option>\r\n <option value=\"D\u00e9butant\">D\u00e9butant<\/option>\r\n <\/select>\r\n <button onclick=\"removeElement('lang-entry-${i}')\" class=\"text-red-400 hover:text-red-600 px-2 font-bold\">×<\/button>\r\n `;\r\n document.getElementById('language-container').appendChild(div);\r\n }\r\n\r\n function handleSkillInput(e) {\r\n if(e.key === 'Enter') {\r\n e.preventDefault();\r\n const val = e.target.value.trim();\r\n if(val && !skills.includes(val)) {\r\n skills.push(val);\r\n renderInputChips();\r\n updatePreview();\r\n e.target.value = '';\r\n }\r\n }\r\n }\r\n\r\n function renderInputChips() {\r\n const container = document.getElementById('input-skill-chips');\r\n container.innerHTML = skills.map(s => `\r\n <span class=\"bg-blue-50 text-eduma-blue border border-eduma-blue px-3 py-1 rounded-full text-sm flex items-center gap-1\">\r\n ${s}\r\n <button onclick=\"removeSkill('${s}')\" class=\"text-red-500 font-bold ml-1 hover:scale-110\">×<\/button>\r\n <\/span>\r\n `).join('');\r\n }\r\n\r\n function removeSkill(s) {\r\n skills = skills.filter(sk => sk !== s);\r\n renderInputChips();\r\n updatePreview();\r\n }\r\n\r\n function removeElement(id) {\r\n document.getElementById(id).remove();\r\n updatePreview();\r\n }\r\n\r\n \/\/ --- PDF Export ---\r\n async function exportToPDF() {\r\n const element = document.getElementById('resume-template');\r\n const name = document.getElementById('name').value || 'MegaTraining_CV';\r\n \r\n const opt = {\r\n margin: 0,\r\n filename: `CV_${name.replace(\/\\s+\/g, '_')}.pdf`,\r\n image: { type: 'jpeg', quality: 0.98 },\r\n html2canvas: { scale: 2, useCORS: true, scrollY: 0 },\r\n jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }\r\n };\r\n\r\n await html2pdf().set(opt).from(element).save();\r\n }\r\n\r\n \/\/ Initialization\r\n window.onload = function() {\r\n addWorkEntry();\r\n addEducationEntry();\r\n addLanguageEntry();\r\n };\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\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>Home G\u00e9n\u00e9rateur de CV – MegaTraining MEGATRAINING Africa G\u00e9n\u00e9rateur de CV Professionnel 01. Informations Personnelles 02. Exp\u00e9rience Professionnelle + Ajouter une exp\u00e9rience 03. Formation & Certifications + Ajouter une formation 04. Comp\u00e9tences & Langues Comp\u00e9tences Techniques (Entr\u00e9e pour ajouter) + … <\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"footnotes":""},"class_list":["post-180748","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/megatraining.africa\/en\/wp-json\/wp\/v2\/pages\/180748","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/megatraining.africa\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/megatraining.africa\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/megatraining.africa\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/megatraining.africa\/en\/wp-json\/wp\/v2\/comments?post=180748"}],"version-history":[{"count":0,"href":"https:\/\/megatraining.africa\/en\/wp-json\/wp\/v2\/pages\/180748\/revisions"}],"wp:attachment":[{"href":"https:\/\/megatraining.africa\/en\/wp-json\/wp\/v2\/media?parent=180748"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}