{"id":12854,"date":"2026-02-13T09:16:33","date_gmt":"2026-02-13T02:16:33","guid":{"rendered":"https:\/\/www.doa.go.th\/rubberfund\/?page_id=12854"},"modified":"2026-02-13T10:44:22","modified_gmt":"2026-02-13T03:44:22","slug":"news","status":"publish","type":"page","link":"https:\/\/www.doa.go.th\/rubberfund\/news\/","title":{"rendered":"News"},"content":{"rendered":"<div class=\"gb-container gb-container-3d1131f6 alignfull\">\n\n<!-- \n  [\u0e27\u0e34\u0e18\u0e35\u0e15\u0e34\u0e14\u0e15\u0e31\u0e49\u0e07\u0e43\u0e19 WordPress]\n  1. \u0e44\u0e1b\u0e17\u0e35\u0e48\u0e2b\u0e19\u0e49\u0e32\u0e41\u0e01\u0e49\u0e44\u0e02 Page -> \u0e40\u0e1e\u0e34\u0e48\u0e21\u0e1a\u0e25\u0e47\u0e2d\u0e01 \"Custom HTML\" (HTML \u0e17\u0e35\u0e48\u0e01\u0e33\u0e2b\u0e19\u0e14\u0e40\u0e2d\u0e07)\n  2. \u0e27\u0e32\u0e07\u0e42\u0e04\u0e49\u0e14\u0e14\u0e49\u0e32\u0e19\u0e25\u0e48\u0e32\u0e07\u0e19\u0e35\u0e49\u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14\n-->\n\n<div id=\"rf-news-portal\" class=\"rf-portal-scope\">\n    <link href=\"https:\/\/fonts.googleapis.com\/css2?family=Sarabun:wght@300;400;600;700;800&#038;display=swap\" rel=\"stylesheet\">\n    <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n\n    <style>\n        .rf-portal-scope {\n            font-family: 'Sarabun', sans-serif !important;\n            --primary-green: #15803d;\n            position: relative; \n            background: #ffffff;\n            min-height: 800px;\n            border-radius: 24px;\n            overflow: hidden;\n            margin: 1.5rem 0;\n            box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);\n            color: #0f172a;\n        }\n\n        .rf-portal-scope.dark-mode {\n            background: #0f172a;\n            color: #f1f5f9;\n        }\n\n        .rf-theme-overlay {\n            position: sticky;\n            top: 20px;\n            float: right;\n            margin-right: 20px;\n            margin-top: 20px;\n            z-index: 950;\n            pointer-events: none;\n        }\n\n        .rf-theme-overlay button {\n            pointer-events: auto;\n        }\n\n        .rf-sticky-nav {\n            position: sticky;\n            top: 0;\n            z-index: 800;\n            background: rgba(255, 255, 255, 0.98);\n            backdrop-blur: 12px;\n            border-bottom: 2px solid #e2e8f0;\n            transition: background 0.3s;\n        }\n\n        .dark-mode .rf-sticky-nav {\n            background: rgba(15, 23, 42, 0.95);\n            border-bottom: 2px solid #1e293b;\n        }\n\n        .rf-active-tab {\n            border-bottom: 4px solid var(--primary-green) !important;\n            color: var(--primary-green) !important;\n            font-weight: 800 !important;\n        }\n\n        .rf-skeleton {\n            background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);\n            background-size: 200% 100%;\n            animation: rf-loading 1.5s infinite linear;\n        }\n\n        @keyframes rf-loading {\n            0% { background-position: 200% 0; }\n            100% { background-position: -200% 0; }\n        }\n\n        .rf-spinner-icon {\n            border: 4px solid rgba(0,0,0,0.1);\n            border-top: 4px solid var(--primary-green);\n            border-radius: 50%;\n            width: 35px;\n            height: 35px;\n            animation: rf-spin 0.8s linear infinite;\n        }\n\n        @keyframes rf-spin {\n            0% { transform: rotate(0deg); }\n            100% { transform: rotate(360deg); }\n        }\n\n        #rf-preloader-ui {\n            position: absolute;\n            inset: 0;\n            background: white;\n            z-index: 1000;\n            display: flex;\n            flex-direction: column;\n            justify-content: center;\n            align-items: center;\n            transition: opacity 0.4s ease;\n        }\n\n        .dark-mode #rf-preloader-ui { background: #0f172a; }\n        \n        .no-scrollbar::-webkit-scrollbar { display: none; }\n        .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }\n    <\/style>\n\n    <!-- Preloader -->\n    <div id=\"rf-preloader-ui\">\n        <!-- \u0e40\u0e1b\u0e25\u0e35\u0e48\u0e22\u0e19\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e40\u0e1b\u0e47\u0e19 \"\u0e01\u0e33\u0e25\u0e31\u0e07\u0e42\u0e2b\u0e25\u0e14...\" -->\n        <div class=\"text-3xl font-black text-green-800 dark:text-white mb-4 tracking-tighter text-center px-6\">\n            \u0e01\u0e33\u0e25\u0e31\u0e07\u0e42\u0e2b\u0e25\u0e14&#8230;\n        <\/div>\n        <div class=\"rf-spinner-icon\"><\/div>\n    <\/div>\n\n    <!-- Theme Toggle Overlay Button -->\n    <div class=\"rf-theme-overlay\">\n        <button onclick=\"toggleRfTheme()\" class=\"bg-slate-900 dark:bg-slate-800 p-3.5 rounded-2xl shadow-xl hover:scale-110 active:scale-95 transition-all text-yellow-400\">\n            <svg id=\"rf-sun-icon\" class=\"w-5 h-5 hidden dark:block\" fill=\"currentColor\" viewBox=\"0 0 20 20\"><path d=\"M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z\"><\/path><\/svg>\n            <svg id=\"rf-moon-icon\" class=\"w-5 h-5 block dark:hidden\" fill=\"currentColor\" viewBox=\"0 0 20 20\"><path d=\"M17.293 13.293A8 8 0 016.707 2.707a8.001 8.001 0 1010.586 10.586z\"><\/path><\/svg>\n        <\/button>\n    <\/div>\n\n    <div class=\"transition-colors duration-500\">\n        <!-- Header Section -->\n        <header id=\"rf-top-anchor\" class=\"text-center pt-10 pb-8 px-4 bg-slate-50 dark:bg-slate-900\/50\">\n            <h1 class=\"text-4xl md:text-5xl font-extrabold text-green-900 dark:text-green-400 mb-3 tracking-tight\">\n                \u0e02\u0e48\u0e32\u0e27\u0e1b\u0e23\u0e30\u0e0a\u0e32\u0e2a\u0e31\u0e21\u0e1e\u0e31\u0e19\u0e18\u0e4c\n            <\/h1>\n            <div class=\"h-1.5 w-24 bg-green-600 mx-auto rounded-full mb-4\"><\/div>\n            <p class=\"text-slate-800 dark:text-slate-300 text-lg font-semibold\">\n                \u0e40\u0e07\u0e34\u0e19\u0e17\u0e38\u0e19\u0e2b\u0e21\u0e38\u0e19\u0e40\u0e27\u0e35\u0e22\u0e19\u0e22\u0e32\u0e07\u0e1e\u0e32\u0e23\u0e32 \u0e01\u0e23\u0e21\u0e27\u0e34\u0e0a\u0e32\u0e01\u0e32\u0e23\u0e40\u0e01\u0e29\u0e15\u0e23\n            <\/p>\n        <\/header>\n\n        <!-- Sticky Navigation -->\n        <div class=\"rf-sticky-nav px-4 md:px-10 py-5\">\n            <div class=\"max-w-4xl mx-auto flex flex-col gap-5\">\n                <!-- Search Box -->\n                <div class=\"relative w-full\">\n                    <input type=\"text\" id=\"rf-search\" placeholder=\"\u0e1e\u0e34\u0e21\u0e1e\u0e4c\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e04\u0e49\u0e19\u0e2b\u0e32\u0e02\u0e48\u0e32\u0e27\u0e2a\u0e32\u0e23...\" \n                        class=\"w-full pl-5 pr-12 py-3.5 rounded-2xl bg-white dark:bg-slate-800 border-2 border-slate-200 dark:border-slate-700 focus:outline-none focus:border-green-600 shadow-sm text-slate-900 dark:text-white font-medium transition-all placeholder:text-slate-400\">\n                    <div class=\"absolute right-4 top-4 text-slate-500\">\n                        <svg class=\"w-5 h-5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" d=\"M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z\"><\/path><\/svg>\n                    <\/div>\n                <\/div>\n\n                <!-- Tabs -->\n                <div class=\"flex justify-center gap-3 overflow-x-auto pb-1 no-scrollbar\">\n                    <button onclick=\"changeTab('news')\" id=\"tab-news\" class=\"whitespace-nowrap px-6 py-3 text-base font-bold transition-all rf-active-tab\">\u0e02\u0e48\u0e32\u0e27\u0e2a\u0e32\u0e23\u0e41\u0e25\u0e30\u0e01\u0e34\u0e08\u0e01\u0e23\u0e23\u0e21<\/button>\n                    <button onclick=\"changeTab('meeting')\" id=\"tab-meeting\" class=\"whitespace-nowrap px-6 py-3 text-base font-bold text-slate-700 dark:text-slate-400 hover:text-green-700\">\u0e1b\u0e23\u0e30\u0e0a\u0e38\u0e21\u0e04\u0e13\u0e30\u0e01\u0e23\u0e23\u0e21\u0e01\u0e32\u0e23<\/button>\n                    <button onclick=\"changeTab('jobs')\" id=\"tab-jobs\" class=\"whitespace-nowrap px-6 py-3 text-base font-bold text-slate-700 dark:text-slate-400 hover:text-green-700\">\u0e23\u0e31\u0e1a\u0e2a\u0e21\u0e31\u0e04\u0e23\u0e07\u0e32\u0e19<\/button>\n                <\/div>\n            <\/div>\n        <\/div>\n\n        <!-- Content Grid -->\n        <div class=\"p-6 md:p-10\">\n            <div id=\"rf-grid\" class=\"grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8\">\n                <!-- Data injected here -->\n            <\/div>\n\n            <!-- Footer Status -->\n            <div id=\"rf-footer\" class=\"w-full flex flex-col items-center py-20\">\n                <div id=\"rf-bottom-loader\" class=\"rf-spinner-icon hidden mb-4\"><\/div>\n                <p id=\"rf-status\" class=\"text-slate-800 dark:text-slate-500 font-bold uppercase tracking-widest text-xs\">\u0e40\u0e25\u0e37\u0e48\u0e2d\u0e19\u0e25\u0e07\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e02\u0e48\u0e32\u0e27\u0e2a\u0e32\u0e23\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21<\/p>\n            <\/div>\n        <\/div>\n    <\/div>\n\n    <!-- Scroll To Top Button -->\n    <button id=\"rf-scroll-top\" onclick=\"scrollToTop()\" class=\"fixed bottom-6 right-6 bg-green-700 text-white p-4 rounded-full shadow-2xl hover:bg-green-800 opacity-0 invisible translate-y-5 transition-all z-[999]\">\n        <svg class=\"w-6 h-6\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"3\" d=\"M5 10l7-7m0 0l7 7m-7-7v18\"><\/path>\n        <\/svg>\n    <\/button>\n\n    <script>\n        (function() {\n            const API_PATH = \"https:\/\/www.doa.go.th\/rubberfund\/wp-json\/wp\/v2\/posts\";\n            const CATS = { news: 4, meeting: 2, jobs: 3 };\n            \n            let currentTab = 'news';\n            let page = 1;\n            let loading = false;\n            let more = true;\n            let search = \"\";\n            let timer;\n\n            const grid = document.getElementById('rf-grid');\n            const status = document.getElementById('rf-status');\n            const bLoader = document.getElementById('rf-bottom-loader');\n            const preloader = document.getElementById('rf-preloader-ui');\n            const portal = document.getElementById('rf-news-portal');\n            const scrollTopBtn = document.getElementById('rf-scroll-top');\n\n            function showPreloader() {\n                preloader.style.display = 'flex';\n                preloader.style.opacity = '1';\n            }\n\n            function hidePreloader() {\n                preloader.style.opacity = '0';\n                setTimeout(() => {\n                    preloader.style.display = 'none';\n                }, 400);\n            }\n\n            window.addEventListener('pageshow', function(event) {\n                if (event.persisted) {\n                    showPreloader();\n                    loadNews(true);\n                }\n            });\n\n            window.addEventListener('scroll', () => {\n                if (window.pageYOffset > 400) {\n                    scrollTopBtn.classList.remove('invisible', 'opacity-0', 'translate-y-5');\n                } else {\n                    scrollTopBtn.classList.add('invisible', 'opacity-0', 'translate-y-5');\n                }\n            });\n\n            window.scrollToTop = () => { window.scrollTo({ top: 0, behavior: 'smooth' }); };\n\n            window.toggleRfTheme = () => {\n                const isDark = portal.classList.toggle('dark-mode');\n                localStorage.setItem('rf-dark', isDark ? 'y' : 'n');\n            };\n            if(localStorage.getItem('rf-dark') === 'y') portal.classList.add('dark-mode');\n\n            function skeleton() {\n                grid.innerHTML = Array(6).fill(0).map(() => `\n                    <div class=\"bg-white dark:bg-slate-800 rounded-3xl p-5 border-2 border-slate-100 dark:border-slate-800\">\n                        <div class=\"h-44 rf-skeleton rounded-2xl mb-4\"><\/div>\n                        <div class=\"h-6 rf-skeleton rounded w-3\/4 mb-3\"><\/div>\n                        <div class=\"h-4 rf-skeleton rounded w-full\"><\/div>\n                    <\/div>\n                `).join('');\n            }\n\n            async function loadNews(isNew = false) {\n                if (loading) return;\n                if (isNew) { page = 1; more = true; skeleton(); }\n                loading = true;\n                bLoader.classList.remove('hidden');\n\n                try {\n                    let queryParams = `?_embed&per_page=6&page=${page}&t=${Date.now()}`;\n                    if (search) queryParams += `&search=${encodeURIComponent(search)}`;\n                    else queryParams += `&categories=${CATS[currentTab]}`;\n\n                    const response = await fetch(API_PATH + queryParams);\n                    if (!response.ok) throw new Error();\n                    let posts = await response.json();\n\n                    if (isNew) grid.innerHTML = '';\n\n                    if (posts && posts.length > 0) {\n                        posts.forEach(post => {\n                            const media = post._embedded?.['wp:featuredmedia']?.[0];\n                            const img = media?.source_url || \"https:\/\/www.doa.go.th\/rubberfund\/wp-content\/uploads\/2021\/03\/cropped-logo-doa.png\";\n                            const date = new Date(post.date).toLocaleDateString('th-TH', { year: 'numeric', month: 'short', day: 'numeric' });\n                            \n                            const card = document.createElement('article');\n                            card.className = \"bg-white dark:bg-slate-800 rounded-[2rem] shadow-lg border-2 border-slate-100 dark:border-slate-700\/50 overflow-hidden flex flex-col group transition-all hover:border-green-600\";\n                            card.innerHTML = `\n                                <div class=\"h-52 overflow-hidden relative bg-slate-100\">\n                                    <img decoding=\"async\" src=\"${img}\" class=\"w-full h-full object-cover group-hover:scale-105 duration-500\" loading=\"lazy\">\n                                <\/div>\n                                <div class=\"p-7 flex flex-col flex-grow\">\n                                    <div class=\"flex items-center text-xs font-bold text-green-700 dark:text-green-400 mb-3 uppercase tracking-wider\">\n                                        <svg class=\"w-4 h-4 mr-1.5\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\"><path d=\"M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7H5a2 2 0 00-2 2v12a2 2 0 002 2z\"><\/path><\/svg>\n                                        ${date}\n                                    <\/div>\n                                    <h3 class=\"text-lg font-bold text-slate-900 dark:text-white mb-4 line-clamp-2 leading-snug h-14\">${post.title.rendered}<\/h3>\n                                    <p class=\"text-slate-800 dark:text-slate-400 text-sm line-clamp-2 mb-6 leading-relaxed\">${post.excerpt.rendered.replace(\/<[^>]*>?\/gm, '')}<\/p>\n                                    <a href=\"${post.link}\" target=\"_parent\" class=\"mt-auto block text-center py-3.5 bg-green-700 hover:bg-green-800 text-white font-bold rounded-2xl transition-all shadow-md\">\u0e2d\u0e48\u0e32\u0e19\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21<\/a>\n                                <\/div>\n                            `;\n                            grid.appendChild(card);\n                        });\n                        page++;\n                        if (posts.length < 6) more = false;\n                    } else {\n                        more = false;\n                        if (page === 1) grid.innerHTML = '<div class=\"col-span-full text-center py-20 text-slate-800 font-bold italic text-xl\">\u0e44\u0e21\u0e48\u0e1e\u0e1a\u0e02\u0e49\u0e2d\u0e21\u0e39\u0e25\u0e02\u0e48\u0e32\u0e27\u0e2a\u0e32\u0e23<\/div>';\n                    }\n                } catch (e) {\n                    more = false;\n                } finally {\n                    loading = false;\n                    bLoader.classList.add('hidden');\n                    status.innerText = more ? '\u0e40\u0e25\u0e37\u0e48\u0e2d\u0e19\u0e25\u0e07\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e14\u0e39\u0e02\u0e48\u0e32\u0e27\u0e2a\u0e32\u0e23\u0e40\u0e1e\u0e34\u0e48\u0e21\u0e40\u0e15\u0e34\u0e21' : '\u0e2a\u0e34\u0e49\u0e19\u0e2a\u0e38\u0e14\u0e23\u0e32\u0e22\u0e01\u0e32\u0e23\u0e02\u0e48\u0e32\u0e27\u0e2a\u0e32\u0e23';\n                    hidePreloader();\n                }\n            }\n\n            window.changeTab = (tab) => {\n                if (currentTab === tab) return;\n                currentTab = tab;\n                ['news', 'meeting', 'jobs'].forEach(t => {\n                    document.getElementById(`tab-${t}`).className = (t === tab) ? \"whitespace-nowrap px-6 py-3 text-base font-bold transition-all rf-active-tab\" : \"whitespace-nowrap px-6 py-3 text-base font-bold text-slate-700 dark:text-slate-400 hover:text-green-700\";\n                });\n                loadNews(true);\n            };\n\n            document.getElementById('rf-search').addEventListener('keyup', (e) => {\n                clearTimeout(timer);\n                timer = setTimeout(() => {\n                    search = e.target.value.trim();\n                    loadNews(true);\n                }, 700);\n            });\n\n            const observer = new IntersectionObserver(entries => {\n                if (entries[0].isIntersecting && !loading && more) loadNews();\n            }, { threshold: 0.1 });\n            observer.observe(document.getElementById('rf-footer'));\n\n            loadNews(true);\n        })();\n    <\/script>\n<\/div>\n\n<\/div>","protected":false},"excerpt":{"rendered":"<p>\u0e01\u0e33\u0e25\u0e31\u0e07\u0e42\u0e2b\u0e25\u0e14&#8230; \u0e02\u0e48\u0e32\u0e27\u0e1b\u0e23\u0e30\u0e0a\u0e32\u0e2a\u0e31\u0e21\u0e1e\u0e31\u0e19\u0e18\u0e4c \u0e40\u0e07\u0e34\u0e19\u0e17\u0e38\u0e19\u0e2b\u0e21\u0e38\u0e19\u0e40\u0e27\u0e35\u0e22\u0e19\u0e22\u0e32\u0e07\u0e1e [&hellip;]<\/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,"_eb_attr":"","footnotes":""},"class_list":["post-12854","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/www.doa.go.th\/rubberfund\/wp-json\/wp\/v2\/pages\/12854","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.doa.go.th\/rubberfund\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.doa.go.th\/rubberfund\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.doa.go.th\/rubberfund\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.doa.go.th\/rubberfund\/wp-json\/wp\/v2\/comments?post=12854"}],"version-history":[{"count":14,"href":"https:\/\/www.doa.go.th\/rubberfund\/wp-json\/wp\/v2\/pages\/12854\/revisions"}],"predecessor-version":[{"id":12872,"href":"https:\/\/www.doa.go.th\/rubberfund\/wp-json\/wp\/v2\/pages\/12854\/revisions\/12872"}],"wp:attachment":[{"href":"https:\/\/www.doa.go.th\/rubberfund\/wp-json\/wp\/v2\/media?parent=12854"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}