Skip to Content
Technical Articles

Home Page Tiles ( FAQ Tile )

Hello, 

One of the great advantages of the home page tiles in SuccessFactors is the ability to use HTML coding to present whatever you want to your customers. As an administrator, you can create custom tiles and add them to the SuccessFactors home page in your instance. You can create custom tiles using an easy step-by-step configuration wizard.

Create custom content with a built-in rich-text editor, insert your own custom HTML, you can also configure the target audience and active dates when it appears on the home page. You can create up to 100 custom tiles.

I used this feature in many ways to deliver messages to my customers, and one of the best examples is using HTML code to provide FAQ as the following:

If you like to use the same process that I used,  please follow the below easy steps and resources :

  • Log in to SuccessFactors as an admin.
  • Type the transaction “ manage home …”.“ permission must be granted to use this transaction “.
  • follow the following picture:

 

Finally, I have attached the same code and tile background for you 🙂

 

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.accordion {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
}

.active, .accordion:hover {
  background-color: #ccc; 
}

.panel {
  padding: 0 18px;
  display: none;
  background-color: white;
  overflow: hidden;
}
</style>
</head>
<body>

<!–– Title ––>
<h1>Frequently Asked Questions</h1>

<!–– Questions Number 1 ––>
<button class="accordion">How can I know my leave balance ?</button>
<div class="panel">
  <p>You can do that by accessing your Profile</p>
  <p><b>Home drop down menu</b> >> <b>My Employee Profile</b> >> <b>Time Management Section</b> >> <b>Time Off Balances</b></p>
</div>
<!–– Questions Number 1 ––>

<!–– Questions Number 2 ––>
<button class="accordion">How can I cancel approved leave ?</button>
<div class="panel">
  <p>You can do that by accessing your Profile</p>
  <p>Type <b>Update time off</b> in the searching box, then click<b> Update time off</b> -  OR you can <a href="/xi/ui/ect/pages/absence/timeOff.xhtml" target="_blank"> <b>CLICK HERE</b></a> view your time off.</p>
  <p><b>locate</b> the desired leave, then click it. After that, click  <b>Edit Absence</b> >> From the bottom of the page click<b> Cancel Absence</b> >> then a workflow will be trigger for <b>cancellation approval.</b></p>
</div>
<!–– Questions Number 1 ––>


<script>
var acc = document.getElementsByClassName("accordion");
var i;

for (i = 0; i < acc.length; i++) {
  acc[i].addEventListener("click", function() {
    this.classList.toggle("active");
    var panel = this.nextElementSibling;
    if (panel.style.display === "block") {
      panel.style.display = "none";
    } else {
      panel.style.display = "block";
    }
  });
}
</script>

</body>
</html>

 

Tile background

 

Using home page tile will help you to increase your system usability and accessibility, also, using this tool to build your FAQ will help you to build full documentation for your system, I would recommend you as an administrator to the system to start using this tool.

Have a nice day,

Be the first to leave a comment
You must be Logged on to comment or reply to a post.