{"id":367,"date":"2026-01-11T08:49:44","date_gmt":"2026-01-11T08:49:44","guid":{"rendered":"https:\/\/africaihsanaid.org\/?page_id=367"},"modified":"2026-01-11T11:14:25","modified_gmt":"2026-01-11T11:14:25","slug":"our-projects","status":"publish","type":"page","link":"https:\/\/africaihsanaid.org\/index.php\/our-projects\/","title":{"rendered":"Our Projects"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"367\" class=\"elementor elementor-367\">\n\t\t\t\t<div class=\"elementor-element elementor-element-44cb3cb e-con-full e-flex e-con e-parent\" data-id=\"44cb3cb\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f472f3d elementor-widget elementor-widget-html\" data-id=\"f472f3d\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n    <meta charset=\"UTF-8\">\r\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n    <title>Our Projects - Africa Ihsan Aid Foundation<\/title>\r\n    <style>\r\n        \/* Reset and Base Styles *\/\r\n        * {\r\n            margin: 0;\r\n            padding: 0;\r\n            box-sizing: border-box;\r\n        }\r\n        \r\n        body {\r\n            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\r\n            line-height: 1.6;\r\n            color: #333;\r\n            background: #f8f9fa;\r\n        }\r\n        \r\n        \/* Full Width Section *\/\r\n        .aiaf-projects-section {\r\n            width: 100vw;\r\n            margin-left: calc(-50vw + 50%);\r\n            padding: 80px 0;\r\n            background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%);\r\n        }\r\n        \r\n        .aiaf-container {\r\n            max-width: 1200px;\r\n            margin: 0 auto;\r\n            padding: 0 20px;\r\n        }\r\n        \r\n        \/* Section Header *\/\r\n        .section-header {\r\n            text-align: center;\r\n            margin-bottom: 50px;\r\n        }\r\n        \r\n        .section-subtitle {\r\n            color: #0087f0;\r\n            font-size: 18px;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 1px;\r\n            margin-bottom: 15px;\r\n            display: block;\r\n        }\r\n        \r\n        .section-title {\r\n            font-size: 42px;\r\n            font-weight: 700;\r\n            color: #222;\r\n            margin-bottom: 15px;\r\n        }\r\n        \r\n        .section-title span {\r\n            color: #00a550;\r\n        }\r\n        \r\n        .section-description {\r\n            font-size: 18px;\r\n            color: #666;\r\n            max-width: 600px;\r\n            margin: 0 auto;\r\n        }\r\n        \r\n        \/* Category Filters *\/\r\n        .category-filters {\r\n            display: flex;\r\n            justify-content: center;\r\n            flex-wrap: wrap;\r\n            gap: 15px;\r\n            margin-bottom: 40px;\r\n        }\r\n        \r\n        .filter-btn {\r\n            padding: 12px 25px;\r\n            background: white;\r\n            border: 2px solid #e0e0e0;\r\n            border-radius: 50px;\r\n            font-size: 16px;\r\n            font-weight: 600;\r\n            color: #555;\r\n            cursor: pointer;\r\n            transition: all 0.3s ease;\r\n        }\r\n        \r\n        .filter-btn:hover {\r\n            background: white;\r\n            border-color: #0000;\r\n            color: #0087f0;\r\n        }\r\n        \r\n        .filter-btn.active {\r\n            background: linear-gradient(135deg, #00a550 0%, #0087f0 100%);\r\n            border-color: transparent;\r\n            color: white;\r\n        }\r\n        \r\n        \/* Projects Grid *\/\r\n        .projects-grid {\r\n            display: grid;\r\n            grid-template-columns: repeat(3, 1fr);\r\n            gap: 30px;\r\n        }\r\n        \r\n        .project-card {\r\n            background: white;\r\n            border-radius: 15px;\r\n            overflow: hidden;\r\n            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);\r\n            transition: all 0.3s ease;\r\n        }\r\n        \r\n        .project-card:hover {\r\n            transform: translateY(-10px);\r\n            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);\r\n        }\r\n        \r\n        .project-image {\r\n            width: 100%;\r\n            height: 220px;\r\n            object-fit: cover;\r\n        }\r\n        \r\n        .project-content {\r\n            padding: 25px;\r\n        }\r\n        \r\n        .project-category {\r\n            display: inline-block;\r\n            padding: 5px 15px;\r\n            background: linear-gradient(135deg, #00a550 0%, #0087f0 100%);\r\n            color: white;\r\n            border-radius: 20px;\r\n            font-size: 12px;\r\n            font-weight: 600;\r\n            text-transform: uppercase;\r\n            letter-spacing: 0.5px;\r\n            margin-bottom: 15px;\r\n        }\r\n        \r\n        .project-title {\r\n            font-size: 20px;\r\n            font-weight: 700;\r\n            color: #222;\r\n            margin-bottom: 15px;\r\n            line-height: 1.4;\r\n        }\r\n        \r\n        .project-excerpt {\r\n            color: #666;\r\n            font-size: 15px;\r\n            line-height: 1.6;\r\n            margin-bottom: 20px;\r\n            display: -webkit-box;\r\n            -webkit-line-clamp: 3;\r\n            -webkit-box-orient: vertical;\r\n            overflow: hidden;\r\n        }\r\n        \r\n        .project-meta {\r\n            display: flex;\r\n            justify-content: space-between;\r\n            align-items: center;\r\n            padding-top: 15px;\r\n            border-top: 1px solid #f0f0f0;\r\n        }\r\n        \r\n        .read-more {\r\n            color: #0087f0;\r\n            text-decoration: none;\r\n            font-weight: 600;\r\n            font-size: 14px;\r\n            transition: color 0.3s ease;\r\n        }\r\n        \r\n        .read-more:hover {\r\n            color: #00a550;\r\n        }\r\n        \r\n        \/* No Projects Message *\/\r\n        .no-projects {\r\n            text-align: center;\r\n            padding: 60px 20px;\r\n            color: #666;\r\n            font-size: 18px;\r\n            grid-column: 1 \/ -1;\r\n        }\r\n        \r\n        \/* Responsive Styles *\/\r\n        @media (max-width: 1024px) {\r\n            .projects-grid {\r\n                grid-template-columns: repeat(2, 1fr);\r\n                gap: 25px;\r\n            }\r\n            \r\n            .section-title {\r\n                font-size: 36px;\r\n            }\r\n        }\r\n        \r\n        @media (max-width: 768px) {\r\n            .aiaf-projects-section {\r\n                padding: 60px 0;\r\n            }\r\n            \r\n            .projects-grid {\r\n                grid-template-columns: 1fr;\r\n                gap: 20px;\r\n                max-width: 500px;\r\n                margin-left: auto;\r\n                margin-right: auto;\r\n            }\r\n            \r\n            .section-title {\r\n                font-size: 32px;\r\n            }\r\n            \r\n            .section-description {\r\n                font-size: 16px;\r\n            }\r\n            \r\n            .category-filters {\r\n                gap: 10px;\r\n            }\r\n            \r\n            .filter-btn {\r\n                padding: 10px 20px;\r\n                font-size: 14px;\r\n            }\r\n        }\r\n        \r\n        @media (max-width: 480px) {\r\n            .aiaf-projects-section {\r\n                padding: 40px 0;\r\n            }\r\n            \r\n            .section-title {\r\n                font-size: 28px;\r\n            }\r\n            \r\n            .project-content {\r\n                padding: 20px;\r\n            }\r\n            \r\n            .project-title {\r\n                font-size: 18px;\r\n            }\r\n        }\r\n    <\/style>\r\n<\/head>\r\n<body>\r\n    <section class=\"aiaf-projects-section\">\r\n        <div class=\"aiaf-container\">\r\n            <!-- Section Header -->\r\n            <div class=\"section-header\">\r\n                <span class=\"section-subtitle\">Making a Difference<\/span>\r\n                <h2 class=\"section-title\">Our <span>Projects<\/span><\/h2>\r\n                <p class=\"section-description\">Discover the impactful projects and initiatives undertaken by Africa Ihsan Aid Foundation to transform lives across Africa<\/p>\r\n            <\/div>\r\n            \r\n            <!-- Category Filters -->\r\n            <div class=\"category-filters\">\r\n                <button class=\"filter-btn active\" data-category=\"all\">All Projects<\/button>\r\n                <button class=\"filter-btn\" data-category=\"relief\">Relief Projects<\/button>\r\n                <button class=\"filter-btn\" data-category=\"development\">Development Projects<\/button>\r\n                <button class=\"filter-btn\" data-category=\"health\">Health Projects<\/button>\r\n                <button class=\"filter-btn\" data-category=\"education\">Education Projects<\/button>\r\n            <\/div>\r\n            \r\n            <!-- Projects Grid -->\r\n            <div class=\"projects-grid\" id=\"projectsContainer\">\r\n                <!-- Projects will be loaded here dynamically -->\r\n                <div class=\"no-projects\">Loading projects...<\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <script>\r\n        document.addEventListener('DOMContentLoaded', function() {\r\n            const projectsContainer = document.getElementById('projectsContainer');\r\n            const filterBtns = document.querySelectorAll('.filter-btn');\r\n            \r\n            \/\/ All projects data with your specified images and project names\r\n            const allProjects = [\r\n                {\r\n                    id: 1,\r\n                    title: \"Qurban\",\r\n                    excerpt: \"Providing fresh meat to impoverished families during Eid al-Adha through Qurban sacrifices, ensuring everyone can celebrate this important Islamic occasion.\",\r\n                    image: \"https:\/\/africaihsanaid.org\/wp-content\/uploads\/2026\/01\/Africa-photos-1-scaled.jpg\",\r\n                    category: \"relief\",\r\n                    link: \"https:\/\/africaihsanaid.org\/index.php\/2026\/01\/11\/qurban-project\/\"\r\n                },\r\n                {\r\n                    id: 2,\r\n                    title: \"Orphan Sponsorship\",\r\n                    excerpt: \"Supporting orphaned children through education, healthcare, and basic needs provision, giving them hope for a brighter future.\",\r\n                    image: \"https:\/\/africaihsanaid.org\/wp-content\/uploads\/2026\/01\/Orphan-Project-4-scaled.jpg\",\r\n                    category: \"development\",\r\n                    link: \"https:\/\/africaihsanaid.org\/index.php\/2026\/01\/11\/orphan-sponsorship\/\"\r\n                },\r\n                {\r\n                    id: 3,\r\n                    title: \"Milk Goat Distribution\",\r\n                    excerpt: \"Empowering families with sustainable livelihoods by providing milk goats that offer nutrition and income through milk production.\",\r\n                    image: \"https:\/\/africaihsanaid.org\/wp-content\/uploads\/2026\/01\/Africa-Aid-4.jpeg\",\r\n                    category: \"development\",\r\n                    link: \"https:\/\/africaihsanaid.org\/index.php\/2026\/01\/11\/milk-goat-distribution-project\/\"\r\n                },\r\n                {\r\n                    id: 4,\r\n                    title: \"Water Well Construction\",\r\n                    excerpt: \"Building clean water wells in drought-affected communities to provide access to safe drinking water and improve public health.\",\r\n                    image: \"https:\/\/africaihsanaid.org\/wp-content\/uploads\/2026\/01\/WATER-WELL-16-scaled.jpg\",\r\n                    category: \"development\",\r\n                    link: \"https:\/\/africaihsanaid.org\/index.php\/2026\/01\/11\/water-well-construction\/\"\r\n                },\r\n                {\r\n                    id: 5,\r\n                    title: \"Cataract Treatment and Surgery\",\r\n                    excerpt: \"Restoring vision to those suffering from cataracts through free medical camps, screenings, and surgical interventions.\",\r\n                    image: \"https:\/\/africaihsanaid.org\/wp-content\/uploads\/2026\/01\/Cataract-Treatment-and-Surgery-3-scaled.jpg\",\r\n                    category: \"health\",\r\n                    link: \"https:\/\/africaihsanaid.org\/index.php\/2026\/01\/11\/cataract-treatment-and-surgery\/\"\r\n                },\r\n                {\r\n                    id: 6,\r\n                    title: \"Food Aid and Distribution\",\r\n                    excerpt: \"Providing essential food packages to vulnerable families facing food insecurity due to drought, conflict, or poverty.\",\r\n                    image: \"https:\/\/africaihsanaid.org\/wp-content\/uploads\/2026\/01\/Food-Aid-6-scaled.jpg\",\r\n                    category: \"relief\",\r\n                    link: \"https:\/\/africaihsanaid.org\/index.php\/2026\/01\/11\/food-aid-and-distribution\/\"\r\n                },\r\n                {\r\n                    id: 7,\r\n                    title: \"Ramadan Iftar\",\r\n                    excerpt: \"Organizing community iftar meals during Ramadan, ensuring fasting Muslims break their fast with nutritious meals in a communal setting.\",\r\n                    image: \"https:\/\/africaihsanaid.org\/wp-content\/uploads\/2026\/01\/Africa-Aid-18.jpeg\",\r\n                    category: \"relief\",\r\n                    link: \"https:\/\/africaihsanaid.org\/index.php\/2026\/01\/11\/ramadan-iftar\/\"\r\n                },\r\n                {\r\n                    id: 8,\r\n                    title: \"Stationary\",\r\n                    excerpt: \"Distributing school supplies, stationery, and educational materials to underprivileged students to support their academic journey.\",\r\n                    image: \"https:\/\/africaihsanaid.org\/wp-content\/uploads\/2026\/01\/KIRTASIYE-DAGITIMI-5-scaled.jpg\",\r\n                    category: \"education\",\r\n                    link: \"https:\/\/africaihsanaid.org\/index.php\/2026\/01\/11\/kirtasiye-dagitimi-project\/\"\r\n                }\r\n            ];\r\n            \r\n            \/\/ Initialize the projects display - show all projects by default\r\n            displayProjects(allProjects);\r\n            \r\n            \/\/ Category filter functionality\r\n            filterBtns.forEach(btn => {\r\n                btn.addEventListener('click', function() {\r\n                    \/\/ Update active button\r\n                    filterBtns.forEach(b => b.classList.remove('active'));\r\n                    this.classList.add('active');\r\n                    \r\n                    \/\/ Filter projects based on selected category\r\n                    const category = this.dataset.category;\r\n                    let filteredProjects;\r\n                    \r\n                    if (category === 'all') {\r\n                        filteredProjects = allProjects;\r\n                    } else {\r\n                        filteredProjects = allProjects.filter(project => project.category === category);\r\n                    }\r\n                    \r\n                    \/\/ Display filtered projects\r\n                    displayProjects(filteredProjects);\r\n                });\r\n            });\r\n            \r\n            \/\/ Function to display projects\r\n            function displayProjects(projects) {\r\n                if (projects.length === 0) {\r\n                    projectsContainer.innerHTML = '<div class=\"no-projects\">No projects found in this category.<\/div>';\r\n                    return;\r\n                }\r\n                \r\n                \/\/ Clear the container\r\n                projectsContainer.innerHTML = '';\r\n                \r\n                \/\/ Create and append project elements\r\n                projects.forEach(project => {\r\n                    const projectElement = createProjectElement(project);\r\n                    projectsContainer.appendChild(projectElement);\r\n                });\r\n            }\r\n            \r\n            \/\/ Function to create project HTML element\r\n            function createProjectElement(project) {\r\n                const projectElement = document.createElement('div');\r\n                projectElement.className = 'project-card';\r\n                projectElement.innerHTML = `\r\n                    <img decoding=\"async\" src=\"${project.image}\" alt=\"${project.title}\" class=\"project-image\">\r\n                    <div class=\"project-content\">\r\n                        <span class=\"project-category\">${project.category}<\/span>\r\n                        <h3 class=\"project-title\">${project.title}<\/h3>\r\n                        <p class=\"project-excerpt\">${project.excerpt}<\/p>\r\n                        <div class=\"project-meta\">\r\n                            <a href=\"${project.link}\" class=\"read-more\">Read More \u2192<\/a>\r\n                        <\/div>\r\n                    <\/div>\r\n                `;\r\n                return projectElement;\r\n            }\r\n        });\r\n    <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n    <div class=\"xs_social_share_widget xs_share_url after_content \t\tmain_content  wslu-style-1 wslu-share-box-shaped wslu-fill-colored wslu-none wslu-share-horizontal wslu-theme-font-no wslu-main_content\">\n\n\t\t\n        <ul>\n\t\t\t        <\/ul>\n    <\/div> \n","protected":false},"excerpt":{"rendered":"<p>Our Projects &#8211; Africa Ihsan Aid Foundation Making a Difference Our Projects Discover the impactful projects and initiatives undertaken by Africa Ihsan Aid Foundation to transform lives across Africa All Projects Relief Projects Development Projects Health Projects Education Projects Loading projects&#8230;<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"postBodyCss":"","postBodyMargin":[],"postBodyPadding":[],"postBodyBackground":{"backgroundType":"classic","gradient":""},"footnotes":""},"class_list":["post-367","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/africaihsanaid.org\/index.php\/wp-json\/wp\/v2\/pages\/367","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/africaihsanaid.org\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/africaihsanaid.org\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/africaihsanaid.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/africaihsanaid.org\/index.php\/wp-json\/wp\/v2\/comments?post=367"}],"version-history":[{"count":13,"href":"https:\/\/africaihsanaid.org\/index.php\/wp-json\/wp\/v2\/pages\/367\/revisions"}],"predecessor-version":[{"id":413,"href":"https:\/\/africaihsanaid.org\/index.php\/wp-json\/wp\/v2\/pages\/367\/revisions\/413"}],"wp:attachment":[{"href":"https:\/\/africaihsanaid.org\/index.php\/wp-json\/wp\/v2\/media?parent=367"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}