How to Create a WCC Component to Add a HTML Head Tag
By Ken Walker-Oracle on Jan 07, 2014
IE is a troublesome browser, in that functionality changes from version to version, and sometimes you must set a compatibility variable back to a specific version so that web pages will function properly. This is usually set up, from an end user perspective, via the Compatibility View section of the options page in IE. However, this needs to be done on a per-user basis, and can be problematic for sites with corporate intranets where forcing these administrative actions on users is not a viable option.
This component needs to extend the standard page head section to include html that:
- Respects non-IE browsers – don’t add anything if the browser is not IE
- If the browser is IE, and the version is greater than 8, set the compatibility for EmulateIE8.
By reviewing the idoc script in …/Oracle_ECM1/ucm/idc/resources/core/idoc/std_page.idoc, we can determine that the standard page contents after the head tag is emitted by the std_html_head_declarations dynamic html. Our component will extend this html to add our compatibility check before emitting any of the standard head section html.
The instructions here assume that WCC is executing in a Linux environment. Some of the setup and start processes are different if WCC is executing in a Windows environment.
Components are created with the ComponentWizard. Navigate to your WCC domain instance, in the bin directory (…/ucm/cs/bin typically) and execute the ComponentWizard (execute ./ComponentWizard from a terminal). The terminal window will show that you are starting a standalone version of WCC, and then the Component Wizard window will display:
All of the WCC Components are listed. Click the Add… button to create the new component:
Enter the Name, leaving the remaining fields unchanged and click OK:
Click the Add button to add our dynamic html resource:
By default Resource – HTML Include/String is checked, which is what we want. The default file name and Load Order is fine as well (Load Order is from lowest to highest – system resources (that we are extending) have load order 1). Click Next>:
A default include is created in the resource file, based on the component’s name. Change the Name field to std_html_head_declarations, and the html include:
The include allows for the inclusion of the original dynamic include – and we need all of its goodness on the page.
Click Finish. On the Options menu, select Enable. Your component is now complete and active in the WCC instance. You must restart WCC for the component to take effect.
When WCC is restarted, login to the native UI. Inspecting the source code reveals our test comment in the correct location:
This is in Chrome, so you'd better test IE as well:
Returning to the ComponentWizard, click on the std_html_head_declarations in the HTML Includes tab and then click the Edit button. In the HTML Resource window, replace the test comment with:
<!--[if gt IE 8]>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
Click OK. Restart WCC. Login. The page content is now:
Exporting this component to other WCC instances
Often components are created on a development server and need to be exported to production environments. In the ComponentWizard, click on Build… on the Build menu, and click OK. In the component directory (…/ucm/cs/custom/IECompatHead) IECompatHead.zip is the zipped component archive that can be copied to other WCC instances. In the Admin Server, on the Advanced Component page, this zip file is uploaded to the WCC instance.