WordPress URLs ending in .html

Hi there,

I installed the following themes to try Frontity thoroughly.

When I post on the site, they are published directly. There is no problem with this. However, if I update a published post, that content title appears on the home page for a few minutes, but when I try to visit it, it gives a 404 error.

Hi @hsbas,

Welcome to the Community!

Can you please provide a repo or code-sandbox with your code? This is especially helpful to find solutions of technical issues with specific code

Hi @juanma

I tried the project on the Frontity homepage. I havenā€™t changed anything except the site address.

My site address:

Summary

https://koinbulteni.com/

@David Any idea what could be going on here?

Uhm, not sure what could be happening. :thinking:

@hsbas, what steps did you follow exactly?

Does it happen with any published post after updating it?

By ā€˜updating itā€™, you mean changing the slug?

I tried using the URL of your siteā€™s API and everything seems to be working.

Screenshot from 2021-02-12 10-22-49

Hi David.

Yes, everything works well except one case.

When we update only the content of the post we published, that post continues to appear on the homepage in Frontity, but when we click it, we encounter a 404 error. After a few minutes, the 404 error goes away, we can see the latest version of the post.

We do not change the slug, we only update in content.

Iā€™m not sure but might it be related to the codesanbox instance? I mean, does the same happen if you use a local Frontity project (npx frontity create)?

Before deciding whether to migrate our project to Frontity, I wanted to install a demo and try it out. I havenā€™t created a project from scratch and examined it in detail yet.

Hovewer, after installing and trying it from scratch, I will inform you if I encounter this problem again.

Thanks for your interest. :raised_hand_with_fingers_splayed:t2:

Thank you @hsbas :blush:

Just let us know if the problem persists. Weā€™ll try to solve it asap in that case.

2 Likes

Hi there,

Your new documentation prepared very well, congratulations and thank you.

I created the project just like on this page. All I did was use the command frontity create and then replace state.source.url with my site. Then I ran the server with the frontity dev command.

The site opened at localhost:3000 looks normal. But when I go into an article and refresh the page, I get a 404 error. If I donā€™t refresh the page, itā€™s okay. However, when I want to go back and open the page again I get a 404 error. This problem happens only on my WordPress address. What could the problem be about and how can I solve it?

Hi @hsbas,

Iā€™ve used the Frontity CodeSandbox boilerplate to create a Frontity project where i just have changed the state.source.api setting to point to https://koinbulteni.com/wp-json

    {
      name: "@frontity/wp-source",
      state: {
        source: {
          api: "https://koinbulteni.com/wp-json"
        }
      }
    },

This is the codesandbox deployed version of the mars-theme using your WP REST API ā†’ https://lt0wk.sse.codesandbox.io/

Youā€™re right with the behaviour of your final site.

I guess the error must come from the .html generated for each url.
Is this final .html added for a specific reason from your WordPress? You donā€™t really need that extension at the end of the URL and I think SEO would even be better without it

1 Like

@cristianbote It seems URLā€™s defined with a specific extension (.html in this case) doesnā€™t load properly from SSR rendering

Can you check this to decide if this is a bug that need to be addressed or if this is something we should explain in our documentation

1 Like

HÄ° @juanma,

Thank you for your interest and detailed explanation.

We do not have a special reason to use the .html extension, but the link structure has been like this for 4 years. It would not be healthy to update the link structure as ā€œpost nameā€ as stated in the document, because we have more than 20,000 articles. So the only thing we can do is remove the ā€œ.htmlā€ at the end of the link.

But you will appreciate that making such a link structure change directly on an authoritative site like this can be risky for Google indexes.

I am very hesitant about what I should do.

Hi @hsbas, I am looking into it.

Meanwhile Iā€™ve found this community question How do I link to my WordPress pages (not posts) that have a .htm extension in the URL?, where @mmczaplinski linked to post about how from a SEO point of view, the document extensions are ignored https://www.searchenginejournal.com/googles-john-mueller-says-parameters-urls-not-matter/246675/#close.

Open up a bug to track this further Navigating to a Server Side Rendered url with an extension, `.html`, shows 404 page Ā· Issue #727 Ā· frontity/frontity Ā· GitHub

Hi @cristianbote

I will be excitedly waiting for the problem to be solved.

Thanks!

Hi @hsbas,

Thereā€™s been some more progress on the issue and the fix itā€™s fairly straight. Would you be open to contribute with the fix yourself? :grinning_face_with_smiling_eyes:

We would love and welcome any contribution! We have a fairly easy to start contribution guide. Thereā€™s nothing else like fixing an issue on an open-source software. :muscle:

Let me know if thereā€™s more that I can do in here.
Have a great one!

2 Likes

@hsbas Iā€™ve just realized that you can also do this in a package, modifying the handlers in the init function:

export default {
  actions: {
    myPackage: {
      init: ({ libraries }) => {
        libraries.source.handlers.map((handler) => {
          handler.pattern += "(\\.html)?";
          return handler;
        });
      },
    },
  },
};

Could you please try it out and let us know if it works?

Hi Luis,

I tried this in mars-theme index.js file. It didnā€™t work. I also tried in console but nothing changed. I can reach the same post multiple times with different browser tabs but when I press refresh button, it gives me 404 error.

Did you tried this action? Maybe Iā€™m missing something. :sweat_smile: