+ Start a Discussion
MohsinWadeeMohsinWadee 

Build a Branded Chat - Test Your Chat Step

Can someone please give the complete Visualforce page code? Cannot get mine to work.
MohsinWadeeMohsinWadee
Have nothing to share, just wanted to know if anyone managed to complete this step? They give a template which you have to complete - which is strange because this is in an admin stream, not a developer stream, and I have no knowledge of the Chat api.
MohsinWadeeMohsinWadee
Hi Piyush, yes, completed previous steps - Trailhead won't let you continue otherwise, I just want to check if anyone has completed this step.
MohsinWadeeMohsinWadee
Here's my code:

<apex:page >
  <h1>Let’s start chatting...</h1>
  <br />
  Click the big button to start a chat.
  <br />
  <apex:form >
  <apex:commandButton image="OnlineButton" onclick="liveagent.init('https://d.la1-c1-frf.salesforceliveagent.com/chat', '572580000008RKW', '00D58000000aRDO');"/>
  </apex:form>
  <script type='text/javascript' src='https://c.la1-c1-frf.salesforceliveagent.com/content/g/js/37.0/deployment.js'></script>
</apex:page>
EmilienGuichardEmilienGuichard
Hi Moshin,

I had it wrong also. It is written : "Paste your button and deployment code snippets below the provided labels."

So you need to copy your button code and below the deployment code.
Your page should look like some thing like that :
 
<apex:page >
  <h1>Let’s start chatting...</h1>
  <br />
  Click the big button to start a chat.
  <br />
  <!--Button Code-->
  <img id="liveagent_button_online_5730Y000000PBnF" style="display: none; border: 0px none; cursor: pointer" onclick="liveagent.startChat('5730Y000000PBnF')" src="https://nope-developer-edition.eu11.force.com/resource/1476200678000/OnlineButton" /><img id="liveagent_button_offline_5730Y000000PBnF" style="display: none; border: 0px none; " src="https://nope-developer-edition.eu11.force.com/resource/1476200712000/OfflineButton" />
    <script type="text/javascript">
    if (!window._laq) { window._laq = []; }
    window._laq.push(function(){liveagent.showWhenOnline('5730Y000000PBnF', document.getElementById('liveagent_button_online_5730Y000000PBnF'));
    liveagent.showWhenOffline('5730Y000000PBnF', document.getElementById('liveagent_button_offline_5730Y000000PBnF'));
    });</script>
    <script type='text/javascript' src='https://c.la1-c2-par.salesforceliveagent.com/content/g/js/38.0/deployment.js'></script>
<script type='text/javascript'>
liveagent.init('https://d.la1-c2-par.salesforceliveagent.com/chat', '5720Y000000PBYH', '00D0Y000000Yy8H');
</script>
  <!--Deployment Code-->
</apex:page>

 
MohsinWadeeMohsinWadee
Hi EmiIien, I realised that later, so my code is very similar to yours, and actually got further, so the popup appears when I hit my chat button, but now get an authorization error - could be our work firewall blocking it, will try at home.

User-added image
 
Emilien Guichard 37Emilien Guichard 37
Hi Moshin,

When I hit the chat button, the popup is not using my SF Site URL but this address :

https://2rj.la1-c2-par.salesforceliveagent.com/content/s/chat?language=en_US#deployment_id=5720Y000000PBYH&org_id=00D0Y000000Yy8H&button_id=5730Y000000PBnF&session_id=2c47e72e-c3de-430f-a130-83045bdf70cb

Could you please post your VF page code ?

I don't thing this is due to some firewall issue.
MohsinWadeeMohsinWadee
Hi Emilien, here's my code:

<apex:page >
  <h1>Let’s start chatting...</h1>
  <br />
  Click the big button to start a chat.
  <br />
  <!--Button Code-->
  <img id="liveagent_button_online_573580000008RjZ" style="display: none; border: 0px none; cursor: pointer" onclick="liveagent.startChat('573580000008RjZ')" src="https://mohsinw-developer-edition.eu6.force.com/resource/1476168804000/OnlineButton" /><img id="liveagent_button_offline_573580000008RjZ" style="display: none; border: 0px none; " src="https://mohsinw-developer-edition.eu6.force.com/resource/1475889417000/OfflineButton" />
<script type="text/javascript">
if (!window._laq) { window._laq = []; }
window._laq.push(function(){liveagent.showWhenOnline('573580000008RjZ', document.getElementById('liveagent_button_online_573580000008RjZ'));
liveagent.showWhenOffline('573580000008RjZ', document.getElementById('liveagent_button_offline_573580000008RjZ'));
});</script>
  
  <!--Deployment Code-->
  <script type='text/javascript' src='https://c.la1-c1-frf.salesforceliveagent.com/content/g/js/37.0/deployment.js'></script>
<script type='text/javascript'>
liveagent.init('https://d.la1-c1-frf.salesforceliveagent.com/chat', '572580000008RKW', '00D58000000aRDO');
</script>
</apex:page>
EmilienGuichardEmilienGuichard
Hi Moshin,

Looks like it is an issue with your Salesforce Site, you should check your settings according to the instructions.

Also check that the static ressource with the images is public.

The site is trying to access something something not available.

 
Jose Manuel MisaJose Manuel Misa

I can´t push the buttom

Challenge Not yet complete... here's what's wrong:
You haven't tested your chat! Please follow instructions carefully.

 

