WebCenter ADF Twitter Bootstrap Theme

WebCenter ADF Twitter Bootstrap Theme

With data binding and visualization capability, Oracle ADF provides a foundation to extend self-service and other capability to end users via a J2EE system. Natively ADF supplies a particular default look and feel to any components within a page via CSS generated within the service side application. When extending experiences to external parties organizations will gain benefit from the ADF’s basic capabilities, but will generally want to adjust the user interface to something that is appropriate for their given audience.

The following example ADF Template & Skin is by no means an exhaustive package, but attempts to take basic elements from Twitter’s infamous Bootstrap UI Framework and apply it to a WebCenter application. The attempt is a sample proof that highlights key elements of what is required to make this possible.

You can download the theme at the bottom of this post.

Each page within the sample highlights some of the various styling capabilities for various components. Additionally, it supplies a minimalistic page template with bare-bones ADF layout components. Styling occurs within the ADF Skin, as well as via an external style sheet that leverages what is supplied by Twitter Bootstrap.

Download WebCenter Portal ADF Bootstrap Theme