Forum Discussion

mmaillot's avatar
mmaillot
Contributor
12 years ago

Oracle Live Help on Demand chat link integration in a FAQ

Hi all,

 

I currently am looking for a way to integrate a chat invitation link within a FAQ article. Our chat product is provided by Oracle.

 

Usually, here is the way we proceed in a HTML page:

  • Include this tag in the header
<script type="text/javascript" src="http://as00.estara.com/as/InitiateCall2.php?accountid=value_of_our_oracle_accountID"></script>

 

  • Include this code in the body where we want the link to appear
<a href="javascript&colon;webISChatPop('Template=template_id');"><img src="http://as00.estara.com/webcare/public/linkimage.php?ulbid=value_of_our_ulbid" border="0" alt="Click to Chat"/></a>

 

I willingly hide the different technical IDs such as accountID, templateID and ulbID. I can provide you with real IDs when in private mode for debugging purposes.

 

I succed in including the tag in the header.

But when trying to include the link in the FAQ article, I am facing difficulties. When editing the article in HTML, here is what I enter:

<p>Content of the article</p>
<p>Blah</p>
<p>blah</p>
<p>blah.</p>
<p>&nbsp;</p>
<p>Here is the beginning of the link.</p>
<p><a href="javascript&colon;webISChatPop('Template=template_id');"><img src="http://as00.estara.com/webcare/public/linkimage.php?ulbid=value_of_our_ulbid" border="0" alt="Click to Chat"/></a></p>
<p>Here is the end of the link.</p>

 

Then, I save and publish the article.The link appears, but it is not clickable as it should be.

When editing my article again, here is the HTML code I get:

<p>Content of the article</p>
<p>Blah</p>
<p>blah</p>
<p>blah.</p>
<p>&nbsp;</p>
<p>Here is the beginning of the link.</p>
<p><a href="/t5/tkb/articleeditorpage/tkb-id/FAQachat/message-uid/javascript&amp;colon;webISChatPop('Template=template_id');"><img src="http://as00.estara.com/webcare/public/linkimage.php?ulbid=our_ulb_id" border="0" alt="Click to Chat" /></a></p>
<p>Here is the end of the link.</p>

 

As you can see, the link is modified, thus, it cannot work.

I encounter the same issue while trying to include another kind of JS link.

 

Is there any way to explicitely tell the html editor to ignore that kind of link and not try to modify the link?

 

Best regards,

Michael.

2 Replies

  • DougS's avatar
    DougS
    Khoros Oracle
    12 years ago

    Not sure if you are trying to do this in a message post or not, but Lithium is pretty restrictive about allowing that kind of stuff in a message post, mainly to prevent cross-site scripting (XSS) attacks.  

     

    For this type of an itegration, where javascript needs to be added to the page, you'll most likley want to use Lithium Studio to build some custom components that add the chat functionality.  You can take a look at some of the code samples on the dev nation main page to see some example components.

     

    If that's what you are currently doing, great.  It looks like using the html-escaped colon might be the problem:

     

    <a href="javascript&colon;webISChatPop

     

    You should use a non-escaped colon instead:

     

    <a href="javascript&colon;webISChatPop('Template=template_id');">

     

    A little better would be using the onclick attribute:

     

    <a href="#" onclick="webISChatPop('Template=template_id'); return false;">

     

    Even better than that, use javascript in your .js file that adds an onclick event to your hyperlink -- say your markup was this:

     

    <a href="#" id="chat-link-1">my link</a>

     

    Then you could add something like this in your .js file:

     

    var startChat = new function() {
      webISChatPop('Template=template_id');
    };
    
    var myLink = document.getElementById("chat-link-1");
    
    if (myLink.addEventListener) {  // all browsers except IE before version 9
      myLink.addEventListener("click", startChat, false);
    } else {
      if (myLink.attachEvent) {   // IE before version 9
        myLink.attachEvent("click", startChat);
      }
    }

     

    That will dynamically add an "onclick" event to the link.  We use freemarker and JQuery at Lithium -- if you want to add a script via a custom freemarker component, we give you the <@liaAddScript> directive which you can use in custom components to add javascript that will run near the bottom of the page -- here is a code snippet that adds the link, then adds an onclick event using jquery:

     

    <#assign image_alt_text = text.format("custom.chat.image.alt_text") />
    <a href="#" id="chat-link-1"><img src="http://as00.estara.com/webcare/public/linkimage.php?ulbid=value_of_our_ulbid" border="0" alt="${image_alt_text}"/></a>
    <@liaAddScript>
      ;(function($) {
        $("#chat-link-1").click(function(event) {
          webISChatPop('Template=template_id');
          return false;
        });
      })(LITHIUM.jQuery);
    </@liaAddScript>
    

     

    I hope that helps!

     

    -Doug

     

  • mmaillot's avatar
    mmaillot
    Contributor
    12 years ago

    Hi Doug,

     

    Many thanks for your reply. I also work on the creation of a module via Studio with a colleague. I agree with you, this seems to be a better way to embed that kind of link. I will keep you posted when we are done.

     

    Best regards,

    Michaël.