Viewing page served via add_rewrite_rule

🙋Get Help
1

Hi All,

Me again with probably a really simple question.

We’re building a site and using Frontity to handle the front-end, we’re building a plugin for the site in question which registers custom rewrite rules to serve data (these pages will have a unique token appended to perform some simple checks)

We’re adding the rewrite rules like this:

add_rewrite_tag('%listing%','([^/]*)');
add_rewrite_rule(
    '^listings/([^/]+)$',
    'index.php?pagename=new-listings&show=$matches[1]',
    'top');

Now if we access the rewrite above via WP (http://example.com/listings/5000), it is working as expected and I can pull the page.
When I attempt to access the same URL via Frontity (http://localhost:3000/listings/5000) I’m getting a 404 and the following error:

Error: post type from endpoints “posts,pages,media” with slug “5000” not found

I attempted to set up a simple handler after reading: How to create Custom Pages? but no luck (for those curious my handler is below):

const listingHandler = {
    pattern: "/listings/",
    func: ({ state }) => {
        state.source.data["/listings/"].isListing = true;
    }
}

I have a sneaking suspicion the handler is the key to this all working but I’m not quite sure what in the handler I should change to make this function.

I’m hoping someone could point me in the right direction, otherwise I’ll have to resort back to good ol’ query parameters.

2

Figured it out.

For those curious, it was a handler problem. I had to add a regex pattern to check for the last part of the url. My handler ended up looking like this:

const listingsHandler = {
  pattern: "/listings/:id",
  func: ({ state , params}) => {
    console.log(`The ID is: ${params.id}`);
  }
}
2 Likes
3

Hey @chris! I’m glad you got it working. As you said, without :id it wasn’t matching the pattern. Looking forward to see what you are building :blush: