The Oxygen team continues its rapid march toward the full release of Oxygen 6 with the Beta 3 update. Released on September 9 2025, this beta introduces significant enhancements to the visual builder’s workflow, performance and design capabilities. From a brand‑new Term Loop Builder element to a completely reimagined Code Editor and a suite of UI and design library improvements, Beta 3 packs a punch. In this article, we’ll break down what’s new, why it matters for developers and designers, and how to test the release responsibly.
What’s New in Oxygen 6 Beta 3?
Loop Through Any Taxonomy with the Term Loop Builder
For years, Oxygen’s Post Loop has allowed creators to design custom listings for posts or custom post types. Beta 3 extends this functionality to taxonomy terms. The new Term Loop Builder element lets you loop through categories, tags, product attributes or any custom taxonomy without writing custom PHP. You can specify the taxonomy, set how many terms to show and decide whether to include empty terms. Because the element taps into WordPress’s own WP_Term_Query class, it supports advanced custom queries when the out‑of‑the‑box controls aren’t enough.
But the real magic happens when you combine the Term Loop Builder with Oxygen’s Dynamic Data system. You can display default fields like term names and descriptions or pull in custom fields from plugins such as Advanced Custom Fields or MetaBox. If your project requires even more flexibility, the Dynamic Data API allows you to define your own data points to show for each term. The result is a powerful tool for building category directories, product attribute grids, custom taxonomies and other data‑driven components directly inside the builder.
A Supercharged Code Editor
Coding inside a visual builder might sound counterintuitive, but many Oxygen users rely on custom CSS, PHP snippets and twig templates to fine‑tune their designs. Beta 3 completely revamps the Code Editor to make writing code faster and less error‑prone. The new editor is built on CodeMirror 6 and introduces:
Emmet support. Shortcuts like
h10expand toheight: 10px;andul>li*3instantly generate an unordered list with three list items. Emmet dramatically reduces keystrokes and speeds up prototyping.Autocomplete for variables and selectors. When you start typing
--, the editor suggests Oxygen variables; when you type a CSS selector, it autocompletes class names defined in your design. This feature helps you stay consistent with your existing style tokens.Element Studio shortcuts. Within Element Studio, typing
{{instantly exposes available twig variables and%%surfaces twig tags, making custom element creation much faster.Modern coding features. The upgrade to CodeMirror 6 brings intelligent autocomplete, linting for error checking, automatic formatting and bracket matching, plus a built‑in color picker for CSS variables. These upgrades make the coding experience comparable to a lightweight IDE.
Overall, the new Code Editor turns Oxygen into a more developer‑friendly environment. You spend less time hunting for class names or closing braces and more time focusing on what makes your site unique.
Cleaner UI and Workflow Enhancements
Building complex layouts can be tedious when you’re not sure which element you’ve clicked or where a particular style is coming from. Beta 3 introduces several small but meaningful UI improvements to streamline your workflow:
Hover details. When you hover over any element in the canvas, Oxygen now displays its icon and name, so you can quickly identify it before clicking.
Style indicator colours. Styles applied via classes or breakpoints are colour coded: purple means the style originates from the selected class; yellow indicates a different class or breakpoint; red signals that the style is being overridden. This visual aid helps you track inheritance and overrides without digging into style panels.
Reorder classes. You can now drag and drop classes in the Class panel to organise them logically. Reordering classes doesn’t affect the CSS cascade (that’s handled in the Selectors panel) but helps keep your workflow tidy.
Unified menus and refined controls. Menus have been consolidated under one item, unit controls are more consistent, and variable performance is improved. These refinements make the builder feel smoother and more predictable over long sessions.
Together, these enhancements reduce friction when navigating complex structures, diagnosing style conflicts and managing your CSS architecture.
Stronger Design Sets & Reusable Components
Oxygen’s Design Sets, introduced in Beta 2, allow you to create and reuse collections of components across projects. Beta 3 strengthens this feature by importing Variables and Selectors along with your components. When you import a Design Set, your colour palette, typography and other style tokens come along for the ride, ensuring consistency throughout your site.
Component logic during import has also been improved. Components are automatically assigned to their associated elements in the builder, making the import process seamless. These changes transform Design Sets into a robust design system: you define a design once and reuse it across multiple projects with confidence, knowing that your styles and components remain intact.
Breakdance & Form Submissions
Although Oxygen and Breakdance are distinct products, the Oxygen 6 Beta series includes updates for the Breakdance extensions. In Beta 3, Breakdance Forms adds built‑in submission logging within the WordPress admin area. You can now review entries, troubleshoot form actions and share access with colleagues without leaving the admin dashboard.
Why Beta 3 Matters for Developers and Designers
If you build sites with Oxygen, you know that efficiency is everything. The Term Loop Builder eliminates the need to write custom loops for taxonomy terms; you can create directories and category grids visually and add custom queries only when needed. The revamped Code Editor brings features developers expect from dedicated code editors into the builder: Emmet, variable autocompletion, linting and colour pickers make writing CSS, PHP and twig more enjoyable. The UI improvements speed up navigation and troubleshooting, while the enhanced Design Sets enable scalable, reusable design systems. In short, Beta 3 reduces friction at every step, allowing you to focus on creativity and client work instead of wrestling with tooling.
How to Test Oxygen 6 Beta 3 Safely
Remember: Beta releases are for testing, not production. Here’s a safe way to explore Beta 3:
Download the Beta. Log in to your Oxygen account and download the Beta 3 installer. If you’re a new customer, you can purchase Oxygen 6 with a lifetime licence and access the beta from the customer portal.
Use a staging site. Install the beta on a local or staging WordPress installation. Avoid installing it on a live site; betas can contain bugs and may break compatibility with existing projects.
Create a backup. Before testing, take a full backup of your site or use a disposable environment. If you run into issues, you can restore your previous state.
Enable debugging. Activate WordPress debug mode (
wp-config.php) and monitor your error logs. Beta releases often surface issues; reporting them to the Oxygen team helps improve the final release.Experiment with features. Try building a taxonomy directory with the Term Loop Builder. Take advantage of Emmet and autocomplete in the Code Editor. Import a Design Set and observe how variables and selectors are carried over. Explore the new UI to see how style indicators and class reordering simplify your workflow.
Provide feedback. The Oxygen team relies on user feedback to polish new releases. Use the support forums, GitHub issues or the dedicated beta feedback channels to report bugs and suggest improvements.
Frequently Asked Questions
Q: What is a Term Loop Builder?
A: It’s a new element in Oxygen 6 Beta 3 that lets you loop through any taxonomy (categories, tags, product attributes or custom terms) and design listings visually. You can also craft custom queries via PHP using WP_Term_Query.
Q: How do I use Emmet in the Code Editor?
A: Simply type an Emmet abbreviation in the Code Editor (e.g., h10 for height: 10px;, ul>li*3 to generate a basic unordered list). The editor will expand it automatically, saving you time.
Q: Can I import my existing design systems into Beta 3?
A: Yes. When you import a Design Set in Beta 3, Oxygen now imports your Variables and Selectors along with your components, ensuring your colours, typography and style tokens remain consistent.
Q: Should I update my live sites to Beta 3?
A: No. Beta releases are meant for testing and feedback. Wait for the stable Oxygen 6 release before updating client or production sites. Use Beta 3 only on staging or local environments.
Q: When will Oxygen 6 be officially released?
A: The Oxygen team hasn’t announced an exact date, but each beta moves the product closer to a stable launch. Participating in the beta program and providing feedback helps shape the final release.
Conclusion
Oxygen 6 Beta 3 is a substantial update that demonstrates the builder’s commitment to being both developer‑friendly and designer‑oriented. The Term Loop Builder opens up new design possibilities for categories and custom taxonomies. The supercharged Code Editor brings Emmet, intelligent autocomplete, linting and other features typically found in full‑fledged code editors. UI refinements make navigating and troubleshooting complex designs faster, while stronger Design Sets help enforce design consistency across projects.
At Datronix Tech, we’re excited about these improvements because they streamline our workflow and let us deliver high‑quality WordPress sites faster. If you’d like help upgrading to Oxygen 6, building custom loops, or implementing design systems that scale, book a free consultation below. Together, we’ll turn these powerful new tools into beautiful, performant websites that stand out.
