Author 诗语
Elements API
Multi-User Editing & Edit Locking
Because of the way Oxygen saves global styles, classes, and settings, multi-user or multi-tab editing with Oxygen is highly discouraged.
We recommend using a single tab when working with Oxygen to avoid issues where one tab is saving older data than another, resulting in overwriting your new changes. The same scenario can occur when two or more users are working in Oxygen at the same time.
To make it easier for teams to collaborate and to prevent this type of issue, Oxygen has built-in automatic Edit Locking.
When Oxygen is open, the following will occur:
The "Edit with Oxygen" button will be replaced with a warning that Oxygen is already open. This change occurs globally across all posts.
The WordPress "Update" button on the specific post being edited with Oxygen will be disabled.
Note: When the edit lock warning is shown, there is an option to open the builder anyway. This should only be done if you are very confident that you understand the consequences of working with Oxygen in multiple locations, or if you believe the edit locking should not be active.
When Oxygen is locked, it is safe to edit the WordPress or ACF content of posts not currently being edited in Oxygen.
Advanced Query Builder
In addition to the default, custom, and manual query options available for Easy Posts and Repeater elements, you can also choose the advanced option.
This query type allows you to visually build a query based off of WP_Query parameters and optionally, dynamic data from WordPress.
You can build virtually any type of query that WP_Query supports by using the advanced query option:
Related posts by taxonomy
Queries based on custom field values (e.g. ACF relationship fields)
Author archive queries
Child post queries
The advanced query option includes a few presets that cover some of these use-cases without having to manually configure the query.
Building Your Query
Note: advanced queries are an advanced topic and it's very helpful if you understand how WP_Query works. You can see a full list of WP_Query parameters, along with descriptions of their function, at https://www.billerickson.net/code/wp_query-arguments/.
To begin building your query, select your Easy Posts or Repeater element and navigate to the Query settings in the Properties Pane. Choose advanced and then, if you're not using a preset from the preset dropdown, click Edit Query.
You'll then see the Advanced Query modal. Begin building your query by clicking the blue Add Query Parameter button.
Next, choose the desired query parameter from the dropdown.
Once a parameter is chosen, click the Add Value button.
Depending on which parameter is chosen, you'll either be presented with a text input field or a dropdown. All text input fields in the Advanced Query modal can be populated with dynamic data by clicking the data button in a given field.
Some query parameters accept multiple values or multiple different types of values. One example of this is tax_query, which accepts an array of data to help identify the posts that should be returned.
Once array is chosen from the dropdown for the tax_query, you can then add values to the array itself to build the query.
As you can see from this example, it's possible to build very complex queries using the Advanced Query option. You can also add multiple query parameters to a query.
Examples
ACF Relationship Field
To use an ACF Relationship field, edit your Advanced Query and add the post__in parameter.
Next, add a value. Then click the data button in the parameter's value field.
In the Dynamic Data dialog, click Advanced Custom Field and then your ACF relationship field from the list of available fields.
On the next screen, make sure to put a single comma ( , ) in the separator field.
Next, click INSERT.
Now, close the Advanced Query dialog and click Apply Query Params button in the Properties Pane to see the result. Note that you must be previewing a post with a populated ACF relationship field in order to see the results as expected.
You can further narrow your query by adding post_type and other parameters to make it more efficient.
Getting Started
Loading a prebuilt site
Opening Oxygen
Building from scratch
Setting your site's homepage
What theme? No theme.
Multilingual with WPML or Polylang
Oxygen has rudimentary support for WPML and Polylang.
This is not an official feature of Oxygen and no support will be provided via official support channels.
Note that the Oxygen and WPML teams have been in contact and are jointly investigating official compatibility. This does not mean that WPML compatibility is planned or guaranteed at this time.
Information on translating content created in Oxygen can be found on WPML's website.
Caveats that we're aware of:
Template translation doesn't work for logged out users. As such, you will need to use one template, duplicate your content, translate it within the same template and then use Conditions to show/hide the content based on the language string in the URL.
You can find the Condition code for WPML here and for Polylang here.
WPML and Polylang usually prevent you from being able to save changes to Reusable parts.
Please report issues on GitHub.
Library Overview
Oxygen's design library contains a wide range of page sections, complete pages, and complete websites.
Design Sets
Design Sets are groups of components and pages that have a similar style.
Design Sets include:
Components – sections and elements of pages designed to lay out a specific type of content. Headers, showcase, pricing, social proof, and call to actions are some examples of components.
Pages – complete sets of components, which are combined and customized to create a ready-made page - for example, a homepage, contact page, product tour page, and more.
Demo Websites – real-world websites built with the components in the Design Set.
Adding Sections & Elements To Your Pages
From inside Oxygen, go to +Add -> Library -> Design Sets. Choose a Design Set, and then browse to Sections & Elements.
Click an element to add it to your page.
Installing A Complete Website From The Library
Go to Oxygen -> Home in the WordPress admin panel. Then click Install a Website in the Oxygen Design Library box.
Choose a website to install, and then click Install to install it.
Loading A Complete Page Design
From inside Oxygen, go to +Add -> Library -> Design Sets. Choose a Design Set, and then browse to Pages.
Click a page to add all of its contents to your design.
Client Control
Oxygen 3.6 introduces a new "Client Control" tab under Oxygen -> Settings in the WordPress admin panel. There, you'll find that we've consolidated the Role Manager and Post Type manager into this tab.
Role Manager
By default, access to Oxygen is only available to administrators. Access to Oxygen can be granted to other user roles at Oxygen -> Settings -> Client Control -> Role Manager in the WordPress admin area.
Oxygen's role manager works with the WordPress default user roles, any additional user roles added by custom code, and any additional user roles added by 3rd party plugins such as User Role Editor.
Access Levels
Note: Edit Mode will only be available on sites activated with an Oxygen Agency license.
In the access level dropdown for roles & users, you'll find Full Access, No Access, and Edit Only options.
Full Access will grant the given role or user complete, unrestricted access to Oxygen.
No Access will restrict the given role or user from accessing Oxygen at all, including all admin settings pages.
When Edit Only is chosen for a role or user, several restrictions are imposed for that role or user:
The Oxygen meta box is hidden. Instead, you'll find an Oxygen icon button in Gutenberg or a blue "Edit with Oxygen" button at the top of post edit screens using the Classic Editor.
The "Oxygen" admin menu is replaced with a single "Templates" link.
The Manage button in the builder is hidden. Edit Only users cannot access global settings, stylesheets, or selectors.
The +Add button is hidden.
The Conditions, Link, Duplicate, and Delete icons in the Properties Pane are hidden.
The add class button in the Selector Dropdown is hidden.
The copy, clear, and delete icons in the Selector Dropdown are hidden.
The Advanced tab in the Properties Pane is hidden.
Code Blocks cannot be clicked or edited.
In the Structure Pane, the hamburger menu for elements is hidden.
In the Structure Pane, the delete icon for elements is hidden.
Drag & drop is disabled.
These restrictions make it safe to let a client into Oxygen as they can only change styling and content. There's no access to code, global styles or settings, deletion, or re-arranging of elements.
This, however, may be far too restrictive for some cases, so we've added some granular controls that appear once you've chosen "Edit Only" access for a role or user:
Enable Elements: Allows role/user access to insert, duplicate, and delete specified elements.
Enable Advanced Tab: Allows role/user to use the Advanced Tab in the Properties Pane. All Custom CSS and JavaScript tabs will still be hidden.
Enable Drag & Drop: Allows role/user to drag and drop elements in the builder.
Enable Reusable Parts: Allows role/user to add Reusable Parts.
Enable Design Library: Allows role/user to add elements from the Design Library.
Disable Classes: Prevents role/user from being able to modify a class that has been applied to an element.
In addition to these restrictions, you can also lock roles/users with Edit Only access completely out of Oxygen on specific posts using the new "Lock Post In Edit Mode" checkbox in the Oxygen meta box. This does not restrict the role/user's ability to access the WordPress editor for that post.
Per User Access
In addition to the Role Manager and Post Type manager controls, you'll also find a "Per User Access" control section that allows you to define access on a per-user basis. Settings defined here will override role-based settings for a given user.
Post Type Manager
By default, Oxygen's metabox appears on the Edit screens for all post types.
You can hide the Oxygen metabox from post types where you do not need it via Oxygen -> Settings -> Client Control -> Post Type Manager in the WordPress admin area.
IMPORTANT SECURITY INFORMATION
Full access to Oxygen should only be granted to trusted users. This is because Oxygen provides the ability to execute PHP code, so any user granted access to Oxygen could execute code to make themselves an administrator.
Getting Started Tutorial
Pages
To view all complete pages available in a design set, click +Add > Library > Design Sets > [set name] > Pages.
Click a page to add all of its contents at once.
Pages will not container a header and footer, because that comes from a Template. To access all Templates in a particular design set, a Templates folder will appear below the Pages folder, only when editing a template.