{"id":45,"date":"2026-04-26T06:20:43","date_gmt":"2026-04-26T06:20:43","guid":{"rendered":"https:\/\/entohub.synology.me\/index.php\/demo-japan-1\/"},"modified":"2026-04-26T06:20:43","modified_gmt":"2026-04-26T06:20:43","slug":"demo-japan-1","status":"publish","type":"page","link":"https:\/\/entohub.synology.me\/index.php\/demo-japan-1\/","title":{"rendered":"Demo \u2014 Tokyo Travels"},"content":{"rendered":"    <link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/leaflet.css\">\n    <div class=\"dh-demo-page\">\n\n        <header class=\"dh-demo-header\">\n            <div class=\"dh-demo-header-text\">\n                <p class=\"dh-demo-powered\">Powered by EntoHub<\/p>\n                <h2 class=\"dh-demo-title\">Tokyo Travels<\/h2>\n                <p class=\"dh-demo-subtitle\">Here&#039;s a preview of what your visitors could experience<\/p>\n            <\/div>\n            <div class=\"dh-layout-toggle\">\n                <button type=\"button\" class=\"dh-layout-btn active\" data-layout=\"sidebar\" title=\"Sidebar layout\">\n                    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><rect x=\"1\" y=\"1\" width=\"4\" height=\"14\" rx=\"1\" fill=\"currentColor\" opacity=\".5\"\/><rect x=\"7\" y=\"1\" width=\"8\" height=\"14\" rx=\"1\" fill=\"currentColor\"\/><\/svg>\n                <\/button>\n                <button type=\"button\" class=\"dh-layout-btn\" data-layout=\"top\" title=\"Map on top\">\n                    <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><rect x=\"1\" y=\"1\" width=\"14\" height=\"6\" rx=\"1\" fill=\"currentColor\"\/><rect x=\"1\" y=\"9\" width=\"14\" height=\"6\" rx=\"1\" fill=\"currentColor\" opacity=\".5\"\/><\/svg>\n                <\/button>\n            <\/div>\n        <\/header>\n\n        <div class=\"dh-layout-wrap layout-sidebar\">\n            <div class=\"dh-layout-sidebar\">\n                <div class=\"dh-demo-season-filters\">\n                    <button type=\"button\" class=\"dh-demo-season-btn active\" data-season=\"\">\n                        All                    <\/button>\n                                        <button type=\"button\" class=\"dh-demo-season-btn\" data-season=\"spring\">\n                        Spring                    <\/button>\n                                        <button type=\"button\" class=\"dh-demo-season-btn\" data-season=\"summer\">\n                        Summer                    <\/button>\n                                        <button type=\"button\" class=\"dh-demo-season-btn\" data-season=\"autumn\">\n                        Autumn                    <\/button>\n                                        <button type=\"button\" class=\"dh-demo-season-btn\" data-season=\"winter\">\n                        Winter                    <\/button>\n                                    <\/div>\n            <\/div>\n            <div class=\"dh-layout-main\">\n                <div id=\"dh-demo-map\" class=\"dh-demo-map-container\"><\/div>\n            <\/div>\n        <\/div>\n\n        <div class=\"dh-demo-grid\" id=\"dh-demo-cards\">\n                        <div class=\"dh-demo-card\" data-seasons=\"spring,summer\">\n                <div class=\"dh-demo-card-image\" style=\"background-image:url(https:\/\/images.unsplash.com\/photo-1549693578-d683be217e58?q=80&amp;w=1477&amp;auto=format&amp;fit=crop&amp;ixlib=rb-4.1.0&amp;ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)\"><\/div>\n                <div class=\"dh-demo-card-body\">\n                                            <span class=\"dh-demo-card-region\">Tokyo<\/span>\n                                        <strong class=\"dh-demo-card-title\">Tokyo<\/strong>\n                                            <span class=\"dh-demo-card-description\">Capital City<\/span>\n                                                            <div class=\"dh-demo-card-badges\">\n                                                <span class=\"dh-demo-card-tag\">\n                            Spring                        <\/span>\n                                                <span class=\"dh-demo-card-tag\">\n                            Summer                        <\/span>\n                                            <\/div>\n                                    <\/div>\n            <\/div>\n                        <div class=\"dh-demo-card\" data-seasons=\"summer,autumn\">\n                <div class=\"dh-demo-card-image\" style=\"background-image:url(https:\/\/images.unsplash.com\/photo-1703023583480-118746a1376f?q=80&amp;w=1470&amp;auto=format&amp;fit=crop&amp;ixlib=rb-4.1.0&amp;ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)\"><\/div>\n                <div class=\"dh-demo-card-body\">\n                                            <span class=\"dh-demo-card-region\">Yokohama<\/span>\n                                        <strong class=\"dh-demo-card-title\">Yokohama<\/strong>\n                                            <span class=\"dh-demo-card-description\">Port City<\/span>\n                                                            <div class=\"dh-demo-card-badges\">\n                                                <span class=\"dh-demo-card-tag\">\n                            Summer                        <\/span>\n                                                <span class=\"dh-demo-card-tag\">\n                            Autumn                        <\/span>\n                                            <\/div>\n                                    <\/div>\n            <\/div>\n                        <div class=\"dh-demo-card\" data-seasons=\"spring,autumn\">\n                <div class=\"dh-demo-card-image\" style=\"background-image:url(https:\/\/images.unsplash.com\/photo-1582167654023-21e3dc0204d1?q=80&amp;w=735&amp;auto=format&amp;fit=crop&amp;ixlib=rb-4.1.0&amp;ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)\"><\/div>\n                <div class=\"dh-demo-card-body\">\n                                            <span class=\"dh-demo-card-region\">Nagoya<\/span>\n                                        <strong class=\"dh-demo-card-title\">Nagoya<\/strong>\n                                            <span class=\"dh-demo-card-description\">Home to Toyota<\/span>\n                                                            <div class=\"dh-demo-card-badges\">\n                                                <span class=\"dh-demo-card-tag\">\n                            Spring                        <\/span>\n                                                <span class=\"dh-demo-card-tag\">\n                            Autumn                        <\/span>\n                                            <\/div>\n                                    <\/div>\n            <\/div>\n                        <div class=\"dh-demo-card\" data-seasons=\"summer,winter\">\n                <div class=\"dh-demo-card-image\" style=\"background-image:url(https:\/\/plus.unsplash.com\/premium_photo-1722593856418-05d6d47eec59?q=80&amp;w=1470&amp;auto=format&amp;fit=crop&amp;ixlib=rb-4.1.0&amp;ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)\"><\/div>\n                <div class=\"dh-demo-card-body\">\n                                            <span class=\"dh-demo-card-region\">Kawasaki<\/span>\n                                        <strong class=\"dh-demo-card-title\">Kawasaki<\/strong>\n                                            <span class=\"dh-demo-card-description\">Connection between Tokyo and Kanagawa<\/span>\n                                                            <div class=\"dh-demo-card-badges\">\n                                                <span class=\"dh-demo-card-tag\">\n                            Summer                        <\/span>\n                                                <span class=\"dh-demo-card-tag\">\n                            Winter                        <\/span>\n                                            <\/div>\n                                    <\/div>\n            <\/div>\n                        <div class=\"dh-demo-card\" data-seasons=\"spring,winter\">\n                <div class=\"dh-demo-card-image\" style=\"background-image:url(https:\/\/images.unsplash.com\/photo-1589452271712-64b8a66c7b71?q=80&amp;w=1471&amp;auto=format&amp;fit=crop&amp;ixlib=rb-4.1.0&amp;ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)\"><\/div>\n                <div class=\"dh-demo-card-body\">\n                                            <span class=\"dh-demo-card-region\">Osaka<\/span>\n                                        <strong class=\"dh-demo-card-title\">Osaka<\/strong>\n                                            <span class=\"dh-demo-card-description\">The nation&#039;s kitchen<\/span>\n                                                            <div class=\"dh-demo-card-badges\">\n                                                <span class=\"dh-demo-card-tag\">\n                            Spring                        <\/span>\n                                                <span class=\"dh-demo-card-tag\">\n                            Winter                        <\/span>\n                                            <\/div>\n                                    <\/div>\n            <\/div>\n                        <div class=\"dh-demo-card\" data-seasons=\"\">\n                <div class=\"dh-demo-card-image\" style=\"background-image:url(https:\/\/images.unsplash.com\/photo-1493976040374-85c8e12f0c0e?q=80&amp;w=1470&amp;auto=format&amp;fit=crop&amp;ixlib=rb-4.1.0&amp;ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)\"><\/div>\n                <div class=\"dh-demo-card-body\">\n                                            <span class=\"dh-demo-card-region\">Kyoto<\/span>\n                                        <strong class=\"dh-demo-card-title\">Kyoto<\/strong>\n                                            <span class=\"dh-demo-card-description\">Japan&#039;s old capital<\/span>\n                                                        <\/div>\n            <\/div>\n                    <\/div>\n\n        <footer class=\"dh-demo-footer\">\n            <p class=\"dh-demo-cta\">\n                Ready to build the real thing?                <a href=\"mailto:tommy@entodigital.io\">Let&#039;s talk.<\/a>\n            <\/p>\n        <\/footer>\n\n    <\/div>\n\n    <style>\n    .dh-demo-page { max-width: 1100px; margin: 0 auto; padding: 0 1rem; font-family: inherit; }\n    .dh-demo-header { padding: 1.5rem 0 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }\n    .dh-demo-header-text { flex: 1; min-width: 0; }\n    .dh-layout-toggle { display: flex; gap: 4px; align-items: center; padding-top: 1.5rem; flex-shrink: 0; }\n    .dh-layout-btn { display: flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1.5px solid rgba(26,46,69,.25); border-radius: 6px; background: transparent; color: #1A2E45; cursor: pointer; opacity: .5; transition: all 150ms ease; }\n    .dh-layout-btn.active { border-color: #1A2E45; background: #1A2E45; color: #FFFCED; opacity: 1; }\n    .dh-layout-btn:hover:not(.active) { border-color: #1A2E45; opacity: .8; }\n    .dh-layout-wrap { width: 100%; margin-bottom: 1.5rem; }\n    .dh-layout-wrap.layout-sidebar { display: grid; grid-template-columns: 200px 1fr; gap: 1.5rem; align-items: start; }\n    .dh-layout-wrap.layout-top { display: block; }\n    .dh-layout-sidebar { padding-top: 0.5rem; }\n    .dh-layout-wrap.layout-sidebar .dh-demo-season-filters { flex-direction: column; align-items: stretch; padding: 0; gap: 4px; }\n    .dh-layout-wrap.layout-sidebar .dh-demo-season-btn { text-align: left; border-radius: 6px; padding: 8px 16px; width: 100%; }\n    .dh-layout-wrap.layout-top .dh-demo-season-filters { padding-top: 0; }\n    @media (max-width: 700px) { .dh-layout-wrap.layout-sidebar { grid-template-columns: 1fr; } }\n    .dh-demo-powered { font-family: 'Manrope', sans-serif; font-size: 11px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #2A2A2A; opacity: 0.4; margin: 0 0 12px; }\n    .dh-demo-title { font-family: 'Petrona', serif; font-size: 36px; font-weight: 700; color: #2A2A2A; margin: 0 0 8px; }\n    .dh-demo-subtitle { font-family: 'Manrope', sans-serif; font-size: 16px; color: #2A2A2A; opacity: 0.6; margin: 0 0 24px; }\n    .dh-demo-map-container { width: 100%; height: 440px; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 12px rgba(0,0,0,.12); }\n    .dh-layout-wrap.layout-sidebar .dh-demo-map-container { height: 520px; }\n    .dh-marker-pin { width: 20px; height: 20px; background: #1A2E45; border: 3px solid #FFFCED; border-radius: 50%; box-shadow: 0 2px 6px rgba(0,0,0,0.4); cursor: pointer; }\n    .dh-demo-season-filters { display: flex; gap: 8px; align-items: center; padding: 16px 0; }\n    .dh-demo-season-btn { font-family: 'Manrope', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: 0.04em; padding: 6px 16px; border-radius: 20px; border: 1.5px solid transparent; background: transparent; color: #2A2A2A; cursor: pointer; transition: all 200ms ease; }\n    .dh-demo-season-btn:hover { border-color: #1A2E45; color: #1A2E45; }\n    .dh-demo-season-btn.active { background: #1A2E45; color: #FFFCED; border-color: #1A2E45; }\n    .dh-demo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 24px; }\n    @media (max-width: 900px) { .dh-demo-grid { grid-template-columns: repeat(2, 1fr); } }\n    @media (max-width: 600px) { .dh-demo-grid { grid-template-columns: 1fr; } }\n    .dh-demo-card { background: #ffffff; border-radius: 10px; overflow: hidden; display: flex; flex-direction: column; }\n    .dh-demo-card-image { width: 100%; height: 200px; background: linear-gradient(135deg, #e8eaf6, #c5cae9) center\/cover no-repeat; display: block; }\n    .dh-demo-card-body { padding: 20px; display: flex; flex-direction: column; gap: 8px; flex-grow: 1; }\n    .dh-demo-card-region { font-family: 'Manrope', sans-serif; font-size: 10px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: #2A2A2A; opacity: 0.45; }\n    .dh-demo-card-title { font-family: 'Petrona', serif; font-size: 18px; font-weight: 700; color: #2A2A2A; margin: 0; }\n    .dh-demo-card-description { font-family: 'Manrope', sans-serif; font-size: 13px; line-height: 1.6; color: #2A2A2A; opacity: 0.65; flex-grow: 1; }\n    .dh-demo-card-badges { display: flex; flex-wrap: wrap; gap: 4px; }\n    .dh-demo-card-tag { display: inline-block; background: #E0E9EE; color: #1A2E45; font-family: 'Manrope', sans-serif; font-size: 10px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; padding: 3px 10px; border-radius: 20px; margin-right: 4px; }\n    .dh-demo-card[hidden] { display: none !important; }\n    .dh-demo-cta { text-align: center; padding: 48px 0 64px; font-family: 'Manrope', sans-serif; font-size: 16px; color: #2A2A2A; }\n    .dh-demo-cta a { color: #1A2E45; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }\n    .dh-demo-cta a:hover { opacity: 0.7; }\n    .dh-demo-notice { padding: 1rem; background: #f9f9f9; border-left: 4px solid #ccc; color: #555; }\n    .dh-demo-request-wrap { max-width: 540px; }\n    .dh-form-field { margin-bottom: 1.1rem; display: flex; flex-direction: column; gap: .35rem; }\n    .dh-form-field label { font-weight: 600; font-size: .9rem; color: #222; }\n    .dh-form-field input, .dh-form-field select { padding: .55rem .75rem; border: 1.5px solid #d0d0d0; border-radius: 6px; font-size: .95rem; width: 100%; box-sizing: border-box; }\n    .dh-form-field input:focus, .dh-form-field select:focus { border-color: #1A2E45; outline: none; box-shadow: 0 0 0 3px rgba(26,46,69,.15); }\n    .dh-demo-submit-btn { padding: .65rem 1.6rem; background: #1A2E45; color: #FFFCED; border: none; border-radius: 6px; font-size: .95rem; font-weight: 600; cursor: pointer; transition: background .15s; }\n    .dh-demo-submit-btn:hover { background: #243d5c; }\n    .dh-demo-request-confirmation { padding: 1.2rem 1.5rem; background: #f0fdf4; border: 1.5px solid #86efac; border-radius: 8px; color: #166534; font-size: 1rem; }\n    <\/style>\n\n    <script src=\"https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/leaflet.js\"><\/script>\n    <script>\n    ( function () {\n        'use strict';\n        var data = {\"locations\":[{\"title\":\"Tokyo\",\"subtitle\":\"Capital City\",\"lat\":35.6762,\"lng\":138.6503,\"image_url\":\"https:\\\/\\\/images.unsplash.com\\\/photo-1549693578-d683be217e58?q=80&w=1477&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\",\"seasons\":[\"spring\",\"summer\"],\"region_label\":\"Tokyo\"},{\"title\":\"Yokohama\",\"subtitle\":\"Port City\",\"lat\":35.4437,\"lng\":139.638,\"image_url\":\"https:\\\/\\\/images.unsplash.com\\\/photo-1703023583480-118746a1376f?q=80&w=1470&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\",\"seasons\":[\"summer\",\"autumn\"],\"region_label\":\"Yokohama\"},{\"title\":\"Nagoya\",\"subtitle\":\"Home to Toyota\",\"lat\":35.1815,\"lng\":136.9066,\"image_url\":\"https:\\\/\\\/images.unsplash.com\\\/photo-1582167654023-21e3dc0204d1?q=80&w=735&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\",\"seasons\":[\"spring\",\"autumn\"],\"region_label\":\"Nagoya\"},{\"title\":\"Kawasaki\",\"subtitle\":\"Connection between Tokyo and Kanagawa\",\"lat\":35.5308,\"lng\":139.703,\"image_url\":\"https:\\\/\\\/plus.unsplash.com\\\/premium_photo-1722593856418-05d6d47eec59?q=80&w=1470&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\",\"seasons\":[\"summer\",\"winter\"],\"region_label\":\"Kawasaki\"},{\"title\":\"Osaka\",\"subtitle\":\"The nation's kitchen\",\"lat\":34.6937,\"lng\":135.5023,\"image_url\":\"https:\\\/\\\/images.unsplash.com\\\/photo-1589452271712-64b8a66c7b71?q=80&w=1471&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\",\"seasons\":[\"spring\",\"winter\"],\"region_label\":\"Osaka\"},{\"title\":\"Kyoto\",\"subtitle\":\"Japan's old capital\",\"lat\":35.0116,\"lng\":135.7681,\"image_url\":\"https:\\\/\\\/images.unsplash.com\\\/photo-1493976040374-85c8e12f0c0e?q=80&w=1470&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D\",\"seasons\":[],\"region_label\":\"Kyoto\"}],\"seasonNames\":{\"spring\":\"Spring\",\"summer\":\"Summer\",\"autumn\":\"Autumn\",\"winter\":\"Winter\"},\"markerColor\":\"#6685ff\",\"markerShape\":\"pin\",\"markerSize\":\"medium\"};\n\n        function esc( str ) {\n            return String( str ).replace( \/&\/g, '&amp;' ).replace( \/<\/g, '&lt;' ).replace( \/>\/g, '&gt;' ).replace( \/\"\/g, '&quot;' );\n        }\n\n        var map;\n        var markers = []; \/\/ { marker: L.Marker, seasons: string[] }\n\n        function initMap() {\n            var el = document.getElementById( 'dh-demo-map' );\n            if ( ! el || typeof L === 'undefined' ) { return; }\n            map = L.map( 'dh-demo-map' );\n            window.dhDemoMap = map;\n            L.tileLayer( 'https:\/\/{s}.tile.openstreetmap.org\/{z}\/{x}\/{y}.png', {\n                attribution: '&copy; <a href=\"https:\/\/www.openstreetmap.org\/copyright\" target=\"_blank\" rel=\"noopener\">OpenStreetMap<\/a> contributors',\n                maxZoom: 19,\n            } ).addTo( map );\n\n            var dhIcon = L.divIcon( {\n                className:  'dh-marker',\n                html:       '<div class=\"dh-marker-pin\"><\/div>',\n                iconSize:   [20, 20],\n                iconAnchor: [10, 10],\n            } );\n            ( data.locations || [] ).forEach( function ( loc ) {\n                var lat = parseFloat( loc.lat ), lng = parseFloat( loc.lng );\n                if ( isNaN( lat ) || isNaN( lng ) ) { return; }\n                var html = '<strong>' + esc( loc.title ) + '<\/strong>';\n                if ( loc.subtitle ) {\n                    html += '<br><span style=\"color:#666;font-size:.85em\">' + esc( loc.subtitle ) + '<\/span>';\n                }\n                var m = L.marker( [lat, lng], { icon: dhIcon } ).bindPopup( html ).addTo( map );\n                markers.push( { marker: m, seasons: loc.seasons || [] } );\n            } );\n\n            fitVisible();\n        }\n\n        function fitVisible() {\n            if ( ! map ) { return; }\n            var latLngs = [];\n            markers.forEach( function ( m ) {\n                if ( map.hasLayer( m.marker ) ) {\n                    latLngs.push( m.marker.getLatLng() );\n                }\n            } );\n            if ( latLngs.length === 1 )    { map.setView( latLngs[0], 11 ); }\n            else if ( latLngs.length > 1 ) { map.fitBounds( L.latLngBounds( latLngs ), { padding: [40,40] } ); }\n            else                           { map.setView( [20, 0], 2 ); }\n        }\n\n        function initFilter() {\n            var btns  = document.querySelectorAll( '.dh-demo-season-btn' );\n            var cards = document.querySelectorAll( '.dh-demo-card' );\n            btns.forEach( function ( btn ) {\n                btn.addEventListener( 'click', function () {\n                    btns.forEach( function ( b ) { b.classList.remove( 'active' ); } );\n                    btn.classList.add( 'active' );\n                    var season = btn.dataset.season;\n\n                    cards.forEach( function ( card ) {\n                        var seasons = card.dataset.seasons ? card.dataset.seasons.split( ',' ) : [];\n                        card.hidden = !! ( season && seasons.indexOf( season ) === -1 );\n                    } );\n\n                    markers.forEach( function ( m ) {\n                        var visible = ! season || m.seasons.indexOf( season ) !== -1;\n                        if ( visible && ! map.hasLayer( m.marker ) ) {\n                            m.marker.addTo( map );\n                        } else if ( ! visible && map.hasLayer( m.marker ) ) {\n                            map.removeLayer( m.marker );\n                        }\n                    } );\n\n                    fitVisible();\n                } );\n            } );\n        }\n\n        function initLayoutToggle() {\n            var PREF_KEY = 'dh-layout-pref-demo';\n            var wrap     = document.querySelector( '.dh-layout-wrap' );\n            var btns     = document.querySelectorAll( '.dh-demo-page .dh-layout-btn' );\n            if ( ! wrap || ! btns.length ) { return; }\n            var saved    = localStorage.getItem( PREF_KEY ) || 'sidebar';\n            applyLayout( saved );\n            Array.prototype.forEach.call( btns, function ( btn ) {\n                btn.addEventListener( 'click', function () {\n                    applyLayout( btn.dataset.layout );\n                    localStorage.setItem( PREF_KEY, btn.dataset.layout );\n                } );\n            } );\n            function applyLayout( layout ) {\n                wrap.classList.remove( 'layout-sidebar', 'layout-top' );\n                wrap.classList.add( 'layout-' + layout );\n                Array.prototype.forEach.call( btns, function ( b ) {\n                    b.classList.toggle( 'active', b.dataset.layout === layout );\n                } );\n                if ( window.dhDemoMap ) {\n                    setTimeout( function () { window.dhDemoMap.invalidateSize(); }, 200 );\n                }\n            }\n        }\n\n        initMap();\n        initFilter();\n        initLayoutToggle();\n    } )();\n    <\/script>\n    \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-45","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/entohub.synology.me\/index.php\/wp-json\/wp\/v2\/pages\/45","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/entohub.synology.me\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/entohub.synology.me\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/entohub.synology.me\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/entohub.synology.me\/index.php\/wp-json\/wp\/v2\/comments?post=45"}],"version-history":[{"count":0,"href":"https:\/\/entohub.synology.me\/index.php\/wp-json\/wp\/v2\/pages\/45\/revisions"}],"wp:attachment":[{"href":"https:\/\/entohub.synology.me\/index.php\/wp-json\/wp\/v2\/media?parent=45"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}