diff --git a/components/entry-header.js b/components/EntryHeader.js
similarity index 100%
rename from components/entry-header.js
rename to components/EntryHeader.js
diff --git a/components/featured-image.js b/components/FeaturedImage.js
similarity index 100%
rename from components/featured-image.js
rename to components/FeaturedImage.js
diff --git a/components/Footer.js b/components/Footer.js
new file mode 100644
index 0000000..cc2c99c
--- /dev/null
+++ b/components/Footer.js
@@ -0,0 +1,15 @@
+import styles from "../styles/footer.module.css";
+
+export default function Footer() {
+  return (
+    <footer className={styles.footer}>
+      Powered by{" "}
+      <a href="https://wpengine.com" target="_blank" rel="noopener noreferrer">
+        WP Engine
+      </a>
+      <span>
+        &copy; {new Date().getFullYear()}
+      </span>
+    </footer>
+  );
+}
diff --git a/components/Header.js b/components/Header.js
new file mode 100644
index 0000000..d637c8d
--- /dev/null
+++ b/components/Header.js
@@ -0,0 +1,52 @@
+import { gql } from "@apollo/client";
+import Link from "next/link";
+import style from "../styles/header.module.css";
+
+export default function Header({ siteTitle, siteDescription, menuItems }) {
+  return (
+    <header className={style.header}>
+      <div className={`container ${style.container}`}>
+        <Link href="/" className={style.brand}>
+          <h2 className={style.siteTitle}>{siteTitle}</h2>
+          <p className={style.siteDescription}>{siteDescription}</p>
+        </Link>
+
+        <nav className={style.nav}>
+          <ul>
+            {(Array.isArray(menuItems) ? menuItems : []).map((item) => (
+              <li key={item.id}>
+                <Link href={item.uri}>{item.label}</Link>
+              </li>
+            ))}
+          </ul>
+        </nav>
+      </div>
+    </header>
+  );
+}
+
+Header.fragments = {
+  entry: gql`
+    fragment HeaderFragment on RootQuery {
+      generalSettings {
+        title
+        description
+      }
+      primaryMenuItems: menuItems(where: { location: PRIMARY }) {
+        nodes {
+          id
+          uri
+          path
+          label
+          parentId
+          cssClasses
+          menu {
+            node {
+              name
+            }
+          }
+        }
+      }
+    }
+  `,
+};
diff --git a/components/post-list-item.js b/components/PostListItem.js
similarity index 95%
rename from components/post-list-item.js
rename to components/PostListItem.js
index 663a25e..b04d564 100644
--- a/components/post-list-item.js
+++ b/components/PostListItem.js
@@ -1,5 +1,5 @@
 import Link from "next/link";
-import { FeaturedImage } from "./featured-image";
+import { FeaturedImage } from "./FeaturedImage";
 import styles from "../styles/post-list-item.module.css";
 
 export default function PostListItem({ post }) {
diff --git a/pages/example.js b/pages/example.js
index b1c3866..e6d4e4d 100644
--- a/pages/example.js
+++ b/pages/example.js
@@ -1,8 +1,8 @@
 import { gql, useQuery } from "@apollo/client";
 import Head from "next/head";
-import Header from "../components/header";
-import EntryHeader from "../components/entry-header";
-import Footer from "../components/footer";
+import Header from "../components/Header";
+import EntryHeader from "../components/EntryHeader";
+import Footer from "../components/Footer";
 import { getNextStaticProps } from "@faustwp/core";
 
 /**
diff --git a/wp-templates/archive.js b/wp-templates/archive.js
index a6a3c4e..31885e1 100644
--- a/wp-templates/archive.js
+++ b/wp-templates/archive.js
@@ -1,12 +1,12 @@
 import { gql, useQuery } from "@apollo/client";
 import Head from "next/head";
-import Header from "../components/header";
-import EntryHeader from "../components/entry-header";
-import Footer from "../components/footer";
+import Header from "../components/Header";
+import EntryHeader from "../components/EntryHeader";
+import Footer from "../components/Footer";
 import { SITE_DATA_QUERY } from "../queries/SiteSettingsQuery";
 import { HEADER_MENU_QUERY } from "../queries/MenuQueries";
 import { POST_LIST_FRAGMENT } from "../fragments/PostListFragment";
-import PostListItem from "../components/post-list-item";
+import PostListItem from "../components/PostListItem";
 import { getNextStaticProps } from "@faustwp/core";
 import { useState } from "react";
 import styles from "../styles/archive.module.css";
diff --git a/wp-templates/front-page.js b/wp-templates/front-page.js
index c1850fd..b071ce6 100644
--- a/wp-templates/front-page.js
+++ b/wp-templates/front-page.js
@@ -1,8 +1,8 @@
 import Head from "next/head";
 import Link from "next/link";
-import Header from "../components/header";
-import EntryHeader from "../components/entry-header";
-import Footer from "../components/footer";
+import Header from "../components/Header";
+import EntryHeader from "../components/EntryHeader";
+import Footer from "../components/Footer";
 import style from "../styles/front-page.module.css";
 import { SITE_DATA_QUERY } from "../queries/SiteSettingsQuery";
 import { HEADER_MENU_QUERY } from "../queries/MenuQueries";
diff --git a/wp-templates/page.js b/wp-templates/page.js
index f3ef878..f6cd8d1 100644
--- a/wp-templates/page.js
+++ b/wp-templates/page.js
@@ -1,8 +1,8 @@
 import { gql, useQuery } from "@apollo/client";
 import Head from "next/head";
-import EntryHeader from "../components/entry-header";
-import Footer from "../components/footer";
-import Header from "../components/header";
+import EntryHeader from "../components/EntryHeader";
+import Footer from "../components/Footer";
+import Header from "../components/Header";
 import { SITE_DATA_QUERY } from "../queries/SiteSettingsQuery";
 import { HEADER_MENU_QUERY } from "../queries/MenuQueries";
 import { getNextStaticProps } from "@faustwp/core";
diff --git a/wp-templates/single.js b/wp-templates/single.js
index 6d39a4d..205462f 100644
--- a/wp-templates/single.js
+++ b/wp-templates/single.js
@@ -1,8 +1,8 @@
 import { gql } from "@apollo/client";
 import Head from "next/head";
-import EntryHeader from "../components/entry-header";
-import Footer from "../components/footer";
-import Header from "../components/header";
+import EntryHeader from "../components/EntryHeader";
+import Footer from "../components/Footer";
+import Header from "../components/Header";
 import { SITE_DATA_QUERY } from "../queries/SiteSettingsQuery";
 import { HEADER_MENU_QUERY } from "../queries/MenuQueries";
 import { useFaustQuery } from "@faustwp/core";