{"id":1187,"date":"2026-06-25T04:52:39","date_gmt":"2026-06-25T04:52:39","guid":{"rendered":"https:\/\/reachyou.in\/blogs\/?st-import=820ab40d57997196cb4643767e540713"},"modified":"2026-10-16T11:53:09","modified_gmt":"2026-10-16T11:53:09","slug":"blog-lists","status":"publish","type":"page","link":"https:\/\/reachyou.in\/blogs\/","title":{"rendered":"Blogs"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1187\" class=\"elementor elementor-1187\">\n\t\t\t\t<div class=\"elementor-element elementor-element-8f5dec7 e-flex e-con-boxed e-con e-parent\" data-id=\"8f5dec7\" 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-c3624d0 elementor-widget elementor-widget-html\" data-id=\"c3624d0\" 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\/* ===== REACHYOU BLOG GRID ===== *\/\n\n.ry-blog-section {\n    width: 100%;\n    max-width: 1250px;\n    margin: 0 auto;\n    padding: 60px 20px;\n    font-family: \"Poppins\", Arial, sans-serif;\n}\n\n.ry-blog-header {\n    text-align: center;\n    margin-bottom: 40px;\n}\n\n.ry-blog-header h2 {\n    font-size: 38px;\n    font-weight: 700;\n    color: #111;\n    margin: 0 0 10px;\n}\n\n.ry-blog-header p {\n    font-size: 15px;\n    color: #777;\n    margin: 0;\n}\n\n.ry-blog-grid {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 28px;\n}\n\n.ry-blog-card {\n    background: #fff;\n    border: 1px solid #e9e9e9;\n    border-radius: 14px;\n    overflow: hidden;\n    transition: all 0.3s ease;\n    box-shadow: 0 5px 20px rgba(0,0,0,0.05);\n}\n\n.ry-blog-card:hover {\n    transform: translateY(-6px);\n    box-shadow: 0 15px 35px rgba(0,0,0,0.12);\n}\n\n.ry-blog-image {\n    width: 100%;\n    height: 220px;\n    overflow: hidden;\n    background: #f3f3f3;\n}\n\n.ry-blog-image img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n    transition: transform 0.4s ease;\n}\n\n.ry-blog-card:hover .ry-blog-image img {\n    transform: scale(1.04);\n}\n\n.ry-blog-content {\n    padding: 23px;\n}\n\n.ry-blog-date {\n    font-size: 12px;\n    color: #888;\n    margin-bottom: 10px;\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n.ry-blog-title {\n    font-size: 20px;\n    line-height: 1.4;\n    font-weight: 700;\n    margin: 0 0 12px;\n}\n\n.ry-blog-title a {\n    color: #111;\n    text-decoration: none;\n}\n\n.ry-blog-title a:hover {\n    color: #555;\n}\n\n.ry-blog-excerpt {\n    font-size: 14px;\n    line-height: 1.7;\n    color: #666;\n    margin-bottom: 20px;\n}\n\n.ry-read-more {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 13px;\n    font-weight: 600;\n    text-decoration: none;\n    color: #111;\n    border-bottom: 1px solid #111;\n    padding-bottom: 3px;\n}\n\n.ry-read-more:hover {\n    opacity: 0.65;\n}\n\n.ry-load-wrap {\n    text-align: center;\n    margin-top: 40px;\n}\n\n#ryLoadMore {\n    border: none;\n    background: #111;\n    color: #fff;\n    padding: 13px 30px;\n    border-radius: 6px;\n    font-family: inherit;\n    font-size: 14px;\n    font-weight: 600;\n    cursor: pointer;\n    transition: 0.25s;\n}\n\n#ryLoadMore:hover {\n    background: #333;\n}\n\n#ryLoadMore:disabled {\n    opacity: 0.5;\n    cursor: not-allowed;\n}\n\n.ry-blog-loading,\n.ry-blog-error {\n    grid-column: 1 \/ -1;\n    text-align: center;\n    padding: 40px;\n    color: #777;\n}\n\n@media (max-width: 1024px) {\n    .ry-blog-grid {\n        grid-template-columns: repeat(2, 1fr);\n    }\n}\n\n@media (max-width: 650px) {\n    .ry-blog-section {\n        padding: 40px 15px;\n    }\n\n    .ry-blog-grid {\n        grid-template-columns: 1fr;\n        gap: 22px;\n    }\n\n    .ry-blog-header h2 {\n        font-size: 30px;\n    }\n\n    .ry-blog-image {\n        height: 210px;\n    }\n}\n<\/style>\n\n\n<section class=\"ry-blog-section\">\n\n    <div class=\"ry-blog-header\">\n        <h2>Latest Blogs<\/h2>\n    <\/div>\n\n    <div id=\"ryBlogGrid\" class=\"ry-blog-grid\">\n        <div class=\"ry-blog-loading\">Loading blogs...<\/div>\n    <\/div>\n\n    <div class=\"ry-load-wrap\">\n        <button id=\"ryLoadMore\" style=\"display:none;\">\n            Load More\n        <\/button>\n    <\/div>\n\n<\/section>\n\n\n<script>\n(function () {\n\n    const grid = document.getElementById(\"ryBlogGrid\");\n    const loadMore = document.getElementById(\"ryLoadMore\");\n\n    \/*\n       Your WordPress installation:\n       https:\/\/reachyou.in\/blogs\/\n    *\/\n    const apiURL = \"\/blogs\/wp-json\/wp\/v2\/posts\";\n\n    const perPage = 9;\n\n    let currentPage = 1;\n    let totalPages = 1;\n\n\n    function stripHTML(html) {\n        const temp = document.createElement(\"div\");\n        temp.innerHTML = html;\n        return temp.textContent || temp.innerText || \"\";\n    }\n\n\n    function createExcerpt(post) {\n\n        let excerpt = \"\";\n\n        if (post.excerpt && post.excerpt.rendered) {\n            excerpt = stripHTML(post.excerpt.rendered);\n        }\n\n        if (!excerpt && post.content && post.content.rendered) {\n            excerpt = stripHTML(post.content.rendered);\n        }\n\n        if (excerpt.length > 115) {\n            excerpt = excerpt.substring(0, 115) + \"...\";\n        }\n\n        return excerpt;\n    }\n\n\n    function getFeaturedImage(post) {\n\n        try {\n\n            const media =\n                post._embedded[\"wp:featuredmedia\"][0];\n\n            if (\n                media.media_details &&\n                media.media_details.sizes &&\n                media.media_details.sizes.medium_large\n            ) {\n                return media.media_details.sizes.medium_large.source_url;\n            }\n\n            return media.source_url;\n\n        } catch (error) {\n\n            return \"\";\n        }\n    }\n\n\n    function formatDate(dateString) {\n\n        const date = new Date(dateString);\n\n        return date.toLocaleDateString(\"en-IN\", {\n            day: \"numeric\",\n            month: \"short\",\n            year: \"numeric\"\n        });\n    }\n\n\n    function createPostCard(post) {\n\n        const image = getFeaturedImage(post);\n\n        const title =\n            post.title && post.title.rendered\n                ? post.title.rendered\n                : \"Blog Post\";\n\n        const excerpt = createExcerpt(post);\n\n        const imageHTML = image\n            ? `\n                <a href=\"${post.link}\">\n                    <div class=\"ry-blog-image\">\n                        <img decoding=\"async\"\n                            src=\"${image}\"\n                            alt=\"${stripHTML(title)}\"\n                            loading=\"lazy\"\n                        >\n                    <\/div>\n                <\/a>\n              `\n            : \"\";\n\n\n        return `\n            <article class=\"ry-blog-card\">\n\n                ${imageHTML}\n\n                <div class=\"ry-blog-content\">\n\n                    <div class=\"ry-blog-date\">\n                        ${formatDate(post.date)}\n                    <\/div>\n\n                    <h3 class=\"ry-blog-title\">\n                        <a href=\"${post.link}\">\n                            ${title}\n                        <\/a>\n                    <\/h3>\n\n                    <div class=\"ry-blog-excerpt\">\n                        ${excerpt}\n                    <\/div>\n\n                    <a\n                        class=\"ry-read-more\"\n                        href=\"${post.link}\"\n                    >\n                        Read More \u2192\n                    <\/a>\n\n                <\/div>\n\n            <\/article>\n        `;\n    }\n\n\n    async function loadPosts(page = 1) {\n\n        try {\n\n            loadMore.disabled = true;\n\n            const response = await fetch(\n                `${apiURL}?per_page=${perPage}&page=${page}&_embed=1&orderby=date&order=desc`\n            );\n\n            if (!response.ok) {\n                throw new Error(\"Unable to load posts\");\n            }\n\n            totalPages =\n                parseInt(\n                    response.headers.get(\"X-WP-TotalPages\")\n                ) || 1;\n\n            const posts = await response.json();\n\n\n            if (page === 1) {\n                grid.innerHTML = \"\";\n            }\n\n\n            if (!posts.length && page === 1) {\n\n                grid.innerHTML =\n                    '<div class=\"ry-blog-loading\">No blogs found.<\/div>';\n\n                loadMore.style.display = \"none\";\n\n                return;\n            }\n\n\n            posts.forEach(post => {\n\n                grid.insertAdjacentHTML(\n                    \"beforeend\",\n                    createPostCard(post)\n                );\n\n            });\n\n\n            if (currentPage < totalPages) {\n\n                loadMore.style.display = \"inline-block\";\n\n            } else {\n\n                loadMore.style.display = \"none\";\n            }\n\n\n            loadMore.disabled = false;\n\n\n        } catch (error) {\n\n            console.error(error);\n\n            if (page === 1) {\n                grid.innerHTML =\n                    '<div class=\"ry-blog-error\">Unable to load blogs.<\/div>';\n            }\n\n            loadMore.style.display = \"none\";\n        }\n    }\n\n\n    loadMore.addEventListener(\"click\", function () {\n\n        if (currentPage < totalPages) {\n\n            currentPage++;\n\n            loadPosts(currentPage);\n        }\n\n    });\n\n\n    loadPosts(currentPage);\n\n})();\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>Latest Blogs Loading blogs&#8230; Load More<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"default","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":"disabled","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"enabled","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":"","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-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":"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":""},"mobile":{"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":""}},"footnotes":""},"class_list":["post-1187","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/reachyou.in\/blogs\/wp-json\/wp\/v2\/pages\/1187","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/reachyou.in\/blogs\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/reachyou.in\/blogs\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/reachyou.in\/blogs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/reachyou.in\/blogs\/wp-json\/wp\/v2\/comments?post=1187"}],"version-history":[{"count":26,"href":"https:\/\/reachyou.in\/blogs\/wp-json\/wp\/v2\/pages\/1187\/revisions"}],"predecessor-version":[{"id":1987,"href":"https:\/\/reachyou.in\/blogs\/wp-json\/wp\/v2\/pages\/1187\/revisions\/1987"}],"wp:attachment":[{"href":"https:\/\/reachyou.in\/blogs\/wp-json\/wp\/v2\/media?parent=1187"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}