{"id":15,"date":"2025-07-25T14:29:28","date_gmt":"2025-07-25T14:29:28","guid":{"rendered":"https:\/\/staging.ploko.nl\/?page_id=15"},"modified":"2026-01-29T09:36:14","modified_gmt":"2026-01-29T09:36:14","slug":"blog","status":"publish","type":"page","link":"https:\/\/staging.ploko.nl\/en\/blog\/","title":{"rendered":"Blog"},"content":{"rendered":"\t\t
\n\t\t\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 Blog | Ploko.nl \u2013 Tips, AI & marketing<\/title>\r\n <meta name=\"description\" content=\"Blog van Ploko: tips over Google Ads, AI-marketing, webdesign en groei. Updates en inzichten voor ondernemers.\">\r\n \r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\r\n <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Outfit:wght@300;400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n \r\n <style>\r\n \/* ============================================\r\n PLOKO BLOG OVERZICHT \u2013 zelfde design als single-post.php + home.html\r\n ============================================ *\/\r\n .ploko-blog {\r\n --ploko-primary: #290B50;\r\n --ploko-primary-dark: #1A0734;\r\n --ploko-secondary: #9C275F;\r\n --ploko-accent: #B23EFF;\r\n --ploko-white: #FFFFFF;\r\n --ploko-off-white: #F8F5FC;\r\n --ploko-lavender: #F1E6FF;\r\n --ploko-text-dark: #1C0E29;\r\n --ploko-text-muted: rgba(28, 14, 41, 0.7);\r\n --ploko-border: rgba(41, 11, 80, 0.08);\r\n \r\n font-family: 'Outfit', -apple-system, BlinkMacSystemFont, sans-serif;\r\n font-size: 18px;\r\n line-height: 1.7;\r\n color: var(--ploko-text-dark);\r\n background: var(--ploko-white);\r\n margin: 0;\r\n padding: 0;\r\n }\r\n .ploko-blog * { box-sizing: border-box; }\r\n .ploko-blog img { max-width: 100%; height: auto; display: block; }\r\n .ploko-blog a { text-decoration: none; color: inherit; transition: all 0.3s ease; }\r\n .ploko-blog h1, .ploko-blog h2, .ploko-blog h3, .ploko-blog h4 {\r\n font-family: 'Space Grotesk', sans-serif;\r\n font-weight: 700;\r\n color: var(--ploko-primary);\r\n line-height: 1.3;\r\n margin: 0 0 16px 0;\r\n }\r\n\r\n \/* Hero \u2013 zoals home.html *\/\r\n .ploko-blog .blog-hero {\r\n min-height: 50vh;\r\n display: flex;\r\n align-items: center;\r\n background: linear-gradient(180deg, var(--ploko-off-white) 0%, var(--ploko-lavender) 50%, var(--ploko-off-white) 100%);\r\n padding: 80px 24px 60px;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n .ploko-blog .blog-hero .floating-shape {\r\n position: absolute;\r\n border-radius: 50%;\r\n opacity: 0.4;\r\n filter: blur(50px);\r\n pointer-events: none;\r\n }\r\n .ploko-blog .blog-hero .floating-shape:nth-child(1) {\r\n width: 280px; height: 280px;\r\n background: var(--ploko-accent);\r\n top: -60px; right: -60px;\r\n }\r\n .ploko-blog .blog-hero .floating-shape:nth-child(2) {\r\n width: 200px; height: 200px;\r\n background: var(--ploko-secondary);\r\n bottom: -40px; left: -40px;\r\n }\r\n @media (max-width: 768px) { .ploko-blog .blog-hero .floating-shape { display: none; } }\r\n .ploko-blog .blog-hero-inner { position: relative; z-index: 1; max-width: 800px; margin: 0 auto; text-align: center; }\r\n .ploko-blog .blog-hero .section-label {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 8px;\r\n padding: 8px 20px;\r\n background: var(--ploko-lavender);\r\n color: var(--ploko-primary);\r\n border-radius: 100px;\r\n font-size: 12px;\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n margin-bottom: 20px;\r\n }\r\n .ploko-blog .blog-hero h1 { font-size: clamp(2.25rem, 4vw, 3.25rem); margin-bottom: 16px; }\r\n .ploko-blog .blog-hero-subtitle {\r\n font-size: 1.15rem;\r\n color: var(--ploko-text-muted);\r\n max-width: 560px;\r\n margin: 0 auto;\r\n line-height: 1.7;\r\n }\r\n\r\n \/* Layout \u2013 container + grid *\/\r\n .ploko-blog .blog-container {\r\n max-width: 1300px;\r\n margin: 0 auto;\r\n padding: 60px 24px 100px;\r\n }\r\n .ploko-blog .blog-layout {\r\n display: grid;\r\n grid-template-columns: 1fr 360px;\r\n gap: 56px;\r\n align-items: start;\r\n }\r\n @media (max-width: 1024px) {\r\n .ploko-blog .blog-layout { grid-template-columns: 1fr; }\r\n .ploko-blog .blog-sidebar { position: static; }\r\n }\r\n\r\n \/* Breadcrumb *\/\r\n .ploko-blog .blog-breadcrumb {\r\n display: flex;\r\n align-items: center;\r\n gap: 8px;\r\n font-size: 14px;\r\n color: var(--ploko-text-muted);\r\n margin-bottom: 32px;\r\n }\r\n .ploko-blog .blog-breadcrumb a:hover { color: var(--ploko-secondary); }\r\n\r\n \/* Post grid \u2013 cards *\/\r\n .ploko-blog .blog-posts { display: flex; flex-direction: column; gap: 40px; min-width: 0; }\r\n .ploko-blog .post-card {\r\n display: grid;\r\n grid-template-columns: 280px 1fr;\r\n gap: 28px;\r\n align-items: start;\r\n padding: 0;\r\n background: var(--ploko-white);\r\n border-radius: 20px;\r\n overflow: hidden;\r\n border: 1px solid var(--ploko-border);\r\n box-shadow: 0 8px 40px rgba(41, 11, 80, 0.06);\r\n transition: all 0.3s ease;\r\n }\r\n .ploko-blog .post-card:hover {\r\n box-shadow: 0 16px 56px rgba(41, 11, 80, 0.12);\r\n border-color: rgba(156, 39, 95, 0.2);\r\n transform: translateY(-2px);\r\n }\r\n @media (max-width: 768px) {\r\n .ploko-blog .post-card { grid-template-columns: 1fr; }\r\n .ploko-blog .post-card-thumb { aspect-ratio: 16\/9; max-height: 220px; }\r\n }\r\n .ploko-blog .post-card-thumb {\r\n aspect-ratio: 1;\r\n overflow: hidden;\r\n background: var(--ploko-lavender);\r\n }\r\n .ploko-blog .post-card-thumb img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n }\r\n .ploko-blog .post-card-body { padding: 28px 28px 28px 0; min-width: 0; }\r\n @media (max-width: 768px) { .ploko-blog .post-card-body { padding: 24px; } }\r\n .ploko-blog .post-card-category {\r\n display: inline-flex;\r\n align-items: center;\r\n padding: 6px 14px;\r\n background: linear-gradient(135deg, var(--ploko-secondary), var(--ploko-accent));\r\n color: var(--ploko-white);\r\n border-radius: 100px;\r\n font-size: 11px;\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n margin-bottom: 12px;\r\n }\r\n .ploko-blog .post-card-title {\r\n font-family: 'Space Grotesk', sans-serif;\r\n font-size: 1.35rem;\r\n font-weight: 700;\r\n color: var(--ploko-primary);\r\n line-height: 1.3;\r\n margin-bottom: 10px;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n }\r\n .ploko-blog .post-card-title:hover { color: var(--ploko-secondary); }\r\n .ploko-blog .post-card-excerpt {\r\n font-size: 0.95rem;\r\n color: var(--ploko-text-muted);\r\n line-height: 1.65;\r\n margin-bottom: 16px;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n }\r\n .ploko-blog .post-card-meta {\r\n display: flex;\r\n align-items: center;\r\n gap: 20px;\r\n font-size: 13px;\r\n color: var(--ploko-text-muted);\r\n }\r\n .ploko-blog .post-card-meta span { display: flex; align-items: center; gap: 6px; }\r\n .ploko-blog .post-card-link {\r\n display: inline-flex;\r\n align-items: center;\r\n gap: 8px;\r\n margin-top: 12px;\r\n font-family: 'Space Grotesk', sans-serif;\r\n font-weight: 600;\r\n font-size: 14px;\r\n color: var(--ploko-secondary);\r\n }\r\n .ploko-blog .post-card-link:hover { color: var(--ploko-accent); }\r\n .ploko-blog .post-card-link .arrow { transition: transform 0.2s ease; }\r\n .ploko-blog .post-card:hover .post-card-link .arrow { transform: translateX(4px); }\r\n\r\n \/* Sidebar \u2013 zoals single-post.php *\/\r\n .ploko-blog .blog-sidebar {\r\n position: sticky;\r\n top: 24px;\r\n display: flex;\r\n flex-direction: column;\r\n gap: 28px;\r\n }\r\n .ploko-blog .sidebar-card {\r\n background: var(--ploko-white);\r\n border-radius: 20px;\r\n padding: 28px;\r\n box-shadow: 0 8px 40px rgba(41, 11, 80, 0.08);\r\n border: 1px solid var(--ploko-border);\r\n transition: all 0.3s ease;\r\n }\r\n .ploko-blog .sidebar-card:hover {\r\n box-shadow: 0 12px 50px rgba(41, 11, 80, 0.12);\r\n border-color: rgba(156, 39, 95, 0.15);\r\n }\r\n .ploko-blog .sidebar-card-title {\r\n font-size: 1rem;\r\n font-family: 'Space Grotesk', sans-serif;\r\n font-weight: 700;\r\n color: var(--ploko-primary);\r\n margin-bottom: 20px;\r\n display: flex;\r\n align-items: center;\r\n gap: 10px;\r\n }\r\n .ploko-blog .sidebar-card-title::before {\r\n content: '';\r\n width: 4px;\r\n height: 20px;\r\n background: linear-gradient(180deg, var(--ploko-secondary), var(--ploko-accent));\r\n border-radius: 2px;\r\n }\r\n .ploko-blog .sidebar-cta {\r\n background: linear-gradient(145deg, var(--ploko-primary) 0%, var(--ploko-primary-dark) 100%);\r\n color: var(--ploko-white);\r\n border: none;\r\n position: relative;\r\n overflow: hidden;\r\n }\r\n .ploko-blog .sidebar-cta::before {\r\n content: '';\r\n position: absolute;\r\n top: -50%;\r\n right: -50%;\r\n width: 200px;\r\n height: 200px;\r\n background: var(--ploko-accent);\r\n border-radius: 50%;\r\n opacity: 0.15;\r\n filter: blur(40px);\r\n }\r\n .ploko-blog .sidebar-cta-content { position: relative; z-index: 1; }\r\n .ploko-blog .sidebar-cta-badge {\r\n display: inline-block;\r\n padding: 4px 12px;\r\n background: rgba(255,255,255,0.15);\r\n border-radius: 100px;\r\n font-size: 11px;\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n margin-bottom: 16px;\r\n }\r\n .ploko-blog .sidebar-cta h3 { color: var(--ploko-white); font-size: 1.25rem; margin-bottom: 12px; }\r\n .ploko-blog .sidebar-cta p {\r\n color: rgba(255,255,255,0.8);\r\n font-size: 0.95rem;\r\n margin-bottom: 20px;\r\n line-height: 1.6;\r\n }\r\n .ploko-blog .sidebar-cta-features { list-style: none; padding: 0; margin: 0 0 24px; }\r\n .ploko-blog .sidebar-cta-features li {\r\n display: flex;\r\n align-items: center;\r\n gap: 10px;\r\n font-size: 14px;\r\n color: rgba(255,255,255,0.9);\r\n margin-bottom: 10px;\r\n }\r\n .ploko-blog .sidebar-cta-features li::before {\r\n content: '\u2713';\r\n width: 20px;\r\n height: 20px;\r\n background: linear-gradient(135deg, var(--ploko-secondary), var(--ploko-accent));\r\n border-radius: 50%;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n font-size: 11px;\r\n flex-shrink: 0;\r\n }\r\n .ploko-blog .btn {\r\n display: inline-flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 8px;\r\n padding: 14px 24px;\r\n background: linear-gradient(135deg, var(--ploko-secondary), var(--ploko-accent));\r\n color: var(--ploko-white);\r\n border: none;\r\n border-radius: 16px 16px 48px 16px;\r\n font-family: 'Space Grotesk', sans-serif;\r\n font-size: 15px;\r\n font-weight: 600;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n text-decoration: none;\r\n width: 100%;\r\n }\r\n .ploko-blog .btn:hover {\r\n transform: translateY(-2px);\r\n box-shadow: 0 8px 25px rgba(156, 39, 95, 0.4);\r\n color: var(--ploko-white);\r\n }\r\n .ploko-blog .sidebar-trust {\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n gap: 20px;\r\n margin-top: 20px;\r\n padding-top: 20px;\r\n border-top: 1px solid rgba(255,255,255,0.1);\r\n }\r\n .ploko-blog .sidebar-trust-item { text-align: center; }\r\n .ploko-blog .sidebar-trust-value {\r\n font-family: 'Space Grotesk', sans-serif;\r\n font-size: 1.25rem;\r\n font-weight: 700;\r\n color: var(--ploko-white);\r\n }\r\n .ploko-blog .sidebar-trust-label {\r\n font-size: 11px;\r\n color: rgba(255,255,255,0.6);\r\n text-transform: uppercase;\r\n letter-spacing: 0.5px;\r\n }\r\n .ploko-blog .sidebar-related-list { display: flex; flex-direction: column; gap: 16px; }\r\n .ploko-blog .sidebar-related-item {\r\n display: flex;\r\n gap: 14px;\r\n padding: 12px;\r\n background: var(--ploko-off-white);\r\n border-radius: 14px;\r\n transition: all 0.3s ease;\r\n }\r\n .ploko-blog .sidebar-related-item:hover {\r\n background: var(--ploko-lavender);\r\n transform: translateX(4px);\r\n }\r\n .ploko-blog .sidebar-related-img {\r\n width: 70px;\r\n height: 70px;\r\n border-radius: 10px;\r\n object-fit: cover;\r\n flex-shrink: 0;\r\n background: var(--ploko-lavender);\r\n }\r\n .ploko-blog .sidebar-related-content { display: flex; flex-direction: column; justify-content: center; min-width: 0; }\r\n .ploko-blog .sidebar-related-title {\r\n font-size: 14px;\r\n font-weight: 600;\r\n color: var(--ploko-primary);\r\n line-height: 1.4;\r\n margin-bottom: 4px;\r\n display: -webkit-box;\r\n -webkit-line-clamp: 2;\r\n -webkit-box-orient: vertical;\r\n overflow: hidden;\r\n }\r\n .ploko-blog .sidebar-related-date { font-size: 12px; color: var(--ploko-text-muted); }\r\n\r\n .ploko-blog .blog-posts-loading,\r\n .ploko-blog .blog-posts-empty {\r\n text-align: center;\r\n padding: 48px 24px;\r\n color: var(--ploko-text-muted);\r\n font-size: 1.05rem;\r\n }\r\n .ploko-blog .blog-posts-empty { display: none; }\r\n .ploko-blog .blog-posts-empty.visible { display: block; }\r\n .ploko-blog .blog-posts-loading .spinner {\r\n width: 40px;\r\n height: 40px;\r\n border: 3px solid var(--ploko-lavender);\r\n border-top-color: var(--ploko-secondary);\r\n border-radius: 50%;\r\n animation: ploko-spin 0.8s linear infinite;\r\n margin: 0 auto 16px;\r\n }\r\n @keyframes ploko-spin { to { transform: rotate(360deg); } }\r\n\r\n @media (max-width: 600px) {\r\n .ploko-blog .blog-container { padding: 40px 16px 80px; }\r\n .ploko-blog .blog-hero { padding: 60px 16px 48px; }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"ploko-blog\">\r\n \r\n <!-- Hero -->\r\n <section class=\"blog-hero\">\r\n <div class=\"floating-shape\"><\/div>\r\n <div class=\"floating-shape\"><\/div>\r\n <div class=\"blog-hero-inner\">\r\n <span class=\"section-label\">Blog<\/span>\r\n <h1>Tips, updates en inzichten<\/h1>\r\n <p class=\"blog-hero-subtitle\">\r\n Over Google Ads, AI-marketing, webdesign en groei. Voor ondernemers die meer willen bereiken online.\r\n <\/p>\r\n <\/div>\r\n <\/section>\r\n\r\n <div class=\"blog-container\">\r\n <nav class=\"blog-breadcrumb\">\r\n <a href=\"https:\/\/staging.ploko.nl\/\">Home<\/a>\r\n <span>\u203a<\/span>\r\n <span>Blog<\/span>\r\n <\/nav>\r\n\r\n <div class=\"blog-layout\">\r\n \r\n <!-- Postlijst \u2013 wordt gevuld via WordPress REST API -->\r\n <main class=\"blog-main\">\r\n <div class=\"blog-posts\" id=\"blogPostsList\">\r\n <div class=\"blog-posts-loading\" id=\"blogPostsLoading\">\r\n <div class=\"spinner\"><\/div>\r\n <p>Berichten laden...<\/p>\r\n <\/div>\r\n <\/div>\r\n <div class=\"blog-posts-empty\" id=\"blogPostsEmpty\">\r\n <p>Er zijn nog geen blogberichten. Binnenkort vind je hier tips en updates.<\/p>\r\n <p><a href=\"https:\/\/staging.ploko.nl\/contact\" style=\"color: var(--ploko-secondary); font-weight: 600;\">Neem contact op<\/a> voor meer informatie.<\/p>\r\n <\/div>\r\n <\/main>\r\n\r\n <!-- Sidebar -->\r\n <aside class=\"blog-sidebar\">\r\n <div class=\"sidebar-card sidebar-cta\">\r\n <div class=\"sidebar-cta-content\">\r\n <span class=\"sidebar-cta-badge\">Gratis advies<\/span>\r\n <h3>Wil je dit ook voor jouw bedrijf?<\/h3>\r\n <p>Ontdek hoe wij jouw marketing kunnen automatiseren met AI.<\/p>\r\n <ul class=\"sidebar-cta-features\">\r\n <li>Persoonlijk adviesgesprek<\/li>\r\n <li>Maatwerk oplossingen<\/li>\r\n <li>Binnen 24 uur reactie<\/li>\r\n <\/ul>\r\n <a href=\"https:\/\/staging.ploko.nl\/contact\" class=\"btn\">Plan een gesprek <span>\u2192<\/span><\/a>\r\n <div class=\"sidebar-trust\">\r\n <div class=\"sidebar-trust-item\">\r\n <div class=\"sidebar-trust-value\">5.0<\/div>\r\n <div class=\"sidebar-trust-label\">Google<\/div>\r\n <\/div>\r\n <div class=\"sidebar-trust-item\">\r\n <div class=\"sidebar-trust-value\">100+<\/div>\r\n <div class=\"sidebar-trust-label\">Klanten<\/div>\r\n <\/div>\r\n <div class=\"sidebar-trust-item\">\r\n <div class=\"sidebar-trust-value\">24\/7<\/div>\r\n <div class=\"sidebar-trust-label\">Support<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"sidebar-card\">\r\n <h4 class=\"sidebar-card-title\">Recente artikelen<\/h4>\r\n <div class=\"sidebar-related-list\" id=\"sidebarRecentList\">\r\n <div class=\"blog-posts-loading\" style=\"padding: 16px 0;\"><p style=\"margin:0; font-size: 14px;\">Laden...<\/p><\/div>\r\n <\/div>\r\n <\/div>\r\n <\/aside>\r\n\r\n <\/div>\r\n <\/div>\r\n\r\n <\/div>\r\n\r\n <script>\r\n (function() {\r\n var API_URL = 'https:\/\/staging.ploko.nl\/wp-json\/wp\/v2\/posts?per_page=12&_embed';\r\n var listEl = document.getElementById('blogPostsList');\r\n var loadingEl = document.getElementById('blogPostsLoading');\r\n var emptyEl = document.getElementById('blogPostsEmpty');\r\n var sidebarEl = document.getElementById('sidebarRecentList');\r\n\r\n function stripHtml(html) {\r\n if (!html) return '';\r\n var div = document.createElement('div');\r\n div.innerHTML = html;\r\n return (div.textContent || div.innerText || '').trim();\r\n }\r\n\r\n function formatDate(dateStr) {\r\n if (!dateStr) return '';\r\n var d = new Date(dateStr);\r\n var months = ['jan', 'feb', 'mrt', 'apr', 'mei', 'jun', 'jul', 'aug', 'sep', 'okt', 'nov', 'dec'];\r\n return d.getDate() + ' ' + months[d.getMonth()] + ' ' + d.getFullYear();\r\n }\r\n\r\n function estimateReadTime(content) {\r\n if (!content) return 3;\r\n var text = stripHtml(content);\r\n var words = text ? text.split(\/\\s+\/).length : 0;\r\n return Math.max(1, Math.ceil(words \/ 200));\r\n }\r\n\r\n function getFeaturedImageUrl(post) {\r\n try {\r\n var emb = post._embedded;\r\n if (emb && emb['wp:featuredmedia'] && emb['wp:featuredmedia'][0]) {\r\n var img = emb['wp:featuredmedia'][0];\r\n return img.source_url || (img.media_details && img.media_details.sizes && img.media_details.sizes.medium && img.media_details.sizes.medium.source_url) || '';\r\n }\r\n } catch (e) {}\r\n return '';\r\n }\r\n\r\n function getCategoryName(post) {\r\n try {\r\n var emb = post._embedded;\r\n if (emb && emb['wp:term']) {\r\n for (var i = 0; i < emb['wp:term'].length; i++) {\r\n if (emb['wp:term'][i].length && emb['wp:term'][i][0].name) {\r\n return emb['wp:term'][i][0].name;\r\n }\r\n }\r\n }\r\n } catch (e) {}\r\n return 'Blog';\r\n }\r\n\r\n function buildPostCard(post) {\r\n var link = post.link || '#';\r\n var title = post.title && post.title.rendered ? post.title.rendered : 'Geen titel';\r\n var excerpt = stripHtml(post.excerpt && post.excerpt.rendered ? post.excerpt.rendered : '');\r\n if (excerpt.length > 140) excerpt = excerpt.substring(0, 137) + '...';\r\n var date = formatDate(post.date);\r\n var readTime = estimateReadTime(post.content && post.content.rendered) + ' min leestijd';\r\n var imgUrl = getFeaturedImageUrl(post) || 'data:image\/svg+xml,%3Csvg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"280\" height=\"280\" viewBox=\"0 0 280 280\"%3E%3Crect fill=\"%23F1E6FF\" width=\"280\" height=\"280\"\/%3E%3Ctext fill=\"%23290B50\" x=\"50%25\" y=\"50%25\" dominant-baseline=\"middle\" text-anchor=\"middle\" font-family=\"sans-serif\" font-size=\"14\"%3EBlog%3C\/text%3E%3C\/svg%3E';\r\n var category = getCategoryName(post);\r\n\r\n return '<article class=\"post-card\">' +\r\n '<a href=\"' + link + '\" class=\"post-card-thumb\">' +\r\n '<img loading=\"lazy\" decoding=\"async\" src=\"' + imgUrl + '\" alt=\"' + title.replace(\/\"\/g, '"') + '\" width=\"280\" height=\"280\" loading=\"lazy\">' +\r\n '<\/a>' +\r\n '<div class=\"post-card-body\">' +\r\n '<span class=\"post-card-category\">' + category + '<\/span>' +\r\n '<h2 class=\"post-card-title\"><a href=\"' + link + '\">' + title + '<\/a><\/h2>' +\r\n (excerpt ? '<p class=\"post-card-excerpt\">' + excerpt + '<\/p>' : '') +\r\n '<div class=\"post-card-meta\">' +\r\n '<span>' + date + '<\/span>' +\r\n '<span>' + readTime + '<\/span>' +\r\n '<\/div>' +\r\n '<a href=\"' + link + '\" class=\"post-card-link\">Lees artikel <span class=\"arrow\">\u2192<\/span><\/a>' +\r\n '<\/div><\/article>';\r\n }\r\n\r\n function buildSidebarItem(post) {\r\n var link = post.link || '#';\r\n var title = post.title && post.title.rendered ? post.title.rendered : 'Geen titel';\r\n var date = formatDate(post.date);\r\n var imgUrl = getFeaturedImageUrl(post) || 'data:image\/svg+xml,%3Csvg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"70\" height=\"70\" viewBox=\"0 0 70 70\"%3E%3Crect fill=\"%23F1E6FF\" width=\"70\" height=\"70\"\/%3E%3C\/svg%3E';\r\n return '<a href=\"' + link + '\" class=\"sidebar-related-item\">' +\r\n '<img loading=\"lazy\" decoding=\"async\" src=\"' + imgUrl + '\" alt=\"\" class=\"sidebar-related-img\" width=\"70\" height=\"70\" loading=\"lazy\">' +\r\n '<div class=\"sidebar-related-content\">' +\r\n '<div class=\"sidebar-related-title\">' + title + '<\/div>' +\r\n '<div class=\"sidebar-related-date\">' + date + '<\/div>' +\r\n '<\/div><\/a>';\r\n }\r\n\r\n fetch(API_URL)\r\n .then(function(r) { return r.json(); })\r\n .then(function(posts) {\r\n loadingEl.style.display = 'none';\r\n if (!posts || !posts.length) {\r\n emptyEl.classList.add('visible');\r\n sidebarEl.innerHTML = '<p style=\"margin:0; font-size: 14px; color: var(--ploko-text-muted);\">Nog geen berichten.<\/p>';\r\n return;\r\n }\r\n var html = '';\r\n for (var i = 0; i < posts.length; i++) {\r\n html += buildPostCard(posts[i]);\r\n }\r\n listEl.innerHTML = html;\r\n\r\n var sidebarHtml = '';\r\n for (var j = 0; j < Math.min(3, posts.length); j++) {\r\n sidebarHtml += buildSidebarItem(posts[j]);\r\n }\r\n sidebarEl.innerHTML = sidebarHtml;\r\n })\r\n .catch(function(err) {\r\n loadingEl.style.display = 'none';\r\n emptyEl.classList.add('visible');\r\n emptyEl.innerHTML = '<p>De blogberichten konden niet worden geladen. Controleer of <a href=\"https:\/\/staging.ploko.nl\" style=\"color: var(--ploko-secondary);\">ploko.nl<\/a> bereikbaar is.<\/p>';\r\n sidebarEl.innerHTML = '<p style=\"margin:0; font-size: 14px; color: var(--ploko-text-muted);\">Niet geladen.<\/p>';\r\n });\r\n })();\r\n <\/script>\r\n<\/body>\r\n<\/html>\r\n\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>Blog | Ploko.nl \u2013 Tips, AI & marketing Blog Tips, updates en inzichten Over Google Ads, AI-marketing, webdesign en groei. Voor ondernemers die meer willen bereiken online. Home \u203a Blog Berichten laden… Er zijn nog geen blogberichten. Binnenkort vind je hier tips en updates. Neem contact op voor meer informatie. Gratis advies Wil je dit […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_wds_title":"Ploko Blog | Tips over Webdesign, SEO, AI & Online Marketing","_wds_metadesc":"Lees de blog van Ploko en ontdek slimme tips over webdesign, SEO, AI-oplossingen en online marketing. Inspiratie en kennis om jouw bedrijf online te laten groeien.","footnotes":""},"class_list":["post-15","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/staging.ploko.nl\/en\/wp-json\/wp\/v2\/pages\/15","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/staging.ploko.nl\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/staging.ploko.nl\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/staging.ploko.nl\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/staging.ploko.nl\/en\/wp-json\/wp\/v2\/comments?post=15"}],"version-history":[{"count":52,"href":"https:\/\/staging.ploko.nl\/en\/wp-json\/wp\/v2\/pages\/15\/revisions"}],"predecessor-version":[{"id":29838,"href":"https:\/\/staging.ploko.nl\/en\/wp-json\/wp\/v2\/pages\/15\/revisions\/29838"}],"wp:attachment":[{"href":"https:\/\/staging.ploko.nl\/en\/wp-json\/wp\/v2\/media?parent=15"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}