# @maiertech/gatsby-theme-pages-core > This theme adds a Page type to Gatsby sites. Latest version **0.8.0** (published 2021-03-29) · MIT license · 0 weekly downloads > **Deprecated.** This package is deprecated. ## Install ```sh npm install @maiertech/gatsby-theme-pages-core pnpm add @maiertech/gatsby-theme-pages-core yarn add @maiertech/gatsby-theme-pages-core bun add @maiertech/gatsby-theme-pages-core ``` ## Health **Score 10/100 (F)** — status: deprecated. Negative: deprecated. ## Facts | | | |---|---| | Version | 0.8.0 | | Published | 2021-03-29 | | First published | 2020-10-28 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 8 | | Unpacked size | 19 KB | | Known vulnerabilities | 0 (+1 in 1 direct dependencies) | | Install scripts | no | | GitHub stars | 0 | | Author | Thilo Maier | | Maintainers | maiertech | | Keywords | gatsby, gatsby-plugin, gatsby-theme | ## Links - npm: https://www.npmjs.com/package/@maiertech/gatsby-theme-pages-core - Repository: https://github.com/maiertech/gatsby-themes - Homepage: https://github.com/maiertech/gatsby-themes#readme - Issues: https://github.com/maiertech/gatsby-themes/issues - npm.io page: https://npm.io/package/@maiertech/gatsby-theme-pages-core ## Dependencies (8) - [prop-types](https://npm.io/package/prop-types.md) ^15.7.2 - [@mdx-js/mdx](https://npm.io/package/@mdx-js/mdx.md) ^1.6.22 - [@mdx-js/react](https://npm.io/package/@mdx-js/react.md) ^1.6.22 - [gatsby-plugin-mdx](https://npm.io/package/gatsby-plugin-mdx.md) ^2.1.0 - [gatsby-plugin-sharp](https://npm.io/package/gatsby-plugin-sharp.md) ^3.1.2 - [gatsby-source-filesystem](https://npm.io/package/gatsby-source-filesystem.md) ^3.1.0 - [gatsby-transformer-sharp](https://npm.io/package/gatsby-transformer-sharp.md) ^3.1.0 - [@maiertech/gatsby-helpers](https://npm.io/package/@maiertech/gatsby-helpers.md) ^0.5.0 ## Recent versions - 0.8.0 (latest) — 2021-03-29 - 0.7.2 — 2021-03-24 - 0.7.1 — 2021-03-23 - 0.7.0 — 2021-03-21 - 0.6.0 — 2021-03-03 - 0.5.0 — 2021-02-16 - 0.4.0 — 2021-01-10 - 0.3.0 — 2020-12-27 - 0.2.0 — 2020-12-14 - 0.1.2 — 2020-12-10 - 0.1.1 — 2020-11-10 - 0.1.0 — 2020-10-28 ## README # @maiertech/gatsby-theme-pages-core A [Gatsby theme](https://www.gatsbyjs.com/docs/themes/what-are-gatsby-themes/) to add a `Page` type to Gatsby sites. ## Options | Option | Default | Description | | :----------------------- | :-------------- | :------------------------------------------------------------------------------------------------------------------------------------- | | `basePath` | `/` | Basepath for deployments at locations other than root. | | `contentPath` | `content/pages` | Location of MDX files with pages. If pages use images, pages can be placed in a sub-directory as `index.mdx` together with its assets. | | `fullRelativePath` | `false` | Set to `true` to include full path relative to `contentPath` in path of generated pages. | | `mdxOtherwiseConfigured` | `false` | Set this flag true if `gatsby-plugin-mdx` is already configured for your site. | ## Frontmatter | Key | Required | Description | | :------------ | :------- | :------------------------------------------------------------------------------------------------------------------------------- | | title | ✓ | Post title, which will be slugified. | | slug | | Override slugified title. | | description | ✓ | Description for SEO and previews. | | images | | Array of images with `src` (relative path to image), optional `title` and mandatory `alt` text. Images can be embedded into MDX. | | canonical_url | | Canonical URL for SEO. | ## Schema customization ### `Page` interface | Field | Type | Description | | :----------- | :------------- | :--------------------------------------- | | id | `ID!` | Gatsby node GUID. | | title | `String!` | From frontmatter. | | description | `String!` | From frontmatter. | | images | `[PageImage!]` | Images that can be embedded into a page. | | body | `String!` | MDX body. | | path | `String!` | Page path. | | canonicalUrl | `String` | Canonical URL for SEO. | Type `MdxPage` implements `Page`. If you prefer to use a data source other than MDX files, you can write a child theme that uses the `Page` interface. ### `PageImage` type | Field | Type | Description | | :---- | :------ | ----------------------- | | src | File! | Relative path to image. | | title | String | Image title. | | alt | String! | Image alt text. | ## Images in pages This theme assumes that you will use [`gatsby-plugin-image`](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-image) to render images in MDX files. Since [`StaticImage`](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-image#static-images) [does not work inside MDX files](https://github.com/gatsbyjs/gatsby/discussions/27950#discussioncomment-364659), you have to declare images in the frontmatter with the `images` prop. When you shadow [`page.js`](https://github.com/maiertech/gatsby-themes/blob/master/packages/gatsby-theme-pages-core/src/page.js), you need to create an images array with [`gatsbyImageData`](https://www.gatsbyjs.com/docs/reference/built-in-components/gatsby-plugin-image/#image-options) objects and provide the images array as prop to `MDXRenderer`. You can then access and render these images with [`GatsbyImage`](https://github.com/gatsbyjs/gatsby/tree/master/packages/gatsby-plugin-image#dynamic-images) inside MDX files. This is not ideal and it is intended as workaround until `StaticImage` can be used inside MDX files. The downside of dynamic images is that fragment [`page-fragment.js`](https://github.com/maiertech/gatsby-themes/blob/master/packages/gatsby-theme-pages-core/src/page-fragment.js) contains a hard-wired query for dynamic images as [constrained images](https://www.gatsbyjs.com/docs/reference/built-in-components/gatsby-plugin-image/#layout). Therefore, you cannot modify [image options](https://www.gatsbyjs.com/docs/reference/built-in-components/gatsby-plugin-image/#image-options) and have to go with what the fragment gives you. --- _Source: https://npm.io/package/@maiertech/gatsby-theme-pages-core · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._