SuccessFactors LMS is one such exciting solution which keeps clients as well as its employees engaging thru out the year. Recently, we got a requirement which has something to do with JavaScript code embed into custom tile. As we all know, there is a limitation in SuccessFactors, you cannot have JavaScript embedded in custom tiles, which is planned for next releases (no confirmation yet)
We took this opportunity as a challenge and went ahead; the scenario was – placing a custom tile on LMS home screen that populates Reddit RSS JavaScript posts feed.
As we are aware of the fact, tiles don’t support JavaScript or CSS, we spent good time on researching the possibilities and found an exciting post in one of the Java forums, the post was talking about how to convert JavaScript to Html code. There were lot of comments, people posted many software’s/applications, but, none of the suggested ways worked. But, eventually, gave us a positive energy and made us to dig more based on their suggestions.
We finally found a solution that would have saved more than 75% of our time, had been someone posted in the forums. Still, we got to know, our god “Google” was the solution for this. Shocked? But true.
Let me tell you the process on how we accomplished the goal!!
Step 1:
Firstly, we went to www.reditt.com and searched for the posts that are tagged with “JavaScript” – Fig. 1
Fig. 1
Step 2:
Now, I need a place where I could generate a code for a RSS widget, should not cost a penny ?, remember, I am not a coding geek, started looking for some online websites that could give us a code for the widget with given dimensions.
We found http://www.surfing-waves.com/feed.htm , a gold mine to generate code for RSS feed widget.
Surfing Waves was very simple to handle, the site just needs the RSS feed, dimensions and colour format, that’s it, your code is ready – Fig. 2
Fig. 2
Step 3:
So now we have most of the things ready, we have JavaScript code, we have preview, dimensions etc.
You will see the magic of google, how we converted JavaScript to html – right click on the preview generated by surfing wave as show in the Fig. 3 and click on Inspect.
Fig. 3
On the elements tab, you can easily catch hold of the html code of the widget – Fig.4
Fig. 4
Step 4:
Now log into SuccessFactors LMS, Go to Admin --> System Admin --> Configuration --> Land Page Settings --> Create Custom Tile
Fill the details in Step 1 – Tile Settings --> Tile Name, show tile for this group, etc. – these steps depend on how you plan.
Next on Step 2 – Configure Content --> Give a Title to the tile (here I gave “JavaScript Feed”), give a crispy description – Fig. 5
Finally, select “Source” and paste the code copied from google element tab.
Fig. 5
With JavaScript Code With HTML Code
Fig. 6
Yep! You are done!! You will be able see a lovely custom tile feed floating every 2 seconds (I made minor change, feed was floating every 6 seconds, changed it to 2) – Fig. 6
Still not convinced just play the below YouTube video to see it live ?
This is one of the samples, but, I feel, we can have workarounds for most of the requested scenarios. We have to ensure to keep an eye on the latest trends, tip & tricks around the corner and plan to utilize where-ever required.
Happy Blogging!!
Note: Remember, this blog intended to keep you know the possibilities on how a SuccessFactors consultant can convert a JavaScript code to html with very basic knowledge on html and google. We can use this kind of scenario, when you don’t have any option left but to solve the problem. Yes, you can have the code directly written on html, but, do remember, we are not coding geeks and not many clients have coding team in place.
We took this opportunity as a challenge and went ahead; the scenario was – placing a custom tile on LMS home screen that populates Reddit RSS JavaScript posts feed.
As we are aware of the fact, tiles don’t support JavaScript or CSS, we spent good time on researching the possibilities and found an exciting post in one of the Java forums, the post was talking about how to convert JavaScript to Html code. There were lot of comments, people posted many software’s/applications, but, none of the suggested ways worked. But, eventually, gave us a positive energy and made us to dig more based on their suggestions.
We finally found a solution that would have saved more than 75% of our time, had been someone posted in the forums. Still, we got to know, our god “Google” was the solution for this. Shocked? But true.
Let me tell you the process on how we accomplished the goal!!
Step 1:
Firstly, we went to www.reditt.com and searched for the posts that are tagged with “JavaScript” – Fig. 1
Fig. 1
Step 2:
Now, I need a place where I could generate a code for a RSS widget, should not cost a penny ?, remember, I am not a coding geek, started looking for some online websites that could give us a code for the widget with given dimensions.
We found http://www.surfing-waves.com/feed.htm , a gold mine to generate code for RSS feed widget.
Surfing Waves was very simple to handle, the site just needs the RSS feed, dimensions and colour format, that’s it, your code is ready – Fig. 2
Fig. 2
Step 3:
So now we have most of the things ready, we have JavaScript code, we have preview, dimensions etc.
You will see the magic of google, how we converted JavaScript to html – right click on the preview generated by surfing wave as show in the Fig. 3 and click on Inspect.
Fig. 3
On the elements tab, you can easily catch hold of the html code of the widget – Fig.4
Fig. 4
Step 4:
Now log into SuccessFactors LMS, Go to Admin --> System Admin --> Configuration --> Land Page Settings --> Create Custom Tile
Fill the details in Step 1 – Tile Settings --> Tile Name, show tile for this group, etc. – these steps depend on how you plan.
Next on Step 2 – Configure Content --> Give a Title to the tile (here I gave “JavaScript Feed”), give a crispy description – Fig. 5
Finally, select “Source” and paste the code copied from google element tab.
Fig. 5
With JavaScript Code With HTML Code
Fig. 6Yep! You are done!! You will be able see a lovely custom tile feed floating every 2 seconds (I made minor change, feed was floating every 6 seconds, changed it to 2) – Fig. 6
Still not convinced just play the below YouTube video to see it live ?
This is one of the samples, but, I feel, we can have workarounds for most of the requested scenarios. We have to ensure to keep an eye on the latest trends, tip & tricks around the corner and plan to utilize where-ever required.
Happy Blogging!!
Note: Remember, this blog intended to keep you know the possibilities on how a SuccessFactors consultant can convert a JavaScript code to html with very basic knowledge on html and google. We can use this kind of scenario, when you don’t have any option left but to solve the problem. Yes, you can have the code directly written on html, but, do remember, we are not coding geeks and not many clients have coding team in place.
- SAP Managed Tags:
1 Comment