User-added image
It´s impossible to click the buttom.

Anybody can help me? Thanks in advance!

Vijay DOMINICVijay DOMINIC
Hi Jose Manuel Misa,
You can only click on the button when it is showing the online image and not the offline one. For that, you need to launch the console as the Live Agent on another tab, and set your availability to Online.
Tony SmithersTony Smithers
Hello, I have tried everything in this thread and I still cant get it to give me the online button instead of offline which you can't push.  Please help.  Thanks
Lucky123Lucky123
Hello Everyone,
I am getting the following error! Help will be greatly apperciated. 

"Challenge Not yet complete... here's what's wrong: 
You haven't tested your chat! Please follow instructions carefully"

I cannot get the online button. Please see the screen shot below. (I refreshed the browser multiple times but it did not change to "Online")User-added image


User-added image
User-added image




 
Starr LimStarr Lim
Hi @MohsinWadee, did u mange to solve it? I've got the same problem :L
Starr LimStarr Lim
In the Site page, my Active Site Home Page i set it to "MyProfilePage" I clicked the search icon and it redirects me to yes, my own profile with username. I seemed to be inside force.com.. D=  @EmilienGuichard @MohsinWadee but yea, still unauthorised when i clicked the online pic 
Jefferson FernandezJefferson Fernandez
I have the same issue. Though i was already able to test it already. Challenge said that the tab needs to be closed. I did close. But the challenge says that it is not yet tested and please follow instructions carefully. Anyone has any updates?
Jefferson FernandezJefferson Fernandez
Also, it doesn't prompt the "Save" window pop-up when closing the tab. Which #14 said that click Save if prompted. I guess this is the missing step perhaps. But why it doesn't appear the prompt. 
Jefferson FernandezJefferson Fernandez
I solved my own problem. I found out my storage usage is 117%. I deleted data and went down below 100% and it passed. Thanks
Cyrus FaustigCyrus Faustig
Hi everyone,

I have pretty much the same problem as @MohsinWadee: after pressing the "Chat with us" button, the following notification pops up: User-added image
I have no clue what to do, I have tried everything. Is there someone who knows a way out of this?

Cheers, 
Cyrus
Ainee GuevaraAinee Guevara
I'm having the same issue @Cyrus Faustig
Hope someone found a solution.

User-added imageUser-added image

Thanks,
Ainee
Greg Hoelzel 17Greg Hoelzel 17
I am having the same "Authorization Required" problem as above. Is there a solution yet? Thanks.
Lisa SouletLisa Soulet
Having the same "Authorization Required" problem. #trailhead team, please help.
Chris DuarteChris Duarte
Thanks Lisa for alerting me to this thread. 

Everyone - make sure that when you complete the section titled "Create a Chat Button" that you only fill in the Site, Online Image, and Offline Image. Filling in additional fields will cause an "Authorization Required" error when you test your chat in step 5.

I'll ask the writer to make this more explicit.

User-added image

Another thing to check is the Static Resources. Make sure when you upload each image that you set the Cache Control to Public. 
Lisa SouletLisa Soulet
This did the trick for me.  Thanks, Chris!
Patrick SPatrick S
Worked for me as well! Should anyone see this in the future, if you're like me and filled in more than the three fields above, you have to copy the button code again and paste it into the visualforce page again. Best of luck! 
Jon CartlidgeJon Cartlidge
Hello, I have managed to get the images uloaded and got through to the "Let's start chatting" page but I cannot click the button, or should I say when I click the button nothing happens. Any tips?
Andrea GibbAndrea Gibb
I was able to get passed the not authorized error message but not get this when I click test your chat. Any thoughts?

The Visualforce page <strong>Start Chatting</strong> does not exist. Please follow instructions carefully.
Kate BrownKate Brown
I have my pre-from, chat, and everything working great. Except I get a 405 error with a post-chat form. It is not in the cost of the post chat HTML file because I tried a blank file!  Any ideas? The error I get is 

Server Error
405 - HTTP verb used to access this page is not allowed.
The page you are looking for cannot be displayed because an invalid method (HTTP verb) was used to attempt access.
Emma RuefliEmma Ruefli
Hi All and Anyone who can help :-) We are due to go live with our site later today and I have an issue with the web chat styling and screens changing and case automation disappearing with the installation of custom chat buttons.  I had some assistance from Salesforce support with the web chat set up and it working. They said to follow the documentation steps for the custom chat buttons which we did and then after deploying the code the custom chat buttons, the pop up chat screen, pre-chat form and styling from the Embedded Service Deployment were replaced with a rudimentary chrome chat pop up and no pre-chat as previously configured. Cases no longer autogenerate and a chat transcript window replaces the other case/chat configuration. We don't know why this happened but need URGENT assistance here.
 
We can delete the code and go back to the standard included buttons with embedded chat but we don't understand why this happened and why we can't connect it to our custom chat button.
 
These are the steps we followed:
1. Followed Salesforce Documentation Instructions to install Custom Chat Buttons.
2. Added Chat Button Code to Staging Site Pages.
3. Added Chat Deployment Code (Javascript) to Staging Site Pages - this finally changed the button but then replaced the other components.
 
There were no error message just complete change. Documentation reads as though embedded chat is an extension of Live Agent. Are they two different things?
Thanks for anything you can offer.
Emma