Configuration – STEP 3
The last step is actually change or add new HTML header objects. A division is been made into three subparts where each parts is explained individually.
The modifications should be done within the following section:
A more detailed explanation of the "RenderInput" section can be found in the paragraph ‘Structure FICO XML’ at the FICO support page.
IMPORTANT: It is important to note that each adjustment within this RenderInput on node level, should be added in alphabetical order (e.q. root level -> Doctype before Metatags || MetaTag level -> Content before HttpEquiv etc.).
It is possible to add new Metatags. To add new Metatags the following code should be added to the RenderOutput of the extension file:
There are also metatags available which contains a name instead of a HttpEquiv. For example the viewport metatag. Which is a commonly used metatag for optimize a website for mobile devices. From Futurama version 17.2 it is possible to configure these metatags within the extension XSLT:
When adding the above XML example to the extension file the output within the HTML website will be:
As explained earlier, it is important to note that when defining the above XML the alphabetical order is important. Therefore, the "content" node should be defined before the "httpequiv" or the "name" node. In addition, a XSL copy statement is needed otherwise all the other metatags are not rendered.
An implementation example
Adding a new metatag without changing other parts of the RenderOuput should be implemented like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Please keep in mind that the metatags containing the name attribute are only available from Futurama version 17.2 and higher
It is possible to add or edit Script files which are rendered within the header of a HTML page. To add a new Script file the following code should be added to the RenderOutput:
Add Script files
Within the "Scripts" RenderOutput a new script could be added by adding a Script node:
Edit Script files
To modify an existing Script as, for example: jQuery, a filter could be added to replace the current script:
Important to note is that whenever the jQuery version is changed, the new version should be placed within the folder that the XML is pointing to. In the above example, within the Scripts map of the Futurama application there must be a jQuery version 1.8.1.min.js available to use.
Using these modifications will result in the following HTML:
As explained earlier, it is important to note that when defining the above XML the alphabetical order is important. Therefore, the "file" node should be defined before the "type" node.
The DocType of the application can also be adjusted within the RenderOutput. To adjust the standard DocType, to for example a new HTML5 doctype, the following adjustment is needed:
This modification make it possible to change the DocType to a HTML5 DocType. Within the newest version of Futurama (17.2 + ) HTML5 is fully supported. NOTE: To setup an application which should be within a HTML5 format please have a look at the following support page on how to set it up: HTML5 Template
When the Doctype is adjusted the following HTML is visible within the source of the page:
As explained earlier, it is important to note that when defining the above XML the alphabetical order is important. Therefore, the "doctype" node should be defined before the "metatags" and the "metatags" node should be defined before the "scripts" node.
If all the adjustments, described above, are executed then the extension file will contain the following sections:
In this segment, it can be seen that this template can be targeted in two modes. One mode where the variable retrievalmode is set to 'html' (this is the default value). The other mode is 'headers', which produces the RenderOutput element, containing the Scripts, MetaTags and DocType information that is included in the headers of a Futurama webpage.
Load external CSS files
From Futurama version 17.2 and higher it is possible to include CSS files within the extension file. A new section within the RenderInput can be created in order to state a reference towards a CSS file:
As stated earlier within this support page, the alphabetic order is very important. As a result, the CSS section should be created before the DocType section: