Unable to fetch blog!

🙋Get Help
1

Hello, I have a custom homepage (not fetching from wordpress) but somehow it broke the blog page and no posts are being fetched.

This is my code in frontity.settings.js

       {
          "name": "@frontity/wp-source",
          "state": {
            "source": {
              "api": "http://localhost:8080/wp-json",
              "homepage": "/",
              "postsPage":"/blog"
            }
          }
        }

This is my handler for Homepage

    const homeHandler = {
        name: "Home",
        pattern: "/",
        func: ({ state }) => {
            state.source.data["/"].isHome = true;
        }
    };

Is this something related to the pattern?

2

After Some changes to the code, I have added pattern for homepage as “/home/” and in frontity.settings.js set the homepage to “/home/”. Now the problem is i cant access homepage at / but it works fine at /home and the blog is also fetching normally.

I believe, Non-Wordpress pages when set to homepage doesn’t work.

4

Hey @aeyzazkhan!

What the homepage setting does is to handle the homepage ("/") as if it were the route of the WP page you set as value.

For example, if you set homepage value to be "/dashboard/", then if you access "/" you will see the “dashboard” page. But it only works with WordPress pages, i.e. you need to have a page created in your WordPress site with that link.

For your case, as your homepage doesn’t exist in your WP site I would remove the homepage setting and use only the custom handler with the pattern equals to "/".

Try doing that, and let me know if it works for you! :blush:

5

Hi, Setting “/” pattern for custom handler do works but somehow it breaks the posts page and throws 404 Error :frowning:

upon first load of my /blog page the console throws

Cannot set property 'isHome' of undefined
6

Sorry, you were doing it right! :sweat: You need to set homepage as /home/ and then create a handler with /home/ as pattern. If not, you are overwriting the handler that is responsible for requesting the post archive.

I think the problem you had before was the handler should be added to libraries.source.handler during the init action (triggered by Frontity), and not during beforeSSR or beforeCSR action, so in your index.js you need to do something like

const init = ({ libraries }) => {
  // Define the home handler
  const homeHandler = {
    name: "Home",
    pattern: "/home/",
    func: ({ state }) => {
      state.source.data["/"].isHome = true;
    }
  };
  
  // Add the home handler to the array of handlers
  libraries.source.handlers.push(homeHandler);
};

and then add the init function to actions.theme.

Your frontity.settings.js should be then

{
  name: "@frontity/wp-source",
  state: {
    source: {
      api: "http://localhost:8080/wp-json",
      homepage: "/home/",
      postsPage:"/blog/"
    }
  }
}

This should work but let me know if it still doesn’t. I’m glad to help :blush:

7

@David Thanks, seems like things are partly fixed with the above config but now the contents of my Custom homepage are coming along with the posts in Blog page. :roll_eyes:

Something definitely has to do with

state.source.data["/"].isHome = true;

8

Oops, It seems like a bug. The post archive handler is setting isHome property to true even though the post archive page is not the homepage. See postArchive.ts.

That might be causing that when you access /blog/ both the post archive and the homepage are rendered.

I’ve opened an issue in GitHub. It’s easy to fix, I’ll let you know when it’s resolved.

9

Until the issue is solved (although it is easy), if you want to test, could you use something like {data.isHome && !data.isArchive && <Home />} @David?

1 Like
10

@David Thanks, setting the value to false in local package helped and its not merging the homepage anymore!

@SantosGuillamot Thanks, the problem is patched!

1 Like