ProWrite logoHamburger menu
Get ProWrite
Hamburger menu

Using Contentful CMS

Following are the instructions if you want to use Contentful CMS:

First, set the environment variable CONTENT_SOURCE to remote.

For ProWrite Zero setup or All-in

Following are the instructions to import the Contentful config into your Contentful CMS:

  1. Copy the contentful-config.json file from the /resources folder of the ProWrite repository and place it on your desktop.

  2. Create a Contentful.com account and get the CMA Token, Space ID, and Environment ID.

  3. Run the following command in your terminal to log in via contentful CLI.

    npx contentful-cli login --management-token <CMA-token>

  4. Once logged in, run the following command in your terminal to import the content models and some dummy content in your Contentful CMS:

    • If you are on Linux or Mac:
    npx contentful-cli space import --space-id <space-id> --environment-id <environment-id> --content-file ~/Desktop/contentful-config.json
    • If you are on Windows:
    npx contentful-cli space import --space-id <space-id> --environment-id <environment-id> --content-file C:\Users\<your-username>\Desktop\contentful-config.json

For ProWrite Starter

Following are the instructions to create content types in your Contentful CMS:

  1. Author:

    • name: Short text, required, unique, appearance: 'Single line'.
    • image: Media, required, accept image file only, max size 500KB, appearance: 'Asset card'.
    • title: Short text, required, appearance: 'Single line'.
    • bio: Short text, required, appearance: 'Single line'.
    • expertise: Short text, required, appearance: 'List'.
    • social: JSON Object, required, max 3 items, appearance: 'Object'.

  2. Category:

    • name: Short text, required, unique, appearance: 'Single line'.

  3. Code Block:

    • code: Long text, required, appearance: 'Markdown'.
    • language: Short text, required, appearance: 'Single line'.

  4. Google Ad:

    • slot: Short text, required, appearance: 'Single line'.

  5. Video:

    • url: Short text, required, pattern validation for URLs, appearance: 'URL'.

  6. Affiliate Banner:

    • url: Short text, required, pattern validation for URLs, appearance: 'URL'.
    • banner: Media, required, accept image file only, max size 1MB, appearance: 'Asset card'.

  7. Article:

    • title: Short text, required, unique, appearance: 'Single line'.
    • slug: Short text, required, unique, appearance: 'Slug'.
    • excerpt: Short text, required, appearance: 'Single line'.
    • author: Reference, required, accept author entry type only, appearance: 'Entry link'.
    • category: Reference, required, accept category entry type only, appearance: 'Entry link'.
    • isFeatured: Boolean, required, default value: No, appearance: 'Radio'.
    • readingTime: Short text, required, character limit: 7, appearance: 'Single line'.
    • coverImage: Media, required, accept image file only, max size 1MB, appearance: 'Asset card'.
    • content: Rich text, required, formatting: all but H1, hyperlinks: all but 'Link to asset', embedded entries: all but 'Inline entry', accepted entry type: Affiliate Banner, Code Block, Google Ad, and Video, appearance: 'RichText'.

Custom Entries in Contentful

Following are the instructions to add images, links, and custom entries in your Contentful article body. These are the equivalent of the custom components we use in the MDX.

  • To add a Code Block, an Image, an Affiliate Banner, an Embedded Video, or a Google Ad, click on + Embed -> Entry.
  • An external link should be an absolute URL, e.g., https://www.markdownguide.org/cheat-sheet, and an internal link should be a relative URL, e.g., /add-favicon-in-a-next-js-application.