Quantcast
Channel: SAP Enterprise Portal
Viewing all articles
Browse latest Browse all 218

Javascript to change the portal title or to add meta tags

$
0
0

In some situation you may want to change the title of the portal page. OR you may want to change the link, meta tags, etc..

One way to do is to identify the correct place where you have to change this, and make it work. Say for example, changing the title of SAP EP, will change title in all portal pages. If you don't want to change system wide, and only you want to change it in particular page, you can follow this example.

 

In my requirement, I had to change my Logo, text's in portal logon page. For that i developed/deployed the custom logon on page from the standard war files.

 

And used these commands to make it work.

 

Added these (below mentioned commands) java-script commands in <script></script> section of the logon.jsp / logonmobile.jsp files.

In this case i was not able to locate the <head></head> tag in my page, because it was getting derived from EP framework level.

 

To change Title of the logon page :

 

document.title = "My title";

 

And to Add link element in head section of the html page i used this command.

 

var l1 = document.createElement("link");

l1.rel = "icon";

l1.sizes = "196x196";

l1.href = "<%=webpath%>layout/android-touch-icon-Mobility-196x196.png";

document.getElementsByTagName('head')[0].appendChild(l1);

 

To Add Meta tag


var m1 = document.createElement("meta");

m1.name = "mobile-web-app-capable";

m1.content = "yes";

document.getElementsByTagName('head')[0].appendChild(m1);

 

To know the details about why you have to add such tag's, you can find it in this links:

 

For Apple - Mobile WebApp :

 

https://developer.apple.com/Library/ios/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html

 

For Andriod

 

https://developer.chrome.com/multidevice/android/installtohomescreen

 

Similar way, you can also change the favicon

 

Refer this page for details about it : stackoverflow.com/questions/260857/changing-website-favicon-dynamically

 

Other useful links :

5 Tips for Turning Your Website Into an iOS Web... – Chief Creative Mechanic

 

In this case i was not able to locate the <head></head> tag in my page, because it was getting derived from EP framework level. So i had to use the above mentioned method of adding, link, meta tags to the <head> section of the page.

 

In some other case, (Say in Fiori home page, launchpad page,) you want to add such details, you can directly add them as per the developer.apple or developer.chrome links given above.

 

Hope this helps to create custom bookmark of SAP portal logon in Android, iOS and other mobile apps, and web-browser bookmarks with custom pictures.

Thanks for reading.


Viewing all articles
Browse latest Browse all 218

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>