1 Reply Latest reply: Feb 12, 2013 10:16 AM by Daniel Merchán RSS

    wireframes to portal look and feel


      i am working on a webcenter portal application.

      as usual, we have got wireframes (html prototypes) from customer which has html, js and css files.

      now i have to produce same kind of look and feel on webcenter portal.

      please suggest what shall i do?

      is this recommended way?

      i copy content of css file which i got as part of wireframes into portal-skin.css file, now i use html components (div, ul, li, p etc) in page template and other jspx pages (reference could be the html files which i got in wireframes).

      please suggest.
        • 1. Re: wireframes to portal look and feel
          Daniel Merchán

          You can select two ways:
          - Continue with your HTML + CSS and create templates based directly on wireframes. Faster and easier solution for non-adf people.
          - Translate your wireframes to a ADF Templates and use ADF Skinning to achieve the styles. Slower and hard if you don't have much experience with it.

          About the solution of maintain HTML + CSS:
          - Maintain your structure of CSS, images and JS in separated folders of skin folder (In Web Content or in project PortalWebAssets).
          - In Skin files (like portal-skin.css) change ADF Skinning of components only. Is the best way to maintain the hierarchy of adf skins.

          About the solution full ADF:
          - Read this document about full ADF Skin and Templates: http://www.oracle.com/technetwork/middleware/webcenter/portal/learnmore/pagetemplates-1438595.pdf

          More info:
          - In adf-config.xml you can provide rewrite rules to search your static-files when you are using Web Server (OHS) to server static-files.

          I hope this help you.