Button with URL Link using Wildcard
I'm attempting to create a URL link via a button on a guide for 'Take Me There'. However, my wildcard within the URL link is not working as expected. I've followed the wildcard guidelines in other documentation listed on the site.
Example:
https://blah.infovisa.com/<Client>/Contact/Update
Where <Client> is replaced by each Client's ID.
I've replaced <Client> in my URL link with *.
Current:
https://blah.infovisa.com/*/Contact/Update
However, upon clicking the button within the guide, the wildcard is not replaced and the page is not found. This simply redirects to:
https://blah.infovisa.com/*/Contact/Update
3
Comments
I've also tried the following:
https://*/*/Contact/Update
This redirects to:
https://%2A/*/Contact/Update
Hi Brandon Tipton I was once stuck in the same situation, here is the solution I used to generate dynamic url using the pendo account name metadata, which might not be the case for you but the code below can be modified to handle the case.
Step 1: Add a code block to the step where you have the button to redirect the user.
Step 2: Use the code below in javascript tab of the code block section.
JS Code
(function wireNextGuideButton(step) {
step && step.attachEvent(step.guideElement[0], 'click', function(e) {
// Get the button id to add in place of your_button_ID after #
var advanceButton_1 = pendo.dom(e.target || e.srcElement).closest('#your_button_ID');
if (advanceButton_1.length) {
// get the desired metadata value to be used ahead in the URL using pendo.getSerializedMetadata.
var client_id = pendo.getSerializedMetadata().your_desired_metadata;
// build your URL by using the account name metadata directly.
var newurl = "https://blah.infovisa.com/" + client_id + "/Contact/Update"
//Finally dismissing the current guide to trigger the permalink.
pendo.onGuideDismissed();
// Use the below line to open the dynamic permalink url in a new browser tab
window.open(url, '_blank').focus();
// Uncomment to use the below line to open the dynamic permalink url in the same browser tab after refreshing the page.
// window.open(newurl, "_self");
}
});
})(step, guide);
if in case you need any more help then you can reach out to me on LinkedIn
works great. thanks!
Hi Rohit, what HTML and CSS should I be using for the code block? I have sent you a connect via LinkedIn when you have a chance.
Outpace Administrator No HTML/CSS is required as this code allow you to use the standard button provided in your designer.
Hello I'm trying to use your solution Rohit Pandey , but it keeps failing. I'm not sure about what I should put in the URL field of the designer. What URL should I be using? Here's the JS after I modified to my case. What did I do wrong?
(function wireNextGuideButton(step) {
step && step.attachEvent(step.guideElement[0], 'click', function(e) {
// Get the button id to add in place of your_button_ID after #
var advanceButton_1 = pendo.dom(e.target || e.srcElement).closest('#25fc25a0');
if (advanceButton_1.length) {
// get the desired metadata value to be used ahead in the URL using pendo.getSerializedMetadata.
var visitorId = pendo.getSerializedMetadata().visitorId;
// build your URL by using the account name metadata directly.
var newurl = "https://app.coreview.com/usercard/" + visitorId
//Finally dismissing the current guide to trigger the permalink.
pendo.onGuideDismissed();
window.open(newurl, "_self");
}
});
})(step, guide);
Hi Nadita Amalia
you are missing the last part in the URL, if you want to launch a guide when user clicks on the button the you need to add the guide id at the end of the url like the following example below.
You can find your guide id in the url or if you click on the 3 dots menu by clicking on the permalink option in the dropdown on the right top corner of the guide page in pendo.
Please sign in to leave a comment.