Tab pages

To enhance access to the help pages for the Survival plugin, we propose displaying tab pages on the main help form. By clicking on a tab page, users can view the corresponding help content. To add tab pages to a public WordPress page, there are two approaches: search for a suitable plugin or manually create a tab page structure.

Opting for the latter approach, I decided to follow an example from W3Schools. By incorporating CSS and utilizing the class tags defined in the example—specifically, topnav as the wrapping class for the tab pages and active to indicate the currently active tab—the tab pages became visible.

Lesson learned

  • Do not try to use nav-tab-wrapper class in public WordPress pages
  • Add some PHP to switch to the activated $tab content
  • Use shortcodes for help page (content)