Plan du site \u2014 Anabel<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:wght@600&family=Source+Sans+3:wght@400;600&display=swap\" rel=\"stylesheet\">\n\n<style>\n :root {\n --gold: #8B6914;\n --gold-bg: #FDF6E3;\n --gold-border: #D4A843;\n --blue: #1A5276;\n --blue-bg: #EBF5FB;\n --blue-border: #5DADE2;\n --text: #1C1C1C;\n --text-muted: #555555;\n --text-light: #888888;\n --bg: #F4F1EB;\n --bg-card: #FFFFFF;\n --border: #D8D0C4;\n --hero-bg: #2C3E50;\n --hero-text: #F0EDE8;\n --font-d: 'Playfair Display', Georgia, serif;\n --font-b: 'Source Sans 3', sans-serif;\n --r: 8px;\n }\n\n * { box-sizing: border-box; margin: 0; padding: 0; }\n\n body {\n background: var(--bg);\n color: var(--text);\n font-family: var(--font-b);\n font-size: 16px;\n line-height: 1.6;\n }\n\n \/* \u2500\u2500 Hero \u2500\u2500 *\/\n .hero {\n background: var(--hero-bg);\n color: var(--hero-text);\n padding: 3rem 1.5rem 2.5rem;\n text-align: center;\n }\n .hero-eyebrow {\n font-size: 0.78rem; font-weight: 600;\n letter-spacing: 0.18em; text-transform: uppercase;\n color: #D4A843; margin-bottom: 0.6rem;\n }\n .hero h1 {\n font-family: var(--font-d);\n font-size: clamp(1.8rem, 4vw, 2.6rem);\n margin-bottom: 0.6rem; color: #F0EDE8;\n }\n .hero h1 em { color: #D4A843; font-style: normal; }\n .hero-desc { font-size: 0.95rem; color: #B0AAA0; max-width: 520px; margin: 0 auto 1.25rem; }\n .hero-badge {\n display: inline-flex; align-items: center; gap: 0.5rem;\n font-size: 0.8rem; color: #B0AAA0;\n border: 1px solid #445566; border-radius: 100px;\n padding: 0.3rem 0.9rem; background: rgba(255,255,255,0.05);\n }\n .hero-badge .dot { width: 7px; height: 7px; border-radius: 50%; background: #D4A843; }\n\n \/* \u2500\u2500 Stats \u2500\u2500 *\/\n .stats-bar {\n background: #FFFFFF;\n border-bottom: 1px solid var(--border);\n display: flex; justify-content: center; flex-wrap: wrap;\n box-shadow: 0 1px 4px rgba(0,0,0,0.06);\n }\n .stat {\n padding: 1rem 2.5rem; text-align: center;\n border-right: 1px solid var(--border);\n }\n .stat:last-child { border-right: none; }\n .stat-val {\n font-family: var(--font-d); font-size: 1.6rem;\n color: var(--gold); display: block; font-weight: 600;\n }\n .stat-lbl { font-size: 0.72rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.08em; }\n\n \/* \u2500\u2500 Toolbar \u2500\u2500 *\/\n .toolbar {\n max-width: 1060px; margin: 1.75rem auto 0;\n padding: 0 1.25rem;\n display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;\n }\n #search-box {\n flex: 1; min-width: 200px;\n background: #FFFFFF; border: 1.5px solid var(--border);\n border-radius: var(--r); color: var(--text);\n font-family: var(--font-b); font-size: 0.9rem;\n padding: 0.55rem 1rem; outline: none;\n transition: border-color 0.15s;\n box-shadow: 0 1px 3px rgba(0,0,0,0.06);\n }\n #search-box:focus { border-color: var(--gold-border); }\n #search-box::placeholder { color: #AAAAAA; }\n\n .tabs { display: flex; gap: 0.4rem; flex-wrap: wrap; }\n .tab {\n background: #FFFFFF; border: 1.5px solid var(--border);\n border-radius: 100px; color: var(--text-muted);\n cursor: pointer; padding: 0.35rem 1rem;\n font-size: 0.83rem; font-family: var(--font-b);\n transition: all 0.15s; font-weight: 600;\n }\n .tab:hover { border-color: var(--gold-border); color: var(--gold); }\n .tab.active { background: var(--gold); border-color: var(--gold); color: #FFFFFF; }\n .tab.active.blue { background: var(--blue); border-color: var(--blue); }\n\n .view-toggle {\n margin-left: auto;\n display: flex; border: 1.5px solid var(--border);\n border-radius: var(--r); overflow: hidden;\n background: #FFFFFF;\n }\n .vbtn {\n background: transparent; border: none; cursor: pointer;\n padding: 0.45rem 0.85rem; font-size: 1rem; color: var(--text-muted);\n transition: all 0.15s;\n }\n .vbtn.active { background: var(--gold); color: #FFFFFF; }\n\n \/* \u2500\u2500 Main \u2500\u2500 *\/\n .main { max-width: 1060px; margin: 0 auto; padding: 1.75rem 1.25rem 4rem; }\n\n \/* Chargement *\/\n #loading { text-align: center; padding: 3.5rem 1rem; color: var(--text-muted); }\n .spinner {\n width: 34px; height: 34px;\n border: 3px solid #DDD; border-top-color: var(--gold-border);\n border-radius: 50%; animation: spin 0.8s linear infinite;\n margin: 0 auto 0.75rem;\n }\n @keyframes spin { to { transform: rotate(360deg); } }\n\n \/* Avertissement *\/\n .warn {\n background: #FEF9EF; border: 1px solid #F0CC88;\n border-left: 3px solid var(--gold-border);\n border-radius: var(--r); padding: 0.65rem 1rem;\n font-size: 0.83rem; color: #7A5500; margin-bottom: 1.25rem;\n }\n\n \/* \u2500\u2500 Section de type \u2500\u2500 *\/\n .type-section { margin-bottom: 2.75rem; }\n .type-header {\n display: flex; align-items: center; gap: 0.65rem;\n margin-bottom: 1.25rem; padding-bottom: 0.6rem;\n border-bottom: 2px solid var(--border);\n }\n .type-icon {\n width: 34px; height: 34px; border-radius: var(--r);\n display: flex; align-items: center; justify-content: center;\n font-size: 1rem; flex-shrink: 0;\n }\n .type-icon.gold { background: var(--gold-bg); border: 1px solid var(--gold-border); }\n .type-icon.blue { background: var(--blue-bg); border: 1px solid var(--blue-border); }\n .type-title { font-family: var(--font-d); font-size: 1.3rem; color: var(--text); }\n .type-count { margin-left: auto; font-size: 0.8rem; color: var(--text-muted); }\n\n \/* \u2500\u2500 Cat\u00e9gorie \u2500\u2500 *\/\n .cat-section { margin-bottom: 1.5rem; }\n .cat-header {\n display: flex; align-items: center; gap: 0.55rem;\n margin-bottom: 0.65rem; padding-bottom: 0.4rem;\n border-bottom: 1px solid #E8E2D8;\n }\n .cat-strip { width: 3px; height: 1.1rem; border-radius: 2px; flex-shrink: 0; }\n .cat-strip.gold { background: var(--gold-border); }\n .cat-strip.blue { background: var(--blue-border); }\n .cat-name { font-size: 0.95rem; font-weight: 600; color: var(--text); }\n .cat-badge {\n font-size: 0.72rem; font-weight: 600; border-radius: 100px;\n padding: 0.12rem 0.55rem;\n }\n .cat-badge.gold { color: var(--gold); background: var(--gold-bg); border: 1px solid #E8C87A; }\n .cat-badge.blue { color: var(--blue); background: var(--blue-bg); border: 1px solid var(--blue-border); }\n\n \/* \u2500\u2500 Grille \u2500\u2500 *\/\n .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 0.7rem; }\n .card {\n background: var(--bg-card);\n border: 1px solid var(--border);\n border-radius: var(--r);\n padding: 0.85rem 1rem;\n transition: box-shadow 0.15s, border-color 0.15s;\n display: flex; flex-direction: column; gap: 0.3rem;\n }\n .card:hover { box-shadow: 0 3px 10px rgba(0,0,0,0.09); }\n .card.gold:hover { border-color: var(--gold-border); }\n .card.blue:hover { border-color: var(--blue-border); }\n .card a {\n text-decoration: none; font-size: 0.9rem; font-weight: 600;\n line-height: 1.4; display: block;\n }\n .card.gold a { color: var(--gold); }\n .card.blue a { color: var(--blue); }\n .card a:hover { text-decoration: underline; }\n .card-date { font-size: 0.72rem; color: var(--text-light); }\n\n \/* \u2500\u2500 Liste \u2500\u2500 *\/\n .list { display: flex; flex-direction: column; }\n .row {\n display: flex; align-items: baseline; gap: 0.55rem;\n padding: 0.42rem 0.4rem; border-radius: 4px;\n border-bottom: 1px solid #EDE7DC;\n transition: background 0.12s;\n }\n .row:hover { background: #FBF8F2; }\n .row.blue:hover { background: #EBF5FB; }\n .row::before { content: '\u203a'; font-size: 1rem; flex-shrink: 0; width: 12px; text-align: center; }\n .row.gold::before { color: var(--gold-border); }\n .row.blue::before { color: var(--blue-border); }\n .row a { text-decoration: none; font-size: 0.9rem; flex: 1; }\n .row.gold a { color: var(--gold); }\n .row.blue a { color: var(--blue); }\n .row a:hover { text-decoration: underline; }\n .row-date { font-size: 0.72rem; color: var(--text-light); flex-shrink: 0; white-space: nowrap; }\n\n \/* \u2500\u2500 Listings manuels \u2500\u2500 *\/\n .manual-section { margin-bottom: 2.75rem; }\n .manual-table {\n width: 100%; border-collapse: collapse;\n background: var(--bg-card); border-radius: var(--r);\n overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,0.06);\n font-size: 0.9rem;\n }\n .manual-table th {\n background: #2C3E50; color: #F0EDE8;\n padding: 0.65rem 1rem; text-align: left; font-weight: 600;\n font-size: 0.8rem; letter-spacing: 0.05em; text-transform: uppercase;\n }\n .manual-table td {\n padding: 0.6rem 1rem; border-bottom: 1px solid #EDE7DC; color: var(--text);\n }\n .manual-table tr:last-child td { border-bottom: none; }\n .manual-table tr:hover td { background: #FBF8F2; }\n .manual-table a { color: #1A5276; text-decoration: none; font-weight: 600; }\n .manual-table a:hover { text-decoration: underline; }\n .cat-pill {\n display: inline-block; font-size: 0.72rem; font-weight: 600;\n background: #EBF5FB; color: #1A5276; border: 1px solid #AED6F1;\n border-radius: 100px; padding: 0.1rem 0.55rem;\n }\n\n \/* \u2500\u2500 Aucun r\u00e9sultat \u2500\u2500 *\/\n .empty { text-align: center; padding: 2rem; color: var(--text-muted); font-size: 0.9rem; }\n\n \/* \u2500\u2500 Source \u2500\u2500 *\/\n .footnote { max-width: 1060px; margin: 0 auto; padding: 0 1.25rem 2.5rem; }\n .source-box {\n background: var(--bg-card); border: 1px solid var(--border);\n border-left: 3px solid var(--gold-border); border-radius: var(--r);\n padding: 0.85rem 1.1rem; font-size: 0.82rem; color: var(--text-muted);\n }\n .source-box strong { color: var(--text); }\n .source-box code {\n font-size: 0.78rem; background: #F0EDE8;\n padding: 0.1rem 0.35rem; border-radius: 3px; color: var(--text);\n }\n\n @media (max-width: 600px) {\n .stat { padding: 0.75rem 1.25rem; }\n .row-date { display: none; }\n .hero { padding: 2rem 1rem 1.75rem; }\n .manual-table td:last-child { display: none; }\n }\n<\/style>\n<\/head>\n<body>\n\n\n<div class=\"hero\">\n <div class=\"hero-eyebrow\">anabel.be\/web<\/div>\n <h1>Plan du <em>site<\/em><\/h1>\n <p class=\"hero-desc\">Tous les contenus publi\u00e9s, mis \u00e0 jour automatiquement \u00e0 chaque nouvelle publication.<\/p>\n <div class=\"hero-badge\"><span class=\"dot\"><\/span><span id=\"last-update\">Chargement\u2026<\/span><\/div>\n<\/div>\n\n\n<div class=\"stats-bar\">\n <div class=\"stat\"><span class=\"stat-val\" id=\"s-posts\">\u2014<\/span><span class=\"stat-lbl\">Articles<\/span><\/div>\n <div class=\"stat\"><span class=\"stat-val\" id=\"s-pages\">\u2014<\/span><span class=\"stat-lbl\">Pages<\/span><\/div>\n <div class=\"stat\"><span class=\"stat-val\" id=\"s-listings\">\u2014<\/span><span class=\"stat-lbl\">Listings<\/span><\/div>\n <div class=\"stat\"><span class=\"stat-val\" id=\"s-total\">\u2014<\/span><span class=\"stat-lbl\">Total<\/span><\/div>\n<\/div>\n\n\n<div class=\"toolbar\">\n <input type=\"text\" id=\"search-box\" placeholder=\"\ud83d\udd0d Filtrer\u2026\" oninput=\"onSearch(this.value)\">\n <div class=\"tabs\">\n <button class=\"tab active\" data-t=\"all\" onclick=\"setTab('all')\">Tout<\/button>\n <button class=\"tab\" data-t=\"posts\" onclick=\"setTab('posts')\">\ud83d\udcf0 Articles<\/button>\n <button class=\"tab blue\" data-t=\"pages\" onclick=\"setTab('pages')\">\ud83d\udcc4 Pages<\/button>\n <button class=\"tab\" data-t=\"listings\" onclick=\"setTab('listings')\">\ud83d\udccb Listings<\/button>\n <\/div>\n <div class=\"view-toggle\">\n <button class=\"vbtn active\" id=\"vg\" onclick=\"setView('grid')\" title=\"Grille\">\u229e<\/button>\n <button class=\"vbtn\" id=\"vl\" onclick=\"setView('list')\" title=\"Liste\">\u2261<\/button>\n <\/div>\n<\/div>\n\n\n<main class=\"main\" id=\"main\">\n <div id=\"loading\"><div class=\"spinner\"><\/div><p>Chargement depuis WordPress\u2026<\/p><\/div>\n<\/main>\n\n\n<div class=\"footnote\">\n <div class=\"source-box\">\n <strong>Votre publicit\u00e9 sur Anabel.be :<\/strong> Contactez-nous.\n <\/div>\n<\/div>\n\n<script>\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n CONFIGURATION \u2014 Listings manuels\n Ajoutez \/ modifiez \/ supprimez des entr\u00e9es ici.\n Format : { titre, url, categorie }\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nconst LISTINGS_MANUELS = [\n \/* Exemples \u2014 remplacer par vos vrais listings *\/\n { titre: \"Provinces belges\", url: \"https:\/\/anabel.be\/web\/listing-category\/provinces\/\", categorie: \"Provinces\" },\n { titre: \"Communes de Belgique\", url: \"https:\/\/anabel.be\/web\/listing-category\/communes\/\", categorie: \"Communes\" },\n { titre: \"R\u00e9gions et communaut\u00e9s\", url: \"\/web\/listing-category\/regions-et-communautes\/\", categorie: \"R\u00e9gions\" },\n \/* Ajoutez d'autres lignes ici *\/\n];\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n CODE \u2014 ne pas modifier sauf si vous savez\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nconst BASE = 'https:\/\/anabel.be\/web\/wp-json\/wp\/v2';\nlet DATA = { posts: [], pages: [] };\nlet catMap = {};\nlet view = 'grid', activeTab = 'all', q = '';\n\nfunction decodeHtml(s) { const t = document.createElement('textarea'); t.innerHTML = s; return t.value; }\nfunction esc(s) { return String(s).replace(\/&\/g,'&').replace(\/<\/g,'<').replace(\/>\/g,'>').replace(\/\"\/g,'"'); }\nfunction fmtDate(iso) {\n if (!iso) return '';\n return new Date(iso).toLocaleDateString('fr-BE', { day:'numeric', month:'short', year:'numeric' });\n}\n\nasync function safeFetch(url) {\n try { const r = await fetch(url); return r.ok ? r.json() : []; }\n catch(e) { return []; }\n}\n\nasync function fetchAll(endpoint) {\n let page = 1, out = [];\n while (true) {\n let r;\n try { r = await fetch(`${BASE}\/${endpoint}&page=${page}&per_page=100`); }\n catch(e) { break; }\n if (!r.ok) break;\n let data;\n try { data = await r.json(); } catch(e) { break; }\n if (!Array.isArray(data) || !data.length) break;\n out = out.concat(data);\n const total = parseInt(r.headers.get('X-WP-TotalPages') || '1');\n if (page >= total) break;\n page++;\n }\n return out;\n}\n\nasync function load() {\n const [posts, cats, pages] = await Promise.all([\n fetchAll('posts?_fields=id,title,link,date,categories&orderby=date&order=desc'),\n safeFetch(`${BASE}\/categories?per_page=100&_fields=id,name`),\n fetchAll('pages?_fields=id,title,link,date,parent,menu_order&orderby=menu_order&order=asc')\n ]);\n\n (Array.isArray(cats) ? cats : []).forEach(c => { catMap[c.id] = c.name; });\n catMap[1] = catMap[1] || 'Non classifi\u00e9';\n\n DATA.posts = posts;\n DATA.pages = pages;\n\n const total = posts.length + pages.length + LISTINGS_MANUELS.length;\n document.getElementById('s-posts').textContent = posts.length || '0';\n document.getElementById('s-pages').textContent = pages.length || '0';\n document.getElementById('s-listings').textContent = LISTINGS_MANUELS.length || '0';\n document.getElementById('s-total').textContent = total;\n document.getElementById('last-update').textContent =\n 'Mis \u00e0 jour le ' + new Date().toLocaleDateString('fr-BE', { day:'numeric', month:'long', year:'numeric' });\n\n document.getElementById('loading').style.display = 'none';\n\n if (!posts.length && !pages.length) {\n document.getElementById('main').innerHTML =\n '<div class=\"warn\">Impossible de contacter l\\'API WordPress. V\u00e9rifiez que la page est bien int\u00e9gr\u00e9e dans anabel.be\/web.<\/div>';\n return;\n }\n render();\n}\n\n\/* \u2500\u2500 Rendu \u2500\u2500 *\/\nfunction render() {\n const main = document.getElementById('main');\n main.innerHTML = '';\n const qLow = q.toLowerCase().trim();\n function hit(title, extra) {\n if (!qLow) return true;\n return decodeHtml(title).toLowerCase().includes(qLow) || (extra||'').toLowerCase().includes(qLow);\n }\n\n let any = false;\n\n \/* Articles *\/\n if (activeTab === 'all' || activeTab === 'posts') {\n const filtered = DATA.posts.filter(p => hit(p.title.rendered, catMap[p.categories?.[0]??1]));\n if (filtered.length) { any = true; main.appendChild(buildPosts(filtered)); }\n }\n\n \/* Pages *\/\n if (activeTab === 'all' || activeTab === 'pages') {\n const filtered = DATA.pages.filter(p => hit(p.title.rendered, ''));\n if (filtered.length) { any = true; main.appendChild(buildPages(filtered)); }\n }\n\n \/* Listings manuels *\/\n if (activeTab === 'all' || activeTab === 'listings') {\n const filtered = LISTINGS_MANUELS.filter(l =>\n !qLow || l.titre.toLowerCase().includes(qLow) || l.categorie.toLowerCase().includes(qLow)\n );\n if (filtered.length) { any = true; main.appendChild(buildListings(filtered)); }\n }\n\n if (!any) main.innerHTML = '<div class=\"empty\">Aucun contenu ne correspond \u00e0 votre recherche.<\/div>';\n}\n\n\/* \u2500\u2500 Section Articles \u2500\u2500 *\/\nfunction buildPosts(posts) {\n const sec = el('div', 'type-section');\n sec.innerHTML = `<div class=\"type-header\">\n <div class=\"type-icon gold\">\ud83d\udcf0<\/div>\n <span class=\"type-title\">Articles<\/span>\n <span class=\"type-count\">${posts.length} article${posts.length>1?'s':''}<\/span>\n <\/div>`;\n\n const groups = {}, order = [];\n posts.forEach(p => {\n const cid = p.categories?.[0] ?? 1;\n if (!groups[cid]) { groups[cid] = []; order.push(cid); }\n groups[cid].push(p);\n });\n order.sort((a,b) => {\n if (catMap[a]==='Non classifi\u00e9') return 1;\n if (catMap[b]==='Non classifi\u00e9') return -1;\n return (catMap[a]||'').localeCompare(catMap[b]||'','fr');\n });\n order.forEach(cid => {\n const name = catMap[cid] || 'Non classifi\u00e9';\n const items = groups[cid];\n const cs = el('div','cat-section');\n cs.innerHTML = `<div class=\"cat-header\">\n <div class=\"cat-strip gold\"><\/div>\n <span class=\"cat-name\">${esc(name)}<\/span>\n <span class=\"cat-badge gold\">${items.length}<\/span>\n <\/div>`;\n const wrap = el('div', view==='grid'?'grid':'list');\n items.forEach(p => wrap.appendChild(makeCard(p,'gold')));\n cs.appendChild(wrap);\n sec.appendChild(cs);\n });\n return sec;\n}\n\n\/* \u2500\u2500 Section Pages \u2500\u2500 *\/\nfunction buildPages(pages) {\n const sec = el('div','type-section');\n sec.innerHTML = `<div class=\"type-header\">\n <div class=\"type-icon blue\">\ud83d\udcc4<\/div>\n <span class=\"type-title\">Pages<\/span>\n <span class=\"type-count\">${pages.length} page${pages.length>1?'s':''}<\/span>\n <\/div>`;\n\n \/* Hi\u00e9rarchie parent \u2192 enfants *\/\n const byParent = {};\n pages.forEach(p => {\n const key = p.parent || 0;\n if (!byParent[key]) byParent[key] = [];\n byParent[key].push(p);\n });\n const roots = byParent[0] || pages;\n const hasChildren = pages.some(p => p.parent && p.parent !== 0);\n\n if (!hasChildren) {\n const cs = el('div','cat-section');\n cs.innerHTML = `<div class=\"cat-header\">\n <div class=\"cat-strip blue\"><\/div>\n <span class=\"cat-name\">Toutes les pages<\/span>\n <span class=\"cat-badge blue\">${pages.length}<\/span>\n <\/div>`;\n const wrap = el('div', view==='grid'?'grid':'list');\n pages.forEach(p => wrap.appendChild(makeCard(p,'blue')));\n cs.appendChild(wrap);\n sec.appendChild(cs);\n } else {\n roots.forEach(root => {\n const children = byParent[root.id] || [];\n const cs = el('div','cat-section');\n cs.innerHTML = `<div class=\"cat-header\">\n <div class=\"cat-strip blue\"><\/div>\n <span class=\"cat-name\">${esc(decodeHtml(root.title.rendered))}<\/span>\n <span class=\"cat-badge blue\">${1 + children.length}<\/span>\n <\/div>`;\n const wrap = el('div', view==='grid'?'grid':'list');\n wrap.appendChild(makeCard(root,'blue'));\n children.forEach(c => wrap.appendChild(makeCard(c,'blue')));\n cs.appendChild(wrap);\n sec.appendChild(cs);\n });\n }\n return sec;\n}\n\n\/* \u2500\u2500 Section Listings manuels \u2500\u2500 *\/\nfunction buildListings(listings) {\n const sec = el('div','manual-section');\n sec.innerHTML = `<div class=\"type-header\">\n <div class=\"type-icon\" style=\"background:#F0FFF4;border:1px solid #68B984;\">\ud83d\udccb<\/div>\n <span class=\"type-title\">Listings<\/span>\n <span class=\"type-count\">${listings.length} listing${listings.length>1?'s':''} \u00b7 gestion manuelle<\/span>\n <\/div>`;\n\n const table = document.createElement('table');\n table.className = 'manual-table';\n table.innerHTML = `<thead><tr>\n <th>Titre \/ Lien<\/th>\n <th>Cat\u00e9gorie<\/th>\n <\/tr><\/thead>`;\n const tbody = document.createElement('tbody');\n listings.forEach(l => {\n const tr = document.createElement('tr');\n tr.innerHTML = `<td><a href=\"${esc(l.url)}\" target=\"_blank\" rel=\"noopener\">${esc(l.titre)}<\/a><\/td>\n <td><span class=\"cat-pill\">${esc(l.categorie)}<\/span><\/td>`;\n tbody.appendChild(tr);\n });\n table.appendChild(tbody);\n sec.appendChild(table);\n return sec;\n}\n\n\/* \u2500\u2500 Carte \/ Ligne \u2500\u2500 *\/\nfunction makeCard(p, color) {\n const title = decodeHtml(p.title.rendered);\n const date = fmtDate(p.date);\n const link = p.link;\n if (view === 'grid') {\n const d = el('div', `card ${color}`);\n d.innerHTML = `<a href=\"${esc(link)}\" target=\"_blank\" rel=\"noopener\">${esc(title)}<\/a>\n <span class=\"card-date\">${esc(date)}<\/span>`;\n return d;\n } else {\n const d = el('div', `row ${color}`);\n d.innerHTML = `<a href=\"${esc(link)}\" target=\"_blank\" rel=\"noopener\">${esc(title)}<\/a>\n <span class=\"row-date\">${esc(date)}<\/span>`;\n return d;\n }\n}\n\nfunction el(tag, cls) { const e = document.createElement(tag); if(cls) e.className = cls; return e; }\n\n\/* \u2500\u2500 Contr\u00f4les \u2500\u2500 *\/\nfunction onSearch(v) { q = v; render(); }\nfunction setTab(t) {\n activeTab = t;\n document.querySelectorAll('.tab').forEach(b => b.classList.toggle('active', b.dataset.t === t));\n render();\n}\nfunction setView(v) {\n view = v;\n document.getElementById('vg').classList.toggle('active', v==='grid');\n document.getElementById('vl').classList.toggle('active', v==='list');\n render();\n}\n\nload();\n<\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Plan du site \u2014 Anabel anabel.be\/web Plan du site Tous les contenus publi\u00e9s, mis \u00e0 jour automatiquement \u00e0 chaque nouvelle publication. Chargement\u2026 \u2014Articles \u2014Pages \u2014Listings \u2014Total Tout \ud83d\udcf0 Articles \ud83d\udcc4 Pages \ud83d\udccb Listings \u229e \u2261 Chargement depuis WordPress\u2026 Votre publicit\u00e9 sur Anabel.be : Contactez-nous.<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-534","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/pages\/534","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/comments?post=534"}],"version-history":[{"count":13,"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/pages\/534\/revisions"}],"predecessor-version":[{"id":640,"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/pages\/534\/revisions\/640"}],"wp:attachment":[{"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/media?parent=534"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":534,"date":"2026-04-08T14:20:27","date_gmt":"2026-04-08T12:20:27","guid":{"rendered":"https:\/\/www.anabel.be\/web\/?page_id=534"},"modified":"2026-04-14T22:14:19","modified_gmt":"2026-04-14T20:14:19","slug":"sitemap","status":"publish","type":"page","link":"https:\/\/www.anabel.be\/web\/sitemap\/","title":{"rendered":"Plan du site"},"content":{"rendered":"\n\n\n\n\n\nPlan du site \u2014 Anabel<\/title>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:wght@600&family=Source+Sans+3:wght@400;600&display=swap\" rel=\"stylesheet\">\n\n<style>\n :root {\n --gold: #8B6914;\n --gold-bg: #FDF6E3;\n --gold-border: #D4A843;\n --blue: #1A5276;\n --blue-bg: #EBF5FB;\n --blue-border: #5DADE2;\n --text: #1C1C1C;\n --text-muted: #555555;\n --text-light: #888888;\n --bg: #F4F1EB;\n --bg-card: #FFFFFF;\n --border: #D8D0C4;\n --hero-bg: #2C3E50;\n --hero-text: #F0EDE8;\n --font-d: 'Playfair Display', Georgia, serif;\n --font-b: 'Source Sans 3', sans-serif;\n --r: 8px;\n }\n\n * { box-sizing: border-box; margin: 0; padding: 0; }\n\n body {\n background: var(--bg);\n color: var(--text);\n font-family: var(--font-b);\n font-size: 16px;\n line-height: 1.6;\n }\n\n \/* \u2500\u2500 Hero \u2500\u2500 *\/\n .hero {\n background: var(--hero-bg);\n color: var(--hero-text);\n padding: 3rem 1.5rem 2.5rem;\n text-align: center;\n }\n .hero-eyebrow {\n font-size: 0.78rem; font-weight: 600;\n letter-spacing: 0.18em; text-transform: uppercase;\n color: #D4A843; margin-bottom: 0.6rem;\n }\n .hero h1 {\n font-family: var(--font-d);\n font-size: clamp(1.8rem, 4vw, 2.6rem);\n margin-bottom: 0.6rem; color: #F0EDE8;\n }\n .hero h1 em { color: #D4A843; font-style: normal; }\n .hero-desc { font-size: 0.95rem; color: #B0AAA0; max-width: 520px; margin: 0 auto 1.25rem; }\n .hero-badge {\n display: inline-flex; align-items: center; gap: 0.5rem;\n font-size: 0.8rem; color: #B0AAA0;\n border: 1px solid #445566; border-radius: 100px;\n padding: 0.3rem 0.9rem; background: rgba(255,255,255,0.05);\n }\n .hero-badge .dot { width: 7px; height: 7px; border-radius: 50%; background: #D4A843; }\n\n \/* \u2500\u2500 Stats \u2500\u2500 *\/\n .stats-bar {\n background: #FFFFFF;\n border-bottom: 1px solid var(--border);\n display: flex; justify-content: center; flex-wrap: wrap;\n box-shadow: 0 1px 4px rgba(0,0,0,0.06);\n }\n .stat {\n padding: 1rem 2.5rem; text-align: center;\n border-right: 1px solid var(--border);\n }\n .stat:last-child { border-right: none; }\n .stat-val {\n font-family: var(--font-d); font-size: 1.6rem;\n color: var(--gold); display: block; font-weight: 600;\n }\n .stat-lbl { font-size: 0.72rem; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.08em; }\n\n \/* \u2500\u2500 Toolbar \u2500\u2500 *\/\n .toolbar {\n max-width: 1060px; margin: 1.75rem auto 0;\n padding: 0 1.25rem;\n display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;\n }\n #search-box {\n flex: 1; min-width: 200px;\n background: #FFFFFF; border: 1.5px solid var(--border);\n border-radius: var(--r); color: var(--text);\n font-family: var(--font-b); font-size: 0.9rem;\n padding: 0.55rem 1rem; outline: none;\n transition: border-color 0.15s;\n box-shadow: 0 1px 3px rgba(0,0,0,0.06);\n }\n #search-box:focus { border-color: var(--gold-border); }\n #search-box::placeholder { color: #AAAAAA; }\n\n .tabs { display: flex; gap: 0.4rem; flex-wrap: wrap; }\n .tab {\n background: #FFFFFF; border: 1.5px solid var(--border);\n border-radius: 100px; color: var(--text-muted);\n cursor: pointer; padding: 0.35rem 1rem;\n font-size: 0.83rem; font-family: var(--font-b);\n transition: all 0.15s; font-weight: 600;\n }\n .tab:hover { border-color: var(--gold-border); color: var(--gold); }\n .tab.active { background: var(--gold); border-color: var(--gold); color: #FFFFFF; }\n .tab.active.blue { background: var(--blue); border-color: var(--blue); }\n\n .view-toggle {\n margin-left: auto;\n display: flex; border: 1.5px solid var(--border);\n border-radius: var(--r); overflow: hidden;\n background: #FFFFFF;\n }\n .vbtn {\n background: transparent; border: none; cursor: pointer;\n padding: 0.45rem 0.85rem; font-size: 1rem; color: var(--text-muted);\n transition: all 0.15s;\n }\n .vbtn.active { background: var(--gold); color: #FFFFFF; }\n\n \/* \u2500\u2500 Main \u2500\u2500 *\/\n .main { max-width: 1060px; margin: 0 auto; padding: 1.75rem 1.25rem 4rem; }\n\n \/* Chargement *\/\n #loading { text-align: center; padding: 3.5rem 1rem; color: var(--text-muted); }\n .spinner {\n width: 34px; height: 34px;\n border: 3px solid #DDD; border-top-color: var(--gold-border);\n border-radius: 50%; animation: spin 0.8s linear infinite;\n margin: 0 auto 0.75rem;\n }\n @keyframes spin { to { transform: rotate(360deg); } }\n\n \/* Avertissement *\/\n .warn {\n background: #FEF9EF; border: 1px solid #F0CC88;\n border-left: 3px solid var(--gold-border);\n border-radius: var(--r); padding: 0.65rem 1rem;\n font-size: 0.83rem; color: #7A5500; margin-bottom: 1.25rem;\n }\n\n \/* \u2500\u2500 Section de type \u2500\u2500 *\/\n .type-section { margin-bottom: 2.75rem; }\n .type-header {\n display: flex; align-items: center; gap: 0.65rem;\n margin-bottom: 1.25rem; padding-bottom: 0.6rem;\n border-bottom: 2px solid var(--border);\n }\n .type-icon {\n width: 34px; height: 34px; border-radius: var(--r);\n display: flex; align-items: center; justify-content: center;\n font-size: 1rem; flex-shrink: 0;\n }\n .type-icon.gold { background: var(--gold-bg); border: 1px solid var(--gold-border); }\n .type-icon.blue { background: var(--blue-bg); border: 1px solid var(--blue-border); }\n .type-title { font-family: var(--font-d); font-size: 1.3rem; color: var(--text); }\n .type-count { margin-left: auto; font-size: 0.8rem; color: var(--text-muted); }\n\n \/* \u2500\u2500 Cat\u00e9gorie \u2500\u2500 *\/\n .cat-section { margin-bottom: 1.5rem; }\n .cat-header {\n display: flex; align-items: center; gap: 0.55rem;\n margin-bottom: 0.65rem; padding-bottom: 0.4rem;\n border-bottom: 1px solid #E8E2D8;\n }\n .cat-strip { width: 3px; height: 1.1rem; border-radius: 2px; flex-shrink: 0; }\n .cat-strip.gold { background: var(--gold-border); }\n .cat-strip.blue { background: var(--blue-border); }\n .cat-name { font-size: 0.95rem; font-weight: 600; color: var(--text); }\n .cat-badge {\n font-size: 0.72rem; font-weight: 600; border-radius: 100px;\n padding: 0.12rem 0.55rem;\n }\n .cat-badge.gold { color: var(--gold); background: var(--gold-bg); border: 1px solid #E8C87A; }\n .cat-badge.blue { color: var(--blue); background: var(--blue-bg); border: 1px solid var(--blue-border); }\n\n \/* \u2500\u2500 Grille \u2500\u2500 *\/\n .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(255px, 1fr)); gap: 0.7rem; }\n .card {\n background: var(--bg-card);\n border: 1px solid var(--border);\n border-radius: var(--r);\n padding: 0.85rem 1rem;\n transition: box-shadow 0.15s, border-color 0.15s;\n display: flex; flex-direction: column; gap: 0.3rem;\n }\n .card:hover { box-shadow: 0 3px 10px rgba(0,0,0,0.09); }\n .card.gold:hover { border-color: var(--gold-border); }\n .card.blue:hover { border-color: var(--blue-border); }\n .card a {\n text-decoration: none; font-size: 0.9rem; font-weight: 600;\n line-height: 1.4; display: block;\n }\n .card.gold a { color: var(--gold); }\n .card.blue a { color: var(--blue); }\n .card a:hover { text-decoration: underline; }\n .card-date { font-size: 0.72rem; color: var(--text-light); }\n\n \/* \u2500\u2500 Liste \u2500\u2500 *\/\n .list { display: flex; flex-direction: column; }\n .row {\n display: flex; align-items: baseline; gap: 0.55rem;\n padding: 0.42rem 0.4rem; border-radius: 4px;\n border-bottom: 1px solid #EDE7DC;\n transition: background 0.12s;\n }\n .row:hover { background: #FBF8F2; }\n .row.blue:hover { background: #EBF5FB; }\n .row::before { content: '\u203a'; font-size: 1rem; flex-shrink: 0; width: 12px; text-align: center; }\n .row.gold::before { color: var(--gold-border); }\n .row.blue::before { color: var(--blue-border); }\n .row a { text-decoration: none; font-size: 0.9rem; flex: 1; }\n .row.gold a { color: var(--gold); }\n .row.blue a { color: var(--blue); }\n .row a:hover { text-decoration: underline; }\n .row-date { font-size: 0.72rem; color: var(--text-light); flex-shrink: 0; white-space: nowrap; }\n\n \/* \u2500\u2500 Listings manuels \u2500\u2500 *\/\n .manual-section { margin-bottom: 2.75rem; }\n .manual-table {\n width: 100%; border-collapse: collapse;\n background: var(--bg-card); border-radius: var(--r);\n overflow: hidden; box-shadow: 0 1px 4px rgba(0,0,0,0.06);\n font-size: 0.9rem;\n }\n .manual-table th {\n background: #2C3E50; color: #F0EDE8;\n padding: 0.65rem 1rem; text-align: left; font-weight: 600;\n font-size: 0.8rem; letter-spacing: 0.05em; text-transform: uppercase;\n }\n .manual-table td {\n padding: 0.6rem 1rem; border-bottom: 1px solid #EDE7DC; color: var(--text);\n }\n .manual-table tr:last-child td { border-bottom: none; }\n .manual-table tr:hover td { background: #FBF8F2; }\n .manual-table a { color: #1A5276; text-decoration: none; font-weight: 600; }\n .manual-table a:hover { text-decoration: underline; }\n .cat-pill {\n display: inline-block; font-size: 0.72rem; font-weight: 600;\n background: #EBF5FB; color: #1A5276; border: 1px solid #AED6F1;\n border-radius: 100px; padding: 0.1rem 0.55rem;\n }\n\n \/* \u2500\u2500 Aucun r\u00e9sultat \u2500\u2500 *\/\n .empty { text-align: center; padding: 2rem; color: var(--text-muted); font-size: 0.9rem; }\n\n \/* \u2500\u2500 Source \u2500\u2500 *\/\n .footnote { max-width: 1060px; margin: 0 auto; padding: 0 1.25rem 2.5rem; }\n .source-box {\n background: var(--bg-card); border: 1px solid var(--border);\n border-left: 3px solid var(--gold-border); border-radius: var(--r);\n padding: 0.85rem 1.1rem; font-size: 0.82rem; color: var(--text-muted);\n }\n .source-box strong { color: var(--text); }\n .source-box code {\n font-size: 0.78rem; background: #F0EDE8;\n padding: 0.1rem 0.35rem; border-radius: 3px; color: var(--text);\n }\n\n @media (max-width: 600px) {\n .stat { padding: 0.75rem 1.25rem; }\n .row-date { display: none; }\n .hero { padding: 2rem 1rem 1.75rem; }\n .manual-table td:last-child { display: none; }\n }\n<\/style>\n<\/head>\n<body>\n\n\n<div class=\"hero\">\n <div class=\"hero-eyebrow\">anabel.be\/web<\/div>\n <h1>Plan du <em>site<\/em><\/h1>\n <p class=\"hero-desc\">Tous les contenus publi\u00e9s, mis \u00e0 jour automatiquement \u00e0 chaque nouvelle publication.<\/p>\n <div class=\"hero-badge\"><span class=\"dot\"><\/span><span id=\"last-update\">Chargement\u2026<\/span><\/div>\n<\/div>\n\n\n<div class=\"stats-bar\">\n <div class=\"stat\"><span class=\"stat-val\" id=\"s-posts\">\u2014<\/span><span class=\"stat-lbl\">Articles<\/span><\/div>\n <div class=\"stat\"><span class=\"stat-val\" id=\"s-pages\">\u2014<\/span><span class=\"stat-lbl\">Pages<\/span><\/div>\n <div class=\"stat\"><span class=\"stat-val\" id=\"s-listings\">\u2014<\/span><span class=\"stat-lbl\">Listings<\/span><\/div>\n <div class=\"stat\"><span class=\"stat-val\" id=\"s-total\">\u2014<\/span><span class=\"stat-lbl\">Total<\/span><\/div>\n<\/div>\n\n\n<div class=\"toolbar\">\n <input type=\"text\" id=\"search-box\" placeholder=\"\ud83d\udd0d Filtrer\u2026\" oninput=\"onSearch(this.value)\">\n <div class=\"tabs\">\n <button class=\"tab active\" data-t=\"all\" onclick=\"setTab('all')\">Tout<\/button>\n <button class=\"tab\" data-t=\"posts\" onclick=\"setTab('posts')\">\ud83d\udcf0 Articles<\/button>\n <button class=\"tab blue\" data-t=\"pages\" onclick=\"setTab('pages')\">\ud83d\udcc4 Pages<\/button>\n <button class=\"tab\" data-t=\"listings\" onclick=\"setTab('listings')\">\ud83d\udccb Listings<\/button>\n <\/div>\n <div class=\"view-toggle\">\n <button class=\"vbtn active\" id=\"vg\" onclick=\"setView('grid')\" title=\"Grille\">\u229e<\/button>\n <button class=\"vbtn\" id=\"vl\" onclick=\"setView('list')\" title=\"Liste\">\u2261<\/button>\n <\/div>\n<\/div>\n\n\n<main class=\"main\" id=\"main\">\n <div id=\"loading\"><div class=\"spinner\"><\/div><p>Chargement depuis WordPress\u2026<\/p><\/div>\n<\/main>\n\n\n<div class=\"footnote\">\n <div class=\"source-box\">\n <strong>Votre publicit\u00e9 sur Anabel.be :<\/strong> Contactez-nous.\n <\/div>\n<\/div>\n\n<script>\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n CONFIGURATION \u2014 Listings manuels\n Ajoutez \/ modifiez \/ supprimez des entr\u00e9es ici.\n Format : { titre, url, categorie }\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nconst LISTINGS_MANUELS = [\n \/* Exemples \u2014 remplacer par vos vrais listings *\/\n { titre: \"Provinces belges\", url: \"https:\/\/anabel.be\/web\/listing-category\/provinces\/\", categorie: \"Provinces\" },\n { titre: \"Communes de Belgique\", url: \"https:\/\/anabel.be\/web\/listing-category\/communes\/\", categorie: \"Communes\" },\n { titre: \"R\u00e9gions et communaut\u00e9s\", url: \"\/web\/listing-category\/regions-et-communautes\/\", categorie: \"R\u00e9gions\" },\n \/* Ajoutez d'autres lignes ici *\/\n];\n\n\/* \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\n CODE \u2014 ne pas modifier sauf si vous savez\n \u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550\u2550 *\/\nconst BASE = 'https:\/\/anabel.be\/web\/wp-json\/wp\/v2';\nlet DATA = { posts: [], pages: [] };\nlet catMap = {};\nlet view = 'grid', activeTab = 'all', q = '';\n\nfunction decodeHtml(s) { const t = document.createElement('textarea'); t.innerHTML = s; return t.value; }\nfunction esc(s) { return String(s).replace(\/&\/g,'&').replace(\/<\/g,'<').replace(\/>\/g,'>').replace(\/\"\/g,'"'); }\nfunction fmtDate(iso) {\n if (!iso) return '';\n return new Date(iso).toLocaleDateString('fr-BE', { day:'numeric', month:'short', year:'numeric' });\n}\n\nasync function safeFetch(url) {\n try { const r = await fetch(url); return r.ok ? r.json() : []; }\n catch(e) { return []; }\n}\n\nasync function fetchAll(endpoint) {\n let page = 1, out = [];\n while (true) {\n let r;\n try { r = await fetch(`${BASE}\/${endpoint}&page=${page}&per_page=100`); }\n catch(e) { break; }\n if (!r.ok) break;\n let data;\n try { data = await r.json(); } catch(e) { break; }\n if (!Array.isArray(data) || !data.length) break;\n out = out.concat(data);\n const total = parseInt(r.headers.get('X-WP-TotalPages') || '1');\n if (page >= total) break;\n page++;\n }\n return out;\n}\n\nasync function load() {\n const [posts, cats, pages] = await Promise.all([\n fetchAll('posts?_fields=id,title,link,date,categories&orderby=date&order=desc'),\n safeFetch(`${BASE}\/categories?per_page=100&_fields=id,name`),\n fetchAll('pages?_fields=id,title,link,date,parent,menu_order&orderby=menu_order&order=asc')\n ]);\n\n (Array.isArray(cats) ? cats : []).forEach(c => { catMap[c.id] = c.name; });\n catMap[1] = catMap[1] || 'Non classifi\u00e9';\n\n DATA.posts = posts;\n DATA.pages = pages;\n\n const total = posts.length + pages.length + LISTINGS_MANUELS.length;\n document.getElementById('s-posts').textContent = posts.length || '0';\n document.getElementById('s-pages').textContent = pages.length || '0';\n document.getElementById('s-listings').textContent = LISTINGS_MANUELS.length || '0';\n document.getElementById('s-total').textContent = total;\n document.getElementById('last-update').textContent =\n 'Mis \u00e0 jour le ' + new Date().toLocaleDateString('fr-BE', { day:'numeric', month:'long', year:'numeric' });\n\n document.getElementById('loading').style.display = 'none';\n\n if (!posts.length && !pages.length) {\n document.getElementById('main').innerHTML =\n '<div class=\"warn\">Impossible de contacter l\\'API WordPress. V\u00e9rifiez que la page est bien int\u00e9gr\u00e9e dans anabel.be\/web.<\/div>';\n return;\n }\n render();\n}\n\n\/* \u2500\u2500 Rendu \u2500\u2500 *\/\nfunction render() {\n const main = document.getElementById('main');\n main.innerHTML = '';\n const qLow = q.toLowerCase().trim();\n function hit(title, extra) {\n if (!qLow) return true;\n return decodeHtml(title).toLowerCase().includes(qLow) || (extra||'').toLowerCase().includes(qLow);\n }\n\n let any = false;\n\n \/* Articles *\/\n if (activeTab === 'all' || activeTab === 'posts') {\n const filtered = DATA.posts.filter(p => hit(p.title.rendered, catMap[p.categories?.[0]??1]));\n if (filtered.length) { any = true; main.appendChild(buildPosts(filtered)); }\n }\n\n \/* Pages *\/\n if (activeTab === 'all' || activeTab === 'pages') {\n const filtered = DATA.pages.filter(p => hit(p.title.rendered, ''));\n if (filtered.length) { any = true; main.appendChild(buildPages(filtered)); }\n }\n\n \/* Listings manuels *\/\n if (activeTab === 'all' || activeTab === 'listings') {\n const filtered = LISTINGS_MANUELS.filter(l =>\n !qLow || l.titre.toLowerCase().includes(qLow) || l.categorie.toLowerCase().includes(qLow)\n );\n if (filtered.length) { any = true; main.appendChild(buildListings(filtered)); }\n }\n\n if (!any) main.innerHTML = '<div class=\"empty\">Aucun contenu ne correspond \u00e0 votre recherche.<\/div>';\n}\n\n\/* \u2500\u2500 Section Articles \u2500\u2500 *\/\nfunction buildPosts(posts) {\n const sec = el('div', 'type-section');\n sec.innerHTML = `<div class=\"type-header\">\n <div class=\"type-icon gold\">\ud83d\udcf0<\/div>\n <span class=\"type-title\">Articles<\/span>\n <span class=\"type-count\">${posts.length} article${posts.length>1?'s':''}<\/span>\n <\/div>`;\n\n const groups = {}, order = [];\n posts.forEach(p => {\n const cid = p.categories?.[0] ?? 1;\n if (!groups[cid]) { groups[cid] = []; order.push(cid); }\n groups[cid].push(p);\n });\n order.sort((a,b) => {\n if (catMap[a]==='Non classifi\u00e9') return 1;\n if (catMap[b]==='Non classifi\u00e9') return -1;\n return (catMap[a]||'').localeCompare(catMap[b]||'','fr');\n });\n order.forEach(cid => {\n const name = catMap[cid] || 'Non classifi\u00e9';\n const items = groups[cid];\n const cs = el('div','cat-section');\n cs.innerHTML = `<div class=\"cat-header\">\n <div class=\"cat-strip gold\"><\/div>\n <span class=\"cat-name\">${esc(name)}<\/span>\n <span class=\"cat-badge gold\">${items.length}<\/span>\n <\/div>`;\n const wrap = el('div', view==='grid'?'grid':'list');\n items.forEach(p => wrap.appendChild(makeCard(p,'gold')));\n cs.appendChild(wrap);\n sec.appendChild(cs);\n });\n return sec;\n}\n\n\/* \u2500\u2500 Section Pages \u2500\u2500 *\/\nfunction buildPages(pages) {\n const sec = el('div','type-section');\n sec.innerHTML = `<div class=\"type-header\">\n <div class=\"type-icon blue\">\ud83d\udcc4<\/div>\n <span class=\"type-title\">Pages<\/span>\n <span class=\"type-count\">${pages.length} page${pages.length>1?'s':''}<\/span>\n <\/div>`;\n\n \/* Hi\u00e9rarchie parent \u2192 enfants *\/\n const byParent = {};\n pages.forEach(p => {\n const key = p.parent || 0;\n if (!byParent[key]) byParent[key] = [];\n byParent[key].push(p);\n });\n const roots = byParent[0] || pages;\n const hasChildren = pages.some(p => p.parent && p.parent !== 0);\n\n if (!hasChildren) {\n const cs = el('div','cat-section');\n cs.innerHTML = `<div class=\"cat-header\">\n <div class=\"cat-strip blue\"><\/div>\n <span class=\"cat-name\">Toutes les pages<\/span>\n <span class=\"cat-badge blue\">${pages.length}<\/span>\n <\/div>`;\n const wrap = el('div', view==='grid'?'grid':'list');\n pages.forEach(p => wrap.appendChild(makeCard(p,'blue')));\n cs.appendChild(wrap);\n sec.appendChild(cs);\n } else {\n roots.forEach(root => {\n const children = byParent[root.id] || [];\n const cs = el('div','cat-section');\n cs.innerHTML = `<div class=\"cat-header\">\n <div class=\"cat-strip blue\"><\/div>\n <span class=\"cat-name\">${esc(decodeHtml(root.title.rendered))}<\/span>\n <span class=\"cat-badge blue\">${1 + children.length}<\/span>\n <\/div>`;\n const wrap = el('div', view==='grid'?'grid':'list');\n wrap.appendChild(makeCard(root,'blue'));\n children.forEach(c => wrap.appendChild(makeCard(c,'blue')));\n cs.appendChild(wrap);\n sec.appendChild(cs);\n });\n }\n return sec;\n}\n\n\/* \u2500\u2500 Section Listings manuels \u2500\u2500 *\/\nfunction buildListings(listings) {\n const sec = el('div','manual-section');\n sec.innerHTML = `<div class=\"type-header\">\n <div class=\"type-icon\" style=\"background:#F0FFF4;border:1px solid #68B984;\">\ud83d\udccb<\/div>\n <span class=\"type-title\">Listings<\/span>\n <span class=\"type-count\">${listings.length} listing${listings.length>1?'s':''} \u00b7 gestion manuelle<\/span>\n <\/div>`;\n\n const table = document.createElement('table');\n table.className = 'manual-table';\n table.innerHTML = `<thead><tr>\n <th>Titre \/ Lien<\/th>\n <th>Cat\u00e9gorie<\/th>\n <\/tr><\/thead>`;\n const tbody = document.createElement('tbody');\n listings.forEach(l => {\n const tr = document.createElement('tr');\n tr.innerHTML = `<td><a href=\"${esc(l.url)}\" target=\"_blank\" rel=\"noopener\">${esc(l.titre)}<\/a><\/td>\n <td><span class=\"cat-pill\">${esc(l.categorie)}<\/span><\/td>`;\n tbody.appendChild(tr);\n });\n table.appendChild(tbody);\n sec.appendChild(table);\n return sec;\n}\n\n\/* \u2500\u2500 Carte \/ Ligne \u2500\u2500 *\/\nfunction makeCard(p, color) {\n const title = decodeHtml(p.title.rendered);\n const date = fmtDate(p.date);\n const link = p.link;\n if (view === 'grid') {\n const d = el('div', `card ${color}`);\n d.innerHTML = `<a href=\"${esc(link)}\" target=\"_blank\" rel=\"noopener\">${esc(title)}<\/a>\n <span class=\"card-date\">${esc(date)}<\/span>`;\n return d;\n } else {\n const d = el('div', `row ${color}`);\n d.innerHTML = `<a href=\"${esc(link)}\" target=\"_blank\" rel=\"noopener\">${esc(title)}<\/a>\n <span class=\"row-date\">${esc(date)}<\/span>`;\n return d;\n }\n}\n\nfunction el(tag, cls) { const e = document.createElement(tag); if(cls) e.className = cls; return e; }\n\n\/* \u2500\u2500 Contr\u00f4les \u2500\u2500 *\/\nfunction onSearch(v) { q = v; render(); }\nfunction setTab(t) {\n activeTab = t;\n document.querySelectorAll('.tab').forEach(b => b.classList.toggle('active', b.dataset.t === t));\n render();\n}\nfunction setView(v) {\n view = v;\n document.getElementById('vg').classList.toggle('active', v==='grid');\n document.getElementById('vl').classList.toggle('active', v==='list');\n render();\n}\n\nload();\n<\/script>\n<\/body>\n<\/html>\n","protected":false},"excerpt":{"rendered":"<p>Plan du site \u2014 Anabel anabel.be\/web Plan du site Tous les contenus publi\u00e9s, mis \u00e0 jour automatiquement \u00e0 chaque nouvelle publication. Chargement\u2026 \u2014Articles \u2014Pages \u2014Listings \u2014Total Tout \ud83d\udcf0 Articles \ud83d\udcc4 Pages \ud83d\udccb Listings \u229e \u2261 Chargement depuis WordPress\u2026 Votre publicit\u00e9 sur Anabel.be : Contactez-nous.<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-534","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/pages\/534","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/comments?post=534"}],"version-history":[{"count":13,"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/pages\/534\/revisions"}],"predecessor-version":[{"id":640,"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/pages\/534\/revisions\/640"}],"wp:attachment":[{"href":"https:\/\/www.anabel.be\/web\/wp-json\/wp\/v2\/media?parent=534"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}