diff --git a/apps/codeforafrica/public/images/cms/blocks/partners.png b/apps/codeforafrica/public/images/cms/blocks/partners.png
new file mode 100644
index 000000000..7f87ee37e
Binary files /dev/null and b/apps/codeforafrica/public/images/cms/blocks/partners.png differ
diff --git a/apps/codeforafrica/src/components/ConnectBar/ConnectBar.js b/apps/codeforafrica/src/components/ConnectBar/ConnectBar.js
index 988437a4c..8eee2dded 100644
--- a/apps/codeforafrica/src/components/ConnectBar/ConnectBar.js
+++ b/apps/codeforafrica/src/components/ConnectBar/ConnectBar.js
@@ -6,18 +6,14 @@ import SocialMediaButton from "@/codeforafrica/components/SocialMediaButton";
 const ConnectBar = React.forwardRef(function ConnectBar(props, ref) {
   const { sx, title, links } = props;
 
-  if (!links || !Object.entries(links)?.length) {
+  if (!links?.length) {
     return null;
   }
 
-  const socialConnections = [
-    "twitter",
-    "slack",
-    "linkedin",
-    "facebook",
-    "instagram",
-    "github",
-  ].flatMap((name) => (links[name] ? [{ name, url: links[name] }] : []));
+  const socialConnections = links.map(({ platform, url }) => ({
+    name: platform?.toLowerCase(),
+    url,
+  }));
 
   return (
     <SocialMediaBar
diff --git a/apps/codeforafrica/src/components/ConnectBar/ConnectBar.snap.js b/apps/codeforafrica/src/components/ConnectBar/ConnectBar.snap.js
index 6f31c7ef2..46da7d44d 100644
--- a/apps/codeforafrica/src/components/ConnectBar/ConnectBar.snap.js
+++ b/apps/codeforafrica/src/components/ConnectBar/ConnectBar.snap.js
@@ -1,29 +1,3 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<ConnectBar /> renders unchanged 1`] = `
-<div>
-  <div
-    class="MuiStack-root css-150zc89-MuiStack-root"
-  >
-    <div
-      class="MuiStack-root css-1mbd5au-MuiStack-root"
-    >
-      <a
-        aria-label="facebook"
-        class="MuiTypography-root MuiTypography-inherit MuiLink-root MuiLink-underlineAlways MuiBox-root active css-tmo8yp-MuiTypography-root-MuiLink-root"
-        data-mui-internal-clone-element="true"
-        href="https://www.facebook.com/"
-        rel="noreferrer noopener"
-        target="_blank"
-      >
-        <div
-          aria-hidden="true"
-          class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-1dz6c5u-MuiSvgIcon-root"
-          focusable="false"
-          viewbox="0 0 24 24"
-        />
-      </a>
-    </div>
-  </div>
-</div>
-`;
+exports[`<ConnectBar /> renders unchanged 1`] = `<div />`;
diff --git a/apps/codeforafrica/src/components/Partner/Partner.js b/apps/codeforafrica/src/components/Partner/Partner.js
new file mode 100644
index 000000000..8e479d56d
--- /dev/null
+++ b/apps/codeforafrica/src/components/Partner/Partner.js
@@ -0,0 +1,89 @@
+import { Section } from "@commons-ui/core";
+import { Box } from "@mui/material";
+import React from "react";
+
+import AboutChildPageHeader from "@/codeforafrica/components/AboutChildPageHeader";
+import ConnectBar from "@/codeforafrica/components/ConnectBar";
+import RelatedProjects from "@/codeforafrica/components/RelatedProjects";
+import RichText from "@/codeforafrica/components/RichText";
+import SectionDivider from "@/codeforafrica/components/SectionDivider";
+
+const Partner = React.forwardRef(function Partner(
+  { description, connect, relatedProjects, relatedProjectsTitle, name, logo },
+  ref,
+) {
+  return (
+    <Box ref={ref} sx={{ pb: { xs: 10, md: 7 } }}>
+      <AboutChildPageHeader
+        name={name}
+        image={logo}
+        FigureProps={{
+          sx: {
+            backgroundPositionY: "center",
+            backgroundRepeat: "no-repeat",
+            backgroundSize: "contain",
+            bgcolor: "background.default",
+            borderRadius: 0,
+            filter: "drop-shadow(0px 8.7px 17.4px rgba(0, 0, 0, 0.1))",
+            height: { xs: 116 },
+            width: { xs: 247 },
+          },
+        }}
+      />
+      <Section
+        sx={{
+          px: { xs: 2.5, sm: 0 },
+          pt: { xs: 2.5, md: 7 },
+          maxWidth: {
+            sm: "648px",
+            md: "912px",
+          },
+        }}
+      >
+        <RichText
+          variant="subheading"
+          component="p"
+          sx={{
+            mb: 5,
+            typography: "subheading",
+            "& > p": {
+              mb: 5,
+            },
+          }}
+          elements={description}
+        />
+
+        <ConnectBar title="Connect" links={connect} />
+      </Section>
+      {relatedProjects?.length ? (
+        <>
+          <SectionDivider
+            sx={{
+              maxWidth: {
+                sm: "648px",
+                md: "912px",
+              },
+              px: { xs: 2.5, sm: 0 },
+              py: { xs: "30px", md: 5 },
+            }}
+          />
+          <RelatedProjects
+            sx={{
+              maxWidth: {
+                sm: "648px",
+                md: "912px",
+              },
+              pt: 0,
+            }}
+            tileListProps={{ fixed: true }}
+            titleProps={{ sx: { mb: { xs: "30px", md: 5 } } }}
+            title={relatedProjectsTitle}
+            projects={relatedProjects}
+          />
+        </>
+      ) : null}
+    </Box>
+  );
+});
+
+export default Partner;
diff --git a/apps/codeforafrica/src/components/Partner/Partner.snap.js b/apps/codeforafrica/src/components/Partner/Partner.snap.js
new file mode 100644
index 000000000..86026b06a
--- /dev/null
+++ b/apps/codeforafrica/src/components/Partner/Partner.snap.js
@@ -0,0 +1,21 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<Partners /> renders unchanged 1`] = `
+<div>
+  <div
+    class="MuiBox-root css-1gghq2r"
+  >
+    <div
+      class="MuiContainer-root MuiContainer-maxWidthLg MuiContainer-fixed MuiContainer-disableGutters css-1ilq66o-MuiContainer-root"
+    >
+      <div
+        class="MuiBox-root css-15sqwg8"
+      >
+        Lorem ipsum dolor sit amet consectetur adipiscing, elit ac primis praesent
+        tempor luctus libero, curae condimentum ultricies proin leo. Arcu ornare dis fermentum nisi consequat imperdiet porta viverra placerat nullam, dapibus molestie faucibus id mi lacinia orci magnis. Ridiculus aptent phasellus mus nisi porta rutrum tellus, ut venenatis feugiat massa volutpat. 
+        Duis maecenas per erat odio quisque accumsan, donec tempus class euismod vulputate fermentum imperdiet, suspendisse blandit lacinia semper cursus. Neque tristique posuere a feugiat convallis tempor cras nunc, leo faucibus cum aptent placerat aenean lobortis, nibh iaculis ac nascetur praesent mus quisque. Nullam leo rutrum augue urna cubilia morbi enim, arcu risus mus mauris elementum pulvinar, laoreet bibendum convallis senectus ullamcorper malesuada.
+      </div>
+    </div>
+  </div>
+</div>
+`;
diff --git a/apps/codeforafrica/src/components/Partner/Partner.test.js b/apps/codeforafrica/src/components/Partner/Partner.test.js
new file mode 100644
index 000000000..fec4ef031
--- /dev/null
+++ b/apps/codeforafrica/src/components/Partner/Partner.test.js
@@ -0,0 +1,30 @@
+import { createRender } from "@commons-ui/testing-library";
+import React from "react";
+
+import Partner from "./Partner";
+
+import theme from "@/codeforafrica/theme";
+
+// eslint-disable-next-line testing-library/render-result-naming-convention
+const render = createRender({ theme });
+
+const defaultProps = {
+  description: [
+    {
+      text: "Lorem ipsum dolor sit amet consectetur adipiscing, elit ac primis praesent",
+    },
+    {
+      text: "tempor luctus libero, curae condimentum ultricies proin leo. Arcu ornare dis fermentum nisi consequat imperdiet porta viverra placerat nullam, dapibus molestie faucibus id mi lacinia orci magnis. Ridiculus aptent phasellus mus nisi porta rutrum tellus, ut venenatis feugiat massa volutpat. ",
+    },
+    {
+      text: "Duis maecenas per erat odio quisque accumsan, donec tempus class euismod vulputate fermentum imperdiet, suspendisse blandit lacinia semper cursus. Neque tristique posuere a feugiat convallis tempor cras nunc, leo faucibus cum aptent placerat aenean lobortis, nibh iaculis ac nascetur praesent mus quisque. Nullam leo rutrum augue urna cubilia morbi enim, arcu risus mus mauris elementum pulvinar, laoreet bibendum convallis senectus ullamcorper malesuada.",
+    },
+  ],
+};
+
+describe("<Partners />", () => {
+  it("renders unchanged", () => {
+    const { container } = render(<Partner {...defaultProps} />);
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/apps/codeforafrica/src/components/Partner/index.js b/apps/codeforafrica/src/components/Partner/index.js
new file mode 100644
index 000000000..e10539fb2
--- /dev/null
+++ b/apps/codeforafrica/src/components/Partner/index.js
@@ -0,0 +1,3 @@
+import Partner from "./Partner";
+
+export default Partner;
diff --git a/apps/codeforafrica/src/lib/data/common/index.js b/apps/codeforafrica/src/lib/data/common/index.js
index 67af24ffa..25ca31b5e 100644
--- a/apps/codeforafrica/src/lib/data/common/index.js
+++ b/apps/codeforafrica/src/lib/data/common/index.js
@@ -1,4 +1,5 @@
 import blockify from "@/codeforafrica/lib/data/blockify";
+import pagify from "@/codeforafrica/lib/data/pagify";
 import { imageFromMedia } from "@/codeforafrica/lib/data/utils";
 
 function getNavBar(settings) {
@@ -45,18 +46,21 @@ function getPageSlug({ params }) {
 }
 
 export async function getPageProps(api, context) {
+  const { params } = context;
   const slug = getPageSlug(context);
-  const {
+  let {
     docs: [page],
   } = await api.findPage(slug);
   if (!page) {
     return null;
   }
-
+  if (params?.slugs?.length > 2) {
+    page = await pagify(page, api, context);
+  }
+  const blocks = await blockify(page?.blocks);
   const settings = await api.findGlobal("settings");
   const navbar = getNavBar(settings);
   const footer = getFooter(settings);
-  const blocks = await blockify(page.blocks);
 
   return {
     blocks,
diff --git a/apps/codeforafrica/src/lib/data/pagify/index.js b/apps/codeforafrica/src/lib/data/pagify/index.js
new file mode 100644
index 000000000..62f8f69dd
--- /dev/null
+++ b/apps/codeforafrica/src/lib/data/pagify/index.js
@@ -0,0 +1,13 @@
+import partners from "./partners";
+
+const COLLECTION_BY_SLUG = {
+  partners,
+};
+
+async function pagify(parentPage, api, context) {
+  const { slug: collection } = parentPage;
+  const pageProps = COLLECTION_BY_SLUG[collection];
+  return pageProps?.(api, context) ?? null;
+}
+
+export default pagify;
diff --git a/apps/codeforafrica/src/lib/data/pagify/partners.js b/apps/codeforafrica/src/lib/data/pagify/partners.js
new file mode 100644
index 000000000..9e6797b75
--- /dev/null
+++ b/apps/codeforafrica/src/lib/data/pagify/partners.js
@@ -0,0 +1,30 @@
+import { imageFromMedia } from "@/codeforafrica/lib/data/utils";
+
+async function partners(api, context) {
+  const { params, locale } = context;
+  const slug = params.slugs[2];
+  const { docs } = await api.getCollection("partners", {
+    locale,
+    where: {
+      slug: {
+        equals: slug,
+      },
+    },
+  });
+  if (!docs?.length) {
+    return null;
+  }
+  const [partner] = docs;
+  return {
+    blocks: [
+      {
+        relatedProjects: [], // TODO(koechkevin) Related projects go here once projects implemented
+        ...partner,
+        logo: imageFromMedia(partner.logo),
+        blockType: "partner",
+      },
+    ],
+  };
+}
+
+export default partners;
diff --git a/apps/codeforafrica/src/pages/[...slugs].page.js b/apps/codeforafrica/src/pages/[...slugs].page.js
index 4557ba5fa..159e28a63 100644
--- a/apps/codeforafrica/src/pages/[...slugs].page.js
+++ b/apps/codeforafrica/src/pages/[...slugs].page.js
@@ -9,6 +9,7 @@ import MeetOurTeam from "@/codeforafrica/components/MeetOurTeam";
 import NewsAndStories from "@/codeforafrica/components/NewsAndStories";
 import OurPartners from "@/codeforafrica/components/OurPartners";
 import PageHeader from "@/codeforafrica/components/PageHeader";
+import Partner from "@/codeforafrica/components/Partner";
 import { getPageServerSideProps } from "@/codeforafrica/lib/data";
 
 const componentsBySlugs = {
@@ -20,6 +21,7 @@ const componentsBySlugs = {
   "our-impact": GetInvolved,
   "our-partners": OurPartners,
   projects: FeaturedProjects,
+  partner: Partner,
 };
 
 function Index({ blocks, fallback }) {
diff --git a/apps/codeforafrica/src/payload/blocks/OurPartners.js b/apps/codeforafrica/src/payload/blocks/OurPartners.js
index 890dcc41f..8554afd10 100644
--- a/apps/codeforafrica/src/payload/blocks/OurPartners.js
+++ b/apps/codeforafrica/src/payload/blocks/OurPartners.js
@@ -1,5 +1,7 @@
 const Partners = {
   slug: "our-partners",
+  imageURL: "/images/cms/blocks/partners.png",
+  imageAltText: "Our Partners",
   labels: {
     singular: {
       en: "Partners",