How would I access a custom post type from a different page?

🙋Get Help
1

So what I’ve done is I’ve created a custom post type using the (CPT) WordPress plugin, and I can’t seem to access it.

Its archive is set to “/reviews”, and it shows up if I access it inside of WordPress. But nothing happens in Frontity I’ve set the custom post type, and it shows up inside of Frontity state too.

This is an excert from my code that returns undefined:

useEffect(() => { state.source.fetch("/reviews"); }, []); console.log(state.source.get("/reviews").items );

And this is what my frontity settings look like:
`
name: “@frontity/wp-source”,

  state: {

    source: {

      url: "http://development.local",

      homepage: "/home-page",

      postsPage: "/posts",

      postTypes: [

      {

        type: "review", // type slug

        endpoint: "reviews", // REST API endpoint

        archive: "/reviews" // link where this custom posts are listed

      }

      ],

    },

`

2

Try adding the fetch in beforeSSR for the specific route you want to get the CPT into

4

Sorry, could you clarify what you mean with SSR and CPT?

Maybe with an example included or something, this is all really confusing to me Lol.

5

Ah. I get Custom Post Type, not sure about SSR though.

6

Hi, you should read here about the frontity lifecycle

SSR = serverside rendering
CSR = clientside rendering

Since you need the content available on your page at the beginning (so search engines can see the static content etc), then you want to gather the data beforeSSR

Don’t have an example to hand but next time I’m at the PC I’ll try find some code.

There should be some examples on the forum if you search beforeSSR though

It takes a while to understand the lifecycle and where/when you need to fetch data accordingly but it’s not too complicated overall

J

7

@mburridge does a basic explanation of the concept in the video here Frontity Talks 2020-05 - Contact Form 7 & Processors - YouTube

2 Likes
8

Perfect. I’ll try it out and then return with results

9

Perfect. This solved my problem.

For future reference, this is exactly what I changed and where:

index.js
I added this action to actions/theme to make it pre-fetch the reviews.
beforeSSR: async({actions}) => { await actions.source.fetch("/reviews"); }

Then in the page I wanted to grab the information
I simply just did the same thing as before, where reviews is my custom post type.
const reviews = state.source.get("/reviews").items

1 Like