Loading featured_media for custom post types

🙋Get Help
#1

Hi All

I created a CPT on my wordpress (https://wp.dossis.ch/wp-json/wp/v2/portfolio/) to be a able to generate a portfolio page dynamically based on all the portfolio-posts.

It is working great, but the featured_media is not being loaded into state at the moment, or only if I click Refresh/F5 on the actual CPT for example /portfolio/dossis/

Any idea how I could solve that? How are featured_media, being fetched and added to state.source.attachment (which is only loaded with blog posts stuff)?

Here is a URL from the Site https://dossis-portfolio-frontity-bsqpscq12.vercel.app and here should be a sandbox of it: https://codesandbox.io/s/t8hym

#2

For the moment I came up with something like this, but I don’t think this is a good idea, performance-wise:

const mediaResponse = await libraries.source.api.get({
      endpoint: '/wp/v2/media/',
      params: {         
      }
    });
    const media = await mediaResponse.json();
    const attachment = media.reduce(function (map, image) {
      map[image.id] = image;
      return map;
    }, {});
    Object.assign(state.source, {
      attachment
    });
#3

Hi @phn

As you’re using mars-theme on this project try adding the following to frontity.settings.js:

packages: [
  {
    name: "@frontity/mars-theme",
    state: {
      theme: {
        //...
        featured: {
          showOnList: true,
          showOnPost: true,
        },
      },
    },
  },
//...
]

See here in our docs.

Hope this helps.

#4

Oh, it looks like you have those properties in your themes index.js, but they’re currently set to false.

image
image1524Ă—990 125 KB

#5

Yes, I left it there because I already removed the check for featured.showOnList/showOnPost in my theme. It wouldn’t have other effect or would it?

I think the problem is that frontity.state.source.attachment is only populated with featuredImages from posts but not from CPTs. See here:

image
image1408Ă—205 11.6 KB

#6

I tried to debug the Issue a bit more, so I checked the state’s data on the two pages:

4c37ecea17044e5b5cca04a427c32cf9
4c37ecea17044e5b5cca04a427c32cf93747Ă—1080 264 KB

Besides state.attachment, also the _embedded item on the CPT item (state.portfolio[*]) itself is not getting populated. Does _embedded have any effects?

Is there any documentation of how state.attachment is being populated? :smiley:

#7

I think I solved it - I was browsing through “old” frontity topics and found this one from @David Retrieve all posts of CPT without knowing slugs

I’ve just added the archive to the CPT config in frontity.settings.js and added this to the Portfolio.js:

useEffect(() => {
  actions.source.fetch("/portfolio-archive/");

  }, []);