How can I customize the top bar to automatically open when the page loads? | Community
Skip to main content

How can I customize the top bar to automatically open when the page loads?

  • November 14, 2021
  • 5 replies
  • 0 views

Agus12

How can I customize the top bar to automatically open when the page loads?

5 replies

Tipene
  • November 15, 2021
Hey @agus12,
 
Thanks for reaching out! 
 
You can open a top nav when the app is first loaded however you cannot do this directly from a top nav app. Top nav apps are not loaded into the DOM (and therefore available to make requests to) until they are first opened. See preloadPane for more information. 

To work around this you can make this request from an app in another location using the instances API (ticket sidebar, side nav, or ideally a background app). An example of this would be having the app locations set to both top_bar and background in your manifest
 
"location": {
    "support": {
       "background": "assets/iframe.html",
       "top_bar": "assets/iframe.html"
    }
 
Because the app is configured to also be in the background location which loads immediately, you are then able to use the background app and the instances API to pop open the top nav app automatically:
 
var client = ZAFClient.init();
var topBarClientPromise = client.get('instances').then(function(instancesData) {
  var instances = instancesData.instances;
  for (var instanceGuid in instances) {
    if (instances[instanceGuid].location === 'top_bar') {
      return client.instance(instanceGuid);
    }
  }
});
topBarClientPromise.then(function(topBarClient) {
  // opens the top bar app, even if its iframe hasn't been loaded
  topBarClient.invoke('popover');
});
 
See Messaging between locations for more information. 
 
I hope this helps! Feel free to reach out with any questions.
 
Tipene

Agus11
  • November 18, 2021

Thank you for the help,
this is very useful for me


Tipene
  • November 18, 2021
Glad I could help!
 
Have a great day,
 
Tipene

Agus11
  • November 21, 2021

can i make cti integration using ZAF and what is manifest.json location name?

thanks 


Tipene
  • November 22, 2021
Hi @agus11,
 
Yes, that's definitely something that you can do. Here's a couple of links with further information on that:
I hope this helps! Have a great day,
 
Tipene