Redefining Springboards with Tools

Oracle Cloud Applications Common Technologies and User Experience Release 12

The key for personalizing the Springboard is to ensure that the landing page looks intriguing

to the target population for their immediate attention. There are tools for user experience

design from configuring content, layout, to a new look and feel of the Oracle HCM Cloud.

This how-to guide demonstrates the use of Page Entry, Page Integration Wizard and

Widgets. The table below shows the possible configuration options.

Page Entry Page Integration

Wizard* HTML Markup

Custom Icon N N Y

Role Access Security Y (EL Expression) Y Y (Layer)

Personalize Springboard at User Level Y Y N

Sandbox Migration Y Y Y

Hardcode URL (host:port, not

EndPointProvider)

Y (except Landing Pages,

Third Party Applications) Y

Y (except Landing Pages,

Third Party Applications)

Deep Links Utilization Y N Y

Open New Tab/Window Y N Y

Add Tabs to New Pages N Y N

Translation N N N

*Page Integration - Some content cannot be displayed in a frame; Fusion Application is using a secure connection (i.e. https) that you are unable to embed a url that uses insecure connections (i.e. http://....). Add Tab to Existing Page is subject to the jazn entries of the product to launch the "Add Tab" task.

F E A T U R E H I G H L I G H T S

Changing the Layout

Adding Web Page

Embedding Clock Widget

Embedding YouTube Video

Embedding Twitter Widget

C O N N E C T W I T H U S

blogs.oracle.com/oracle

facebook.com/oracle

twitter.com/oracle

oracle.com

Copyright © 2017, Oracle and/or its affiliates. All rights reserved. Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their respective owners. 0117

Pag

e2

Setup Instructions

1. Create a New Hire Flow for a specific business function to facilitate Hire an

Employee, Payroll Costing, Personal Payment Methods data entry

2. Create an Orientation Induction Flow for integrated 3rd party resources to facilitate

the onboarding process

3. Create widgets for world clock and twitter plus youtube video

Step 1: Sandbox (Navigator) Tools > Structure > Create: Create Page Entry

- enter Destination using Deep Link ‘Hire an Employee’

https://host:port/fndSetup/faces/deeplink?objType=HIRE_AN_EMPLOYEE

- restrict Visibility using EL Expression for access control

#{(securityContext.userInRole['ORA_PER_HUMAN_RESOURCE_SPECIALIST_JOB'])}

- enter Destination for Quick Actions

#{EndPointProvider.externalEndpointByModuleShortName['hcmCore']}/faces/FuseWelcome?pageParams=infoletCategoryNamehcm_quick_actions&infoletCategoryName=hcm_quick_actions

Step 2: (Navigator) Tools > Security Console > Create Role

- choose category Common – Job Roles for the new application role

Copyright © 2017, Oracle and/or its affiliates. All rights reserved. Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their respective owners. 0117

Pag

e3

Sandbox (Navigator) Tools > Page Integration > New Page

- if first time ever, create umbrella category New Pages - select the newly created application role - enter Web Page destination (SSO enabled sites in this use case)

https://my.oracle.com/site/hr/LearningDevelopment/index.html

- click open new page name to add tabs

- select Add Tab

Copyright © 2017, Oracle and/or its affiliates. All rights reserved. Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their respective owners. 0117

Pag

e4

- enter Web Page destination

https://otube.oracle.com/

- select Add Tab

- enter Web Page destination

https://oracle.myhbp.org/hmm12/home.html

(Navigator) Tools > Structure

- search Orientation Induction, select View Hierarchy - move to Top Level - choose Home (may require logout/login to reflect the changes)

Copyright © 2017, Oracle and/or its affiliates. All rights reserved. Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their respective owners. 0117

Pag

e5

- select Orientation Induction access card - choose Customize Pages

- in Design view, pull handle to resize (note: you can change the page layout by adding new

content)

- adjust handle to resize the 2nd tab

Copyright © 2017, Oracle and/or its affiliates. All rights reserved. Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their respective owners. 0117

Pag

e6

- adjust handle to resize the 3rd tab

Step 3: Sandbox (Navigator) Home > Customize Pages > Source View

- choose Add Content then Components

Copyright © 2017, Oracle and/or its affiliates. All rights reserved. Oracle and Java are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their respective owners. 0117

Pag

e7

- in Design View, edit HTML Markup

HTML Markup

<!DOCTYPE html> <html> <body> <table cellspacing="20"> <thead> <tr> <th class="fluid"><!-- clock widget start --> <script type="text/javascript"> var css_file=document.createElement("link"); css_file.setAttribute("rel","stylesheet"); css_file.setAttribute("type","text/css"); css_file.setAttribute("href","//s.bookcdn.com//css/cl/bw-cl-200x24.css"); document.getElementsByTagName("head")[0].appendChild(css_file); </script> <div id="tw_9_446458129"><div style="width:200px; height:270px; margin: 0 auto;"><a href="http://booked.net/time/paris-18145">Paris</a><br/><a href="http://booked.net/time/london-18114">London</a><br/><a href="http://booked.net/time/new-york-18103">New York</a><br/><a href="http://booked.net/time/san-francisco-18163">San Francisco</a><br/><a href="http://booked.net/time/tokyo-18247">Tokyo</a><br/><a href="http://booked.net/time/hong-kong-19668">Hong Kong</a><br/><a href="http://booked.net/time/sydney-30285">Sydney</a><br/><a href="http://booked.net/time/auckland-18049">Auckland</a><br/><a href="http://booked.net/time/bangalore-18033">Bangalore</a><br/><a href="http://booked.net/time/dubai-18321">Dubai</a><br/></div></div> <script type="text/javascript"> function setWidgetData_446458129(data){ if(typeof(data) != 'undefined' && data.results.length > 0) { for(var i = 0; i < data.results.length; ++i) { var objMainBlock = ''; var params = data.results[i]; objMainBlock = document.getElementById('tw_'+params.widget_type+'_'+params.widget_id); if(objMainBlock !== null) objMainBlock.innerHTML = params.html_code; } } } var clock_timer_446458129 = -1; </script> <script type="text/javascript" charset="UTF-8" src="https://widgets.booked.net/time/info?ver=2&domid=209&type=9&id=446458129&scode=124&city_id=18145,18114,18103,18163,18247,19668,30285,18049,18033,18321&wlangid=1&mode=1&details=0&background=eae2af&color=315e27&add_background=3a15a1&add_color=eae2af&head_color=ffffff&border=0&transparent=1"></script> <!-- clock widget end --></th> <th class="fluid"><iframe width="550" height="300" src="https://www.youtube.com/embed/t6lOBGAHh8s?list=PL7hIB-VFIAoOJboQyqqx-_TxHGreKjKUa" frameborder="0" allowfullscreen></iframe></th> <th class="fluid"><div style="display: inline-block;"><a class="twitter-timeline" href="https://twitter.com/OracleHCM" data-width="300" data-height="300">Announcement</a> <script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script></div></th> </tr> </thead> </table> </body> </html>

Further Reference:

Getting Started with Customizations

Customizing the Applications for Functional Administrators

Extending the Applications for Functional Administrators

PaaS-SaaS Integration