{"id":52622,"date":"2026-05-17T14:21:19","date_gmt":"2026-05-17T18:21:19","guid":{"rendered":"https:\/\/empathymatters.org\/now\/?p=52622"},"modified":"2026-05-19T22:34:54","modified_gmt":"2026-05-20T02:34:54","slug":"test_page","status":"publish","type":"post","link":"https:\/\/empathymatters.org\/now\/test_page\/","title":{"rendered":"test_page"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"52622\" class=\"elementor elementor-52622\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9cb47cd e-con-full e-flex e-con e-parent\" data-id=\"9cb47cd\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-79984c3 elementor-widget elementor-widget-spacer\" data-id=\"79984c3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\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-e3d1d92 e-flex e-con-boxed e-con e-parent\" data-id=\"e3d1d92\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-20d03e6 e-con-full e-flex e-con e-child\" data-id=\"20d03e6\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b744330 e-con-full e-flex e-con e-child\" data-id=\"b744330\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-56c5294 elementor-widget elementor-widget-code_snippet_dm\" data-id=\"56c5294\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code_snippet_dm.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\r\n        <div class=\"dm-code-snippet dark default  dm-normal-version\" style=\"background-color: #abb8c3;\" snippet-height=\"\">\r\n\t\t\t<div class=\"control-language\">\r\n                <div class=\"dm-buttons\">\r\n                    <div class=\"dm-buttons-left\">\r\n                        <div class=\"dm-button-snippet red-button\"><\/div>\r\n                        <div class=\"dm-button-snippet orange-button\"><\/div>\r\n                        <div class=\"dm-button-snippet green-button\"><\/div>\r\n                    <\/div>\r\n                    <div class=\"dm-buttons-right\">\r\n                        <a id=\"dm-copy-raw-code\">\r\n                        <span class=\"dm-copy-text\">Copy Text<\/span>\r\n                        <span class=\"dm-copy-confirmed\" style=\"display:none\">Copied<\/span>\r\n                        <span class=\"dm-error-message\" style=\"display:none\">Use a different Browser<\/span><\/a>\r\n                    <\/div>\r\n                <\/div>\r\n                <pre class=\"no-line-numbers\"><code id=\"dm-code-raw\" class=\"no-wrap language-php\">\n\/* PART ONE, PHP in &quot;Code Snippet&quot; (plugin)\n\n  AI made this wonderful code to help web page loading time.\n \n Sample page: https:\/\/empathymatters.org\/now\/test_page *\/\n\n\n\/\/ 1. SHORTCODE: \n    <div id=\"ajax-target-section\">\n        <div class=\"loader-container\">\n            <div class=\"custom-spinner\"><\/div>\n            <!-- p>Loading Empathy Matters Content...<\/p -->\n        <\/div>\n    <\/div>\nadd_shortcode(&#039;delayed_content_area&#039;, function() {\n    return &#039;\n    &lt;div id=&quot;ajax-target-section&quot;&gt;\n        &lt;div class=&quot;loader-container&quot;&gt;\n            &lt;div class=&quot;custom-spinner&quot;&gt;&lt;\/div&gt;\n            &lt;!-- p&gt;Loading Empathy Matters Content...&lt;\/p --&gt;\n        &lt;\/div&gt;\n    &lt;\/div&gt;&#039;;\n});\n\n\/\/  2. THE REST API ENDPOINT\n\n\nadd_action(&#039;rest_api_init&#039;, function () {\n    register_rest_route(&#039;my-custom\/v1&#039;, &#039;\/section&#039;, array(\n        &#039;methods&#039; =&gt; &#039;GET&#039;,\n        &#039;callback&#039; =&gt; &#039;get_my_delayed_section_content&#039;,\n        &#039;permission_callback&#039; =&gt; &#039;__return_true&#039;, \n    ));\n});\n\nfunction get_my_delayed_section_content() {\n    \/\/ This specifically renders your HFE template\n\n\/\/ $content = do_shortcode(&#039;&#039;);\n\n$post_id = 52586;\n\n\/\/ 3. Get the HTML content\n$content = do_shortcode(&#039;&#039;);\n\n\/\/ 4. Manually fetch and append the Elementor CSS\nif (class_exists(&#039;\\Elementor\\Core\\Files\\CSS\\Post&#039;)) {\n    $css_file = new \\Elementor\\Core\\Files\\CSS\\Post($post_id);\n    $css_content = $css_file-&gt;get_content();\n    \n    if ($css_content) {\n        $content = &#039;&lt;style&gt;&#039; . $css_content . &#039;&lt;\/style&gt;&#039; . $content;\n    }\n}\n\nreturn new WP_REST_Response($content, 200);\n\n}\n\n\n\/\/\n\/\/ part 2 is Java Script in an HTML Widget.\n\/\/ \n\/\/ Sample page: https:\/\/empathymatters.org\/now\/test_page\n\/\/\n\n\n<\/code><\/pre>\r\n\t\t\t<\/div>\r\n        <\/div>\r\n\r\n\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-22c219f e-con-full e-flex e-con e-child\" data-id=\"22c219f\" data-element_type=\"container\" data-e-type=\"container\">\n\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-508c465 e-flex e-con-boxed e-con e-parent\" data-id=\"508c465\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-aab15d5 elementor-widget elementor-widget-spacer\" data-id=\"aab15d5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\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<div class=\"elementor-element elementor-element-eb69f2e e-flex e-con-boxed e-con e-parent\" data-id=\"eb69f2e\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-e0d1d95 e-con-full e-flex e-con e-child\" data-id=\"e0d1d95\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-39f0d57 e-con-full e-flex e-con e-child\" data-id=\"39f0d57\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a5a2a26 elementor-widget elementor-widget-code_snippet_dm\" data-id=\"a5a2a26\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"code_snippet_dm.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\r\n        <div class=\"dm-code-snippet dark default  dm-normal-version\" style=\"background-color: #abb8c3;\" snippet-height=\"\">\r\n\t\t\t<div class=\"control-language\">\r\n                <div class=\"dm-buttons\">\r\n                    <div class=\"dm-buttons-left\">\r\n                        <div class=\"dm-button-snippet red-button\"><\/div>\r\n                        <div class=\"dm-button-snippet orange-button\"><\/div>\r\n                        <div class=\"dm-button-snippet green-button\"><\/div>\r\n                    <\/div>\r\n                    <div class=\"dm-buttons-right\">\r\n                        <a id=\"dm-copy-raw-code\">\r\n                        <span class=\"dm-copy-text\">Copy Text<\/span>\r\n                        <span class=\"dm-copy-confirmed\" style=\"display:none\">Copied<\/span>\r\n                        <span class=\"dm-error-message\" style=\"display:none\">Use a different Browser<\/span><\/a>\r\n                    <\/div>\r\n                <\/div>\r\n                <pre class=\"no-line-numbers\"><code id=\"dm-code-raw\" class=\"no-wrap language-php\">\/\/ PART TWO, Java Script \n\n\n&lt;!-- Java Script in HTML Widget --&gt;\n\n&lt;script&gt;\n\ndocument.addEventListener(&#039;DOMContentLoaded&#039;, function() {\n    \n    setTimeout(function() {\n        \n        const container = document.getElementById(&#039;ajax-target-section&#039;);\n        if (!container) return;\n\n        \/**\n         * Updated Path: Includes the &#039;\/now\/&#039; subdirectory \n         * where your WordPress installation lives.\n         *\/\n        const restUrl = &#039;\/now\/wp-json\/my-custom\/v1\/section&#039;;\n\n        fetch(restUrl)\n            .then(response =&gt; {\n                if (!response.ok) throw new Error(&#039;Could not find the REST path&#039;);\n                return response.json();\n            })\n            .then(htmlContent =&gt; {\n                container.innerHTML = htmlContent;\n\n                \/\/ Wake up Elementor\n \/*               if (window.elementorFrontend &amp;&amp; window.elementorFrontend.init) {\n                    window.elementorFrontend.init();\n                }\n*\/ \n\n\nif ( window.elementorFrontend ) {\n   window.elementorFrontend.init();\n}\n\n                \/\/ Final layout fix\n                window.dispatchEvent(new Event(&#039;resize&#039;));\n            })\n            .catch(error =&gt; {\n                console.error(&#039;Fetch Error:&#039;, error);\n                container.innerHTML = &#039;Content could not be loaded via REST.&#039;;\n            });\n\n    }, 3000);\n});\n\n\n&lt;\/script&gt;\n\n\n<\/code><\/pre>\r\n\t\t\t<\/div>\r\n        <\/div>\r\n\r\n\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-911f254 e-con-full e-flex e-con e-child\" data-id=\"911f254\" data-element_type=\"container\" data-e-type=\"container\">\n\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-b1d5a03 e-flex e-con-boxed e-con e-parent\" data-id=\"b1d5a03\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ac8a0d2 elementor-widget elementor-widget-html\" data-id=\"ac8a0d2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<style>\n\n\/* Container for the loader *\/\n.loader-container {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    padding: 40px;\n    font-family: sans-serif;\n    color: #666;\n}\n\n\/* The actual spinning circle *\/\n.custom-spinner {\n    width: 40px;\n    height: 40px;\n    border: 4px solid #f3f3f3; \/* Light gray *\/\n    border-top: 4px solid #3498db; \/* Blue - Change this to match your brand! *\/\n    border-radius: 50%;\n    animation: spin 1s linear infinite;\n    margin-bottom: 15px;\n}\n\n\/* Animation keyframes *\/\n@keyframes spin {\n    0% { transform: rotate(0deg); }\n    100% { transform: rotate(360deg); }\n}\n\n\/* Optional: Smooth transition for when content loads *\/\n\/\/ #ajax-target-section {\n\n#delayed_content_area {\n    transition: opacity 0.9s ease-in-out;\n}\n\n<\/style>\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<div class=\"elementor-element elementor-element-3e696cf e-flex e-con-boxed e-con e-parent\" data-id=\"3e696cf\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6c159a0 elementor-widget elementor-widget-html\" data-id=\"6c159a0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<script>\ndocument.addEventListener('DOMContentLoaded', function() {\n    \n    setTimeout(function() {\n        \n        const container = document.getElementById('ajax-target-section');\n        if (!container) return;\n\n        \/**\n         * Updated Path: Includes the '\/now\/' subdirectory \n         * where your WordPress installation lives.\n         *\/\n        const restUrl = '\/now\/wp-json\/my-custom\/v1\/section';\n\n        fetch(restUrl)\n            .then(response => {\n                if (!response.ok) throw new Error('Could not find the REST path');\n                return response.json();\n            })\n            .then(htmlContent => {\n\n    container.style.opacity = 0;\n                container.innerHTML = htmlContent;\n    container.style.opacity = 1;\n\n                \/\/ Wake up Elementor\n                if (window.elementorFrontend && window.elementorFrontend.init) {\n                    window.elementorFrontend.init();\n                }\n\n\n\/*\nif ( window.elementorFrontend ) {\n   window.elementorFrontend.init();\n}\n*\/\n                \/\/ Final layout fix\n                window.dispatchEvent(new Event('resize'));\n            })\n            .catch(error => {\n                console.error('Fetch Error:', error);\n                container.innerHTML = 'Content could not be loaded via REST.';\n            });\n\n    }, 3000);\n});\n<\/script>\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<div class=\"elementor-element elementor-element-ce32f97 e-flex e-con-boxed e-con e-parent\" data-id=\"ce32f97\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e68fb54 elementor-widget elementor-widget-shortcode\" data-id=\"e68fb54\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\n    <div id=\"ajax-target-section\">\n        <div class=\"loader-container\">\n            <div class=\"custom-spinner\"><\/div>\n            <!-- p>Loading Empathy Matters Content...<\/p -->\n        <\/div>\n    <\/div><\/div>\n\t\t\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>Copy Text Copied Use a different Browser \/* PART ONE, PHP in &quot;Code Snippet&quot; (plugin) AI made this wonderful code to help web page loading time. Sample page: https:\/\/empathymatters.org\/now\/test_page *\/ \/\/ 1. SHORTCODE: add_shortcode(&#039;delayed_content_area&#039;, function() { return &#039; &lt;div id=&quot;ajax-target-section&quot;&gt; &lt;div class=&quot;loader-container&quot;&gt; &lt;div class=&quot;custom-spinner&quot;&gt;&lt;\/div&gt; &lt;!&#8211; p&gt;Loading Empathy Matters Content&#8230;&lt;\/p &#8211;&gt; &lt;\/div&gt; &lt;\/div&gt;&#039;; }); \/\/ 2. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"elementor_canvas","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"_uf_show_specific_survey":0,"_uf_disable_surveys":false,"ocean_post_layout":"","ocean_both_sidebars_style":"","ocean_both_sidebars_content_width":0,"ocean_both_sidebars_sidebars_width":0,"ocean_sidebar":"0","ocean_second_sidebar":"0","ocean_disable_margins":"enable","ocean_add_body_class":"","ocean_shortcode_before_top_bar":"","ocean_shortcode_after_top_bar":"","ocean_shortcode_before_header":"","ocean_shortcode_after_header":"","ocean_has_shortcode":"","ocean_shortcode_after_title":"","ocean_shortcode_before_footer_widgets":"","ocean_shortcode_after_footer_widgets":"","ocean_shortcode_before_footer_bottom":"","ocean_shortcode_after_footer_bottom":"","ocean_display_top_bar":"default","ocean_display_header":"default","ocean_header_style":"","ocean_center_header_left_menu":"0","ocean_custom_header_template":"0","ocean_custom_logo":0,"ocean_custom_retina_logo":0,"ocean_custom_logo_max_width":0,"ocean_custom_logo_tablet_max_width":0,"ocean_custom_logo_mobile_max_width":0,"ocean_custom_logo_max_height":0,"ocean_custom_logo_tablet_max_height":0,"ocean_custom_logo_mobile_max_height":0,"ocean_header_custom_menu":"0","ocean_menu_typo_font_family":"0","ocean_menu_typo_font_subset":"","ocean_menu_typo_font_size":0,"ocean_menu_typo_font_size_tablet":0,"ocean_menu_typo_font_size_mobile":0,"ocean_menu_typo_font_size_unit":"px","ocean_menu_typo_font_weight":"","ocean_menu_typo_font_weight_tablet":"","ocean_menu_typo_font_weight_mobile":"","ocean_menu_typo_transform":"","ocean_menu_typo_transform_tablet":"","ocean_menu_typo_transform_mobile":"","ocean_menu_typo_line_height":0,"ocean_menu_typo_line_height_tablet":0,"ocean_menu_typo_line_height_mobile":0,"ocean_menu_typo_line_height_unit":"","ocean_menu_typo_spacing":0,"ocean_menu_typo_spacing_tablet":0,"ocean_menu_typo_spacing_mobile":0,"ocean_menu_typo_spacing_unit":"","ocean_menu_link_color":"","ocean_menu_link_color_hover":"","ocean_menu_link_color_active":"","ocean_menu_link_background":"","ocean_menu_link_hover_background":"","ocean_menu_link_active_background":"","ocean_menu_social_links_bg":"","ocean_menu_social_hover_links_bg":"","ocean_menu_social_links_color":"","ocean_menu_social_hover_links_color":"","ocean_disable_title":"default","ocean_disable_heading":"default","ocean_post_title":"","ocean_post_subheading":"","ocean_post_title_style":"","ocean_post_title_background_color":"","ocean_post_title_background":0,"ocean_post_title_bg_image_position":"","ocean_post_title_bg_image_attachment":"","ocean_post_title_bg_image_repeat":"","ocean_post_title_bg_image_size":"","ocean_post_title_height":0,"ocean_post_title_bg_overlay":0.5,"ocean_post_title_bg_overlay_color":"","ocean_disable_breadcrumbs":"default","ocean_breadcrumbs_color":"","ocean_breadcrumbs_separator_color":"","ocean_breadcrumbs_links_color":"","ocean_breadcrumbs_links_hover_color":"","ocean_display_footer_widgets":"default","ocean_display_footer_bottom":"default","ocean_custom_footer_template":"0","omw_enable_modal_window":"enable","ocean_post_oembed":"","ocean_post_self_hosted_media":"","ocean_post_video_embed":"","ocean_link_format":"","ocean_link_format_target":"self","ocean_quote_format":"","ocean_quote_format_link":"post","ocean_gallery_link_images":"off","ocean_gallery_id":[],"footnotes":""},"categories":[61],"tags":[],"class_list":["post-52622","post","type-post","status-publish","format-standard","hentry","category-empathy","entry"],"_links":{"self":[{"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/posts\/52622","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/comments?post=52622"}],"version-history":[{"count":5,"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/posts\/52622\/revisions"}],"predecessor-version":[{"id":53089,"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/posts\/52622\/revisions\/53089"}],"wp:attachment":[{"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/media?parent=52622"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/categories?post=52622"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/empathymatters.org\/now\/wp-json\/wp\/v2\/tags?post=52622"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}