{"id":2605,"date":"2026-06-14T06:31:30","date_gmt":"2026-06-14T06:31:30","guid":{"rendered":"https:\/\/sistemintegrasolusindo.com\/news-article\/"},"modified":"2026-06-21T09:48:38","modified_gmt":"2026-06-21T09:48:38","slug":"berita-artikel","status":"publish","type":"page","link":"https:\/\/sistemintegrasolusindo.com\/id\/berita-artikel\/","title":{"rendered":"Berita &amp; Artikel"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"2605\" class=\"elementor elementor-2605 elementor-2445\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4e156f0 e-flex e-con-boxed e-con e-parent\" data-id=\"4e156f0\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-2092aa2 elementor-widget elementor-widget-heading\" data-id=\"2092aa2\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Berita &amp; Artikel<\/h1>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2f05e44 e-flex e-con-boxed e-con e-parent\" data-id=\"2f05e44\" data-element_type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-e60eacb e-con-full e-flex e-con e-child\" data-id=\"e60eacb\" data-element_type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-45bc18e e-con-full e-flex e-con e-child\" data-id=\"45bc18e\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a728a67 elementor-widget elementor-widget-heading\" data-id=\"a728a67\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Insight Seputar Otomasi Industri dan Arsitektur Sistem<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-a888f67 e-con-full e-flex e-con e-child\" data-id=\"a888f67\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3690cc5 elementor-widget elementor-widget-text-editor\" data-id=\"3690cc5\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Jelajahi artikel, insight operasional, perkembangan teknologi, serta berbagai pengetahuan industri dari PT Sistem Integra Solusindo.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cd603e8 e-con-full blog_wrapper e-flex e-con e-child\" data-id=\"cd603e8\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-cc50670 elementor-widget elementor-widget-html\" data-id=\"cc50670\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div id=\"sis-activities-app\">\r\n    <div id=\"sis-tabs\"><\/div>\r\n    <div id=\"sis-posts-grid\"><\/div>\r\n    <div id=\"sis-pagination\"><\/div>\r\n<\/div>\r\n\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function(){\r\n\r\n    const PARENT_CATEGORY_ID = 49;\r\n\r\n    const POSTS_PER_PAGE =\r\n        window.matchMedia('(max-width: 767px)').matches\r\n            ? 8\r\n            : 12;\r\n\r\n    const apiBase =\r\n        location.pathname.startsWith('\/id\/')\r\n            ? '\/id\/wp-json\/wp\/v2'\r\n            : '\/wp-json\/wp\/v2';\r\n\r\n    let currentCategory = PARENT_CATEGORY_ID;\r\n    let currentPage = 1;\r\n\r\n    loadTabs();\r\n    loadPosts();\r\n\r\n    function formatDate(dateString){\r\n\r\n        const months = [\r\n            'JAN','FEB','MAR','APR','MAY','JUN',\r\n            'JUL','AUG','SEP','OCT','NOV','DEC'\r\n        ];\r\n\r\n        const date = new Date(dateString);\r\n\r\n        return `${date.getDate()} ${months[date.getMonth()]} ${date.getFullYear()}`;\r\n\r\n    }\r\n\r\n    async function loadTabs(){\r\n\r\n        try{\r\n\r\n            const res = await fetch(\r\n                `${apiBase}\/categories?per_page=100`\r\n            );\r\n\r\n            const categories = await res.json();\r\n\r\n            const parent = categories.find(\r\n                c => Number(c.id) === Number(PARENT_CATEGORY_ID)\r\n            );\r\n\r\n            if(!parent){\r\n\r\n                console.error(\r\n                    'Parent category not found:',\r\n                    PARENT_CATEGORY_ID,\r\n                    categories\r\n                );\r\n\r\n                return;\r\n\r\n            }\r\n\r\n            const children = categories.filter(\r\n                c => Number(c.parent) === Number(PARENT_CATEGORY_ID)\r\n            );\r\n\r\n            let html = `\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"sis-tab active\"\r\n                    data-id=\"${parent.id}\">\r\n                    ${parent.name}\r\n                <\/button>\r\n            `;\r\n\r\n            children.forEach(cat => {\r\n\r\n                html += `\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"sis-tab\"\r\n                        data-id=\"${cat.id}\">\r\n                        ${cat.name}\r\n                    <\/button>\r\n                `;\r\n\r\n            });\r\n\r\n            document.getElementById('sis-tabs').innerHTML = html;\r\n\r\n            document.querySelectorAll('.sis-tab').forEach(tab => {\r\n\r\n                tab.addEventListener('click', function(e){\r\n\r\n                    e.preventDefault();\r\n\r\n                    document\r\n                        .querySelectorAll('.sis-tab')\r\n                        .forEach(t => t.classList.remove('active'));\r\n\r\n                    this.classList.add('active');\r\n\r\n                    currentCategory = parseInt(\r\n                        this.dataset.id\r\n                    );\r\n\r\n                    currentPage = 1;\r\n\r\n                    loadPosts();\r\n\r\n                });\r\n\r\n            });\r\n\r\n        }catch(error){\r\n\r\n            console.error(error);\r\n\r\n        }\r\n\r\n    }\r\n\r\n    async function loadPosts(){\r\n\r\n        document.getElementById('sis-posts-grid').innerHTML =\r\n            '<div class=\"sis-loading\">Loading...<\/div>';\r\n\r\n        try{\r\n\r\n            const response = await fetch(\r\n                `${apiBase}\/posts?categories=${currentCategory}&per_page=${POSTS_PER_PAGE}&page=${currentPage}`\r\n            );\r\n\r\n            const totalPages =\r\n                parseInt(\r\n                    response.headers.get('X-WP-TotalPages')\r\n                ) || 1;\r\n\r\n            const posts = await response.json();\r\n\r\n            let html = '';\r\n\r\n            for(const post of posts){\r\n\r\n                let tagHtml = '';\r\n\r\n                if(post.tags && post.tags.length){\r\n\r\n                    try{\r\n\r\n                        const tagRes = await fetch(\r\n                            `${apiBase}\/tags\/${post.tags[0]}`\r\n                        );\r\n\r\n                        const tag = await tagRes.json();\r\n\r\n                        tagHtml = `\r\n                            <div class=\"sis-tags\">\r\n                                <div class=\"sis-tag\">\r\n                                    ${tag.name}\r\n                                <\/div>\r\n                            <\/div>\r\n                        `;\r\n\r\n                    }catch(e){}\r\n\r\n                }\r\n\r\n                const imageUrl =\r\n                    post.featured_image_url || '';\r\n\r\n                html += `\r\n                    <div class=\"sis-card\">\r\n\r\n                        <a href=\"${post.link}\" class=\"sis-thumb\">\r\n                            <img decoding=\"async\"\r\n                                src=\"${imageUrl}\"\r\n                                alt=\"${post.title.rendered}\">\r\n                        <\/a>\r\n\r\n                        <div class=\"sis-body\">\r\n\r\n                            ${tagHtml}\r\n\r\n                            <div class=\"sis-title\">\r\n                                <a href=\"${post.link}\">\r\n                                    ${post.title.rendered}\r\n                                <\/a>\r\n                            <\/div>\r\n\r\n                            <div class=\"sis-intro\">\r\n                                ${post.acf?.intro_text || ''}\r\n                            <\/div>\r\n\r\n                            <div class=\"sis-meta\">\r\n\r\n                                <div class=\"sis-date\">\r\n                                    ${formatDate(post.date)}\r\n                                <\/div>\r\n\r\n                                <a\r\n                                    href=\"${post.link}\"\r\n                                    class=\"sis-arrow\">\r\n\r\n                                    <img decoding=\"async\"\r\n                                        src=\"\/wp-content\/uploads\/2026\/06\/blue-arrow.png\"\r\n                                        alt=\"Read More\">\r\n\r\n                                <\/a>\r\n\r\n                            <\/div>\r\n\r\n                        <\/div>\r\n\r\n                    <\/div>\r\n                `;\r\n\r\n            }\r\n\r\n            document.getElementById(\r\n                'sis-posts-grid'\r\n            ).innerHTML = html;\r\n\r\n            renderPagination(totalPages);\r\n\r\n        }catch(error){\r\n\r\n            console.error(error);\r\n\r\n        }\r\n\r\n    }\r\n\r\n    function renderPagination(totalPages){\r\n\r\n        let html = '';\r\n\r\n        if(currentPage > 1){\r\n\r\n            html += `\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"sis-page sis-page-prev\"\r\n                    data-page=\"${currentPage - 1}\">\r\n                    \u2190\r\n                <\/button>\r\n            `;\r\n\r\n        }\r\n\r\n        for(let i = 1; i <= totalPages; i++){\r\n\r\n            html += `\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"sis-page sis-page-number ${i === currentPage ? 'active' : ''}\"\r\n                    data-page=\"${i}\">\r\n                    ${i}\r\n                <\/button>\r\n            `;\r\n\r\n        }\r\n\r\n        if(currentPage < totalPages){\r\n\r\n            html += `\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"sis-page sis-page-next\"\r\n                    data-page=\"${currentPage + 1}\">\r\n                    \u2192\r\n                <\/button>\r\n            `;\r\n\r\n        }\r\n\r\n        document.getElementById(\r\n            'sis-pagination'\r\n        ).innerHTML = html;\r\n\r\n        document.querySelectorAll('.sis-page').forEach(btn => {\r\n\r\n            btn.addEventListener('click', function(e){\r\n\r\n                e.preventDefault();\r\n\r\n                currentPage = parseInt(\r\n                    this.dataset.page\r\n                );\r\n\r\n                loadPosts();\r\n\r\n            });\r\n\r\n        });\r\n\r\n    }\r\n\r\n});\r\n<\/script>\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>Berita &amp; Artikel Insight Seputar Otomasi Industri dan Arsitektur Sistem Jelajahi artikel, insight operasional, perkembangan teknologi, serta berbagai pengetahuan industri [&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,"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-2605","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/sistemintegrasolusindo.com\/id\/wp-json\/wp\/v2\/pages\/2605","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sistemintegrasolusindo.com\/id\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sistemintegrasolusindo.com\/id\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sistemintegrasolusindo.com\/id\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sistemintegrasolusindo.com\/id\/wp-json\/wp\/v2\/comments?post=2605"}],"version-history":[{"count":5,"href":"https:\/\/sistemintegrasolusindo.com\/id\/wp-json\/wp\/v2\/pages\/2605\/revisions"}],"predecessor-version":[{"id":2667,"href":"https:\/\/sistemintegrasolusindo.com\/id\/wp-json\/wp\/v2\/pages\/2605\/revisions\/2667"}],"wp:attachment":[{"href":"https:\/\/sistemintegrasolusindo.com\/id\/wp-json\/wp\/v2\/media?parent=2605"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}