Building Categories with Prismic?

Question

I have an existing Gatsby/Prismic blog. I'm trying now to organize my content by using categories. Does anyone knows a good tutorial? Theres literally just 1 Documentation that Ive found and its not really helping. Does anyone knows the steps to create and display Categories using Gatsby and Prismic?

Make a Custom Type called `category`. Create some categories. Link to it in your post type with a `content relationship` field. — ksav, Sep 17 '19 at 09:34

score 1 · Answer 1 · answered Jan 23 '20 at 23:11

In "Prismic" add a new "Content Type" that is of "Repeatable Type" called "category".
To build the category structure you can use "Build Mode" or "JSON editor" on the right side. If you choose "JSON editor" paste in .

{
  "Main" : {
    "name" : {
      "type" : "Text",
      "config" : {
        "label" : "name",
        "placeholder" : "Name of the category"
      }
    }
  }
}

...and save.

Now add new categories like you do new blog posts. Click new content and then "category" and input a category name ex: events then press "save" and "publish".
Now edit your blog post content base. If you click on the JSON editor add to the Meta

{
  "Main" : {
 //Here is your code for the blog post add the Meta below
  "Meta" : {
    "categories" : {
      "type" : "Group",
      "config" : {
        "fields" : {
          "category" : {
            "type" : "Link",
            "config" : {
              "select" : "document",
              "customtypes" : [ "category" ],
              "label" : "category",
              "placeholder" : "Category"
            }
          }
        },
        "label" : "Categories"
      }
    }
  }
}

Click on your old blog posts that you want to add the category too. There should now be a Meta tag next to the Main. When you click it you will see that there is a category field which when clicked list the category fields you made. Select one.
Now you can filter your blog posts by categories. How you do this is up to you, perhaps a query to get all the the category names which you put into a drop down? A good example is this Gatsby Starter https://github.com/LekoArts/gatsby-starter-prismic-i18n

Building Categories with Prismic?

1 Answers1