Introduction: HTML 5 Template
From Futurama version 17.02 and higher it is possible and recommended to use HTML5 as the rendered DOCTYPE. In order to make it possible to have a valid HTML5 page a couple of adjustment are needed to make Futurama render valid HTML5 code. Without adjustments, validation of the datebox and webslider objects would return invalid HTML5 code. Therefore those objects are replaced by a commonly used library: jQuery UI. Futurama now supports the use of the jQuery UI slider and jQuery UI datepicker. Within the Futurama 17.02 release the jQuery UI library is included and ready to be used. The jQuery version is also updated to the latest version, jQuery 1.12.1. In order to enable the HTML5 template a reference should be added within the web.config. In the next section a more detailed explanation is given on how this is done.
Enable HTML5 template
In order to upgrade the website to the HTML5 standard an upgrade extension file should be created. This can be placed on the top level of the application. The same level where the web.config is stated. Within the upgrade file the following XSLT should be created:
FuturamaModules/1702/jqueryui.min.css
<!DOCTYPE html>
"_blank"
"_blank" rel="noopener noreferrer"
"_blank"
"_blank" rel="noopener noreferrer"
A few remarks on the upgrade extension stated as above:
jQuery Migrate file
It is important to note that there is also a reference made towards the jquery-migrate-1.3.0.min file within the above XSLT code. This file is needed in order to make sure that upgrade to a more recent version of jQuery will not break the application and other JavaScript libraries. To include this in the application the following steps should be taken:
- Download the migration file from the following location: https://code.jquery.com/jquery-migrate-1.3.0.min.js. (Right click on the hyperlink -> link save as
- Create a folder within the application called: "Upgrade". Same level as the web.config
- Place the migration file of jQuery in the new created folder called: "Upgrade"
The created upgrade extension file, for example: extension_upgrade.xsl is now ready to be used. To enable it a reference to it must be added to the FuturamaSettings section of the web.config:
Safe Hyperlinks
Everything below the RenderInput node is used for modifying existing hyperlinks with the parameter: target="_blank"
. If the rel="noopener noreferrer"
parameters are not used then the application could be vulnerable to phishing attacks.
Render Config web.config
Please keep in mind that also within the Futurama ConfigSections in the web.config the render plugin should be enabled. Information how this can be done can be found on the following page: Configuration - Rendering. Make sure that all the settings have been correctly set.
When a reference is made to the extension file then Futurama will render the application in HTML5 code. This implies that when a datebox or webslider is used it is rendered based on the jQuery UI library. Please also note that it is still possible to implement your own definition of a datebox, a webslider or any other object. Please have a look at these other pages in order to find out how to implement a different webslider or datebox or any other object.