@arshad/gatsby-theme-page-core

A Gatsby theme that adds MDX page support.

Usage no npm install needed!

<script type="module">
  import arshadGatsbyThemePageCore from 'https://cdn.skypack.dev/@arshad/gatsby-theme-page-core';
</script>

README

@arshad/gatsby-theme-page-core

Version License PRs welcome!

This core theme includes a Page type that you can use to build MDX pages. It includes no styles.

Installation

Step 1: In the root of your Gatsby site, run the following command:

yarn add @arshad/gatsby-theme-page-core

Step 2: Enable it in gatsby-config.js

// gatsby-config.js
...
  plugins: [
    `@arshad/gatsby-theme-page-core`
  ]
...

Theme options

Key Default value Description
contentPath content/pages Location of your pages

Example usage

// gatsby-config.js
...
  plugins: [
    {
      resolve: `@arshad/gatsby-theme-page-core`,
      options: {
        contentPath: `content/pages`,
      }
    }
  ]
...

Data models

Post

type Page implements Node @dontInfer {
  id: ID!
  title: String!
  excerpt: String
  slug: String!
  body: String!
  is_front: Boolean!
}

Example

Place your pages inside content/pages as follows:

site
  ├── content
  │   └── pages
  │       └── about-us
  │           ├── image.jpg
  │           └── index.mdx
  ├── node_modules
  ├── gatsby-config.js
  └── package.json
# site/content/pages/about-us/index.mdx

---

title: About Us
excerpt: Temporibus tenetur eveniet ipsa. Enim eum consequatur magnam.

---

![Picture](image.jpg)

Quos totam nihil saepe ipsam incidunt. Quo ipsam soluta sapiente.

Customization

Create the following components in your site to shadow and customize the core components:

src
└── @arshad
    └── gatsby-theme-page-core
        └── components
            └── page.js

To learn more about component shadowing, check out the official theme docs.

Support

Create an issue on the main repo @arshad/gatsby-themes.