Edit online

How to Create a Framework From Scratch

If you have a custom XML vocabulary that is not supported by Oxygen out-of-the-box and it is not a DITA specialization, you have to create a framework from scratch.

In the tutorial that follows, it is assumed that you have:

  • The schema files that defines your XML vocabulary. They can be in any of the supported schema languages: DTDs, XML schemas, RelaxNG, etc.
  • Template files for your XML vocabulary.

To create a framework, follow these steps:

  1. Install Oxygen XML Web Author (download the All Platforms kit from the website and you can request a trial license from the installation wizard).
  2. Create a framework to customize Web Author:
    1. Create an empty folder (e.g. MyFramework).
    2. Create an EXF file (e.g. my-framework.exf) based on the following template:
      <?xml version="1.0" encoding="UTF-8"?>
      <script xmlns="http://www.oxygenxml.com/ns/framework/extend"
          xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
          xsi:schemaLocation="http://www.oxygenxml.com/ns/framework/extend 
          http://www.oxygenxml.com/ns/framework/extend/frameworkExtensionScript.xsd">
        <name>My Framework</name>
        <description/>
        <priority>High</priority>
      
        <associationRules>
          <addRule namespace="*" rootElementLocalName="*" fileName="*" publicID="*" javaRuleClass=""
          attributeLocalName="*" attributeNamespace="*" attributeValue="*"/>
        </associationRules>
      
        <documentTemplates>
          <addEntry path="${frameworkDir}/templates"/>
        </documentTemplates>
      
        <classpath>
          <addEntry path="${framework}/resources"/>
        </classpath>
      
        <xmlCatalogs>
          <addEntry path="${framework}/catalog.xml"/>
        </xmlCatalogs>
      
        <author>
          <css>
            <addCss path="${framework}/css/main.css"/>
          </css>
        </author>
      </script>
  3. Implement the association rule (to detect which documents should match this framework). You can use your root element or leave the default so that your customization will be applied for any XML document.
  4. Create a templates folder with template files (e.g. XML documents with only the required structure).
  5. Add your schemas:
    1. Save the schemas in a sub-folder (for example, named schemas).
    2. Create a catalog.xml file in the root directory of the framework. This catalog file maps the schemas to the actual file in the framework folder where the schema is saved.
      <catalog xmlns="urn:oasis:names:tc:entity:xmlns:xml:catalog">
        <uriSuffix uriSuffix="[schema-file-name].xsd" uri="./schemas/<schema-file-name>.xsd"/>
      </catalog>
      where you would replace [schema-file-name] with the file name of your schema file.
  6. Customize the rendering of the document:
    1. Create a css/main.css file.
    2. Add some styles inside it. You can start with:
      * {
        display: block;
      }
      
      /** Display the element name before each element. This rule is useful only for development. */
      *:before(1001) {
        content: oxy_name() " ";
        font-size: 0.75rem;
        font-family: monospace;
        background-color: lightgray;
      }
  7. Test your framework:
    1. Create a ZIP archive of the framework folder (e.g. MyFramework) and upload it in Web Author's Administration Page.
    2. Create a new file based on your template and open it.
    3. The framework is saved in a folder named tomcat/work/Catalina/localhost/oxygen-xml-web-author/frameworks in the Web Author folder. You can make CSS changes in this folder and refresh the browser until you are happy with the rendering.
  8. Next steps:
    1. Add actions on the toolbar and in the context menu.
    2. Add inline form controls.