How I kept two docs sites apart in one WordPress install (and almost gave up)

I already had the BeeEngine docs on beeenginejs.com as static WordPress pages. When BeeLadybug grew big enough to need its own docs, about 33 pages, I hit a wall. Everything I made ended up mixed in with the BeeEngine pages: the same page list, the same hierarchy, the same mess. Using posts wasn't an option either, because docs aren't blog articles.

I'll be honest: I was close to dropping it. I'm not a WordPress plugin expert, and every solution I found was either too complicated or broke something else.

The fix: a custom post type

The answer turned out to be simple. I gave BeeLadybug its own content type:

1. I installed Custom Post Type UI.
2. I created a post type with the slug ladybug, set Hierarchical to true and Has archive to false.
3. I went to Settings → Permalinks and clicked Save. Skip this step and you'll get 404s.

Now every BeeLadybug page lives under /ladybug/... with its own URL, and it's completely separate from the BeeEngine pages in the admin.

Keeping the style separate too

Each page is a Custom HTML block, and all the CSS is scoped under a .bld-docs wrapper, so it never leaks into the theme or the BeeEngine docs. Links to pages I haven't written yet point to # and get dimmed:

.bld-docs a[href="#"] {
  opacity: .4;
  pointer-events: none;
}

What I learned

The problem was never WordPress, it was not knowing which tool to use. If you're stuck on something similar, keep going. The fix might be one plugin and one checkbox away.🫈🫈🫈

👉 BeeLadybug docs