How to use the Resource Center to link out to an external website
One way you can utilize your resource center is by creating modules that link out to important sites that your customers may find useful.
For example, I may want to have a module called "Pendo Academy" and that links out to https://academy.pendo.io/
In the screenshot below, when users click on "Pendo Academy" it immediately opens up a new tab to our training center.
- Here's a video on how to do it.
- Link to Github information.
17
コメント
Is there any way to remove the caret when linking out to a new tab/window? It's a confusing user experience as one expects to drill into the module like the others. Or replace a caret with a symbol indicating new tab would work too.
Hey Eric Miller, I don't think so, nothing at the moment at least.
Reposting for Doug McDaniel:
!importanttag on it.I am not aware of a place in the Visual Designer to edit the CSS of the Resource Center home view.
Howard Lio Angus Yang Eric Miller You can definitely hide the caret. Go to https://app.pendo.io/in-app/guides and click on global settings. From there you can edit the global Pendo css to do whatever you want (or to destroy everything if you're not careful).
Just explore the client side code and be creative with your CSS selectors.In our case we changed the caret icon and added an icon to the left of each module in the resource center. Just for inspiration, here we are adding some room for the module icon for a specific module:
I've got a new issue related to this topic. We had a module configured to link to an external webpage in a new tab and it worked fine UNTIL we changed the activation setting for the Resource Center itself to reopen when changing pages. Now what happens when I click the module/link is the new tab opens, back in the original tab the Resource Center closes (even though it was supposed to stay open) the when I click any links within my app UI the Resource Center pops open and triggers that new tab to open a second time. Not a desirable user experience. I am looking at the javascript and it seems there is a section about returning the RC to its home state which I am suspecting is part of the issue. Does anyone know how to customize this code to be compatible with the reopening activation setting? Doug McDaniel?
Edit: We have found this issue only happens in some of our apps, but not others. Not sure why the behavior varies.
Current code (as per Github):
(function resourceCenterOpenURL() {if (!pendo.designerEnabled) {
document.getElementById('pendo-resource-center-container').setAttribute('style', 'display:none');
window.open("https://help.abc.com/hc/en-us/requests/new",'_blank'); /* Replace https://example.com/ with your desired external URL */
step.eventRouter.eventable.trigger('pendoEvent', {
action: 'returnToResourceCenterHome'
});
setTimeout(function(){
pendo.onGuideDismissed(pendo.BuildingBlocks.BuildingBlockResourceCenter.getResourceCenter().steps[0]);
}, 250);
}
})();
Change the setTimeout value (the 250) to a much smaller number, like 25, and that should fix it. Don't forget to push to staging and/or prod to see the change :) I forget all the time.
Thanks Liz Feller I tried lowering the setTimeout value but with no success. My RC still closes (even though activation is set to stay open) after I click the external link. Then when I return and navigate in my app, the next click triggers a reopen of that external link and a warning from Chrome that a pop-up has been blocked.
I wanted to update the thread with some new info. Through some help from Pendo Professional services I learned of a solution to my problem AND an improvement for how this module functions. The code currently in Github linked to in the original post results in the Resource Center closing after the user clicks the external link module. It does this immediately even though the user has not navigated to a new page AND if you have your RC activation setting to reopen the RC when changing pages, this default closing behavior is in opposition to that setting. So, the following code both fixed our glitch with the link reopening a second time when navigating our app AND it also keeps the RC open after the external link is clicked.
(function resourceCenterOpenURL() {
if (!pendo.designerEnabled) {
window.open("https://example.com/", '_blank'); /* Replace https://example.com/ with your desired external URL */
pendo.onGuideAdvanced();
pendo.showGuideById("GuideID"); /* Replace GuideID with the Guide ID for your specific Resource Center */
}
})();
Instructions on how to get the unique RC ID for your app:
Enable the Guide Debugger on a page with the Resource Center (Open console > pendo.enableDebugging() )
Open the Debugger (ladybug icon in top left) and go to “Resource Center”
Grab the ID from the “Home View” area listed in that expanded area
Disable the Debugger after this (Open console > pendo.disableDebugging() )
Cut and paste that ID in place of the GuideID that was in the sample code provided.
This is my favorite thing for September. Thank you, Angus.
This is also my favorite thing in September Nikki Murray!
Way to go Eric Miller for sharing this example with others in the thread and in the Community!
Both versions of this do the weirdest thing for me. If I follow these steps, suddenly all of the links on my whole site will launch the targeted URL. It's as if every action taken anywhere triggers the snippet, but I can't figure out why.
Has anyone else encountered this problem?
I'm using this code but I don't want to open in a new tab. I removed the "_blank" but it's still opening in a new tab. What am I missing?
(function resourceCenterOpenURL() {
if (!pendo.designerEnabled) {
document.getElementById('pendo-resource-center-container').setAttribute('style', 'display:none');
window.open("https:#home/training"); /* Replace https://example.com/ with your desired external URL */
step.eventRouter.eventable.trigger('pendoEvent', {
action: 'returnToResourceCenterHome'
});
setTimeout(function(){
pendo.onGuideAdvanced();
}, 250);
}
})();
サインインしてコメントを残してください。