Now is your last chance to buy a lifetime license before we switch to annual pricing. Existing licenses will be unaffected.
read more
docs PHP, CSS & JS

Templating Overview

Templates are designs created in Oxygen that are applied to multiple places on your website. They can be managed inside the WP admin from Oxygen > Templates.

You can create templates that apply to pages, blog posts, WooCommerce products, member portals, bbPress, search results, custom post type archives, and every other part of your site.

Creating a Template & Applying It To Content

  1. Select Oxygen > Templates in the WordPress admin panel, then click Add New Template.
  2. Enter a name for the template, and then click Publish.
  3. Specify where the template applies using the options under WHERE DOES THIS TEMPLATE APPLY?, then click Update to save your changes.
  4. Click Edit with Oxygen to design the template.

Inner Content

Display the content that your template applies to using the Inner Content element.

To add an Inner Content element to a template, click +Add > Basics > Other > Inner Content.

The area covered by the Inner Content will be editable with Oxygen for each item the template is applied to.

If no inner content is created with Oxygen, the WordPress content will be used instead - whether it is a post, page, WooCommerce product, bbPress forum topic, or anything else created within WordPress.

For example, when you apply a template containing a header, Inner Content, and a footer to all pages of your site, the Inner Content area is editable on all pages. You can then use Oxygen to design the Inner Content area for each page or post, while the header and footer will remain the same.

Dynamic Data

Dynamic Data is used to link the design elements within your template to live data from from your WordPress database.

For example, you can link a Heading element in your blog post template to the Post Title in the database. Each blog post displayed with the template will have its title placed in the Heading element. Similarly, you can link a Text element to your post content, link an image or section background to your post's featured image, and much more.

Inheritable Templates

Templates containing an Inner Content element can be inherited by other templates.

Select the template you wish to inherit from Inherit design from other template list. Then save the template.

The editable area of the inheriting template will be nested inside the Inner Content area of the template which is being inherited.

For example, you may have a "Main Template" with a header, Inner Content, and footer. You now want to create a "Blog Post Template" which uses the same header and footer.

Set the "Blog Post Template" to inherit the "Main Template", and it will pull in the header and footer from the "Main Template", and the area editable on the "Blog Post Template" will be the Inner Content area.

Template Priority

When your template settings mean multiple templates could apply to the same content, the template with the highest priority number is used.

To set the priority, specify the Template priority number.

Previewing Content The Template Is Applied To

When editing a template which has been applied to content at Oxygen -> Templates -> Edit, you can preview the content which the template is applied to directly inside Oxygen's visual editor.

Choose the content you wish to preview from the Previewing dropdown menu.

Note: this dropdown may be blank if you haven't yet applied the template to any available content.

Manually Applying Templates

You can manually apply a template to any individual post, page, or custom post type.

To apply the Oxygen template to a specific item on your site, follow these steps:

  1. In the WordPress admin panel, go to the Edit screen for the post/page/CPT you wish to apply the template to.
  2. Select the template from Render page using template list, then save the page.

Example Template Structure

Here is an example structure which could be found on a site with pages, blog posts, and WooCommerce products.

  • Main template - has header, footer, and Inner Content area. Applies everywhere using Other -> Catch All.
  • Page template - inherits Main template, has Inner Content area. Applies to all Pages using Singular -> Page.
  • Blog Post template - inherits Main template, applies to all Posts using Singular -> Post. Instead of an Inner Content area, this template uses Dynamic Data to display post title and content.
  • Generic Archive template - inherits Main template, applies to all archives using Archives -> All Archives. Instead of an Inner Content area, this template uses an Easy Posts element to list all the posts displayed by the archive.
  • WooCommerce Product template - inherits Main template, uses Inner Content area to display the WooCommerce product. Applies to all Products using Singular -> Products.
  • WooCommerce Shop/Archive template - inherits Main template, applies to the WooCommerce shop page which is an archive, and all WooCommerce categories, using Archive -> Post Types -> Products and Archive -> Taxonomies -> Product Categories. Because the Generic Archive template already applies to all archives, this template must have a higher priority number to override it.
Last modified: September 20, 2023
Copyright © 2024 Soflyy
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram