I have a standalone page with the slug: hubv2 that is using a custom page template which runs a small React app. The React app handles in browser routing and it works fine. For example I can hit /hubv2, load my app and click-navigate from /hubv2 to /hubv2/example-page (which is handled entirely by my app) without any issues.
However, when I directly hit /hubv2/example-page, WP takes over and sends me to 404. This makes sense.
What I’d like to do is make WP take any rule that matches ^hubv2/([^/]+)/? and point it to my standalone page template without altering the URL. If I can get the URL pattern to match with my page template without altering the URL, my application will take over as expected.
Upon doing some research, I’ve attempted some URL rewrite rules:
function hub_url_persist() {
add_rewrite_rule('^hubv2/([^/]+)/?','index.php?pagename=hubv2', 'top' );
}
add_action('init', 'hub_url_persist', 10, 0);
However, after flushing permalinks, this just loads the site’s blog (which lives at index.php… and I can’t figure out why.
I’ve also tried replacing pagename=hubv2 with page_id={{the page's ID}} but no luck.
One final note; I’ve attempted using query vars, but since my app handles the URL parsing on its own via JS, it didn’t seem necessary.
My .htaccess is the standard out of the box from WP. Any help would be greatly appreciated, I’m really struggling with this one.
Thanks!
