Rich-text Reply

HTML editor is not accepting my script

dkhanal 08-13-14

HTML editor is not accepting my script

[ Edited ]

I'm trying to turn a link into a "LeadBox", which is basically just a pop up modal. 

 

The code for doing that is: 

 

<a href="https://my.leadpages.net/leadbox/144cd3073f72a2%3A15d502426b46dc/5759826290278400/" target="_blank">
 
Text of your Link Here
 
</a><script type="text/javascript" src="//my.leadpages.net/leadbox-757.js"></script>

 

 
Note the
 
<script> 
 that is needed for the leadbox to pop up as a modal. 
 
I tried to add it by clicking on the existing link, hitting Edit HTML, and replacing the existing link with the above code (anchor tag plus script tacked on at the end.
 
But optimizely either throws me an error: 
"Screenshot_8_12_14__2_13_PM.png
 
Or it simply removes the <script> sometimes. But it doesn't successfully make this work (tested in preview mode and the leadbox opens as a new tab, not as a modal)
 
Any thoughts on how I add this little JS snippet?
Level 2

Amanda 08-13-14
 

Re: HTML editor is not accepting my script

Hi there! Have you tried the tactic descibed in the article descibing how to add external JavaSctipt to you variation code

 

Due of a "feature" of jQuery -- it's not possible to insert a script tag into the DOM as a string. Luckily, however, you can work around this by first creating the tag as an object, then appending that object instead of your string. 

 

$(function(){var fileRef = document.createElement('script'); fileRef.setAttribute("type","text/javascript"); fileRef.setAttribute("src", "http://www.example.com/test.js"); document.body.appendChild(fileRef);});

 Let me know if this does the trick for you or if you have any additional questions. 

Optimizely
adzeds 08-13-14
 

Re: HTML editor is not accepting my script

Be interested to see if that works.

 

Might have another work around if required.

David Shaw
Level 11
MJBeisch 08-13-14
 

Re: HTML editor is not accepting my script

I would guess that you can use jQuery's .getScript() instead of a script tag. jQuery documentation here:

 

http://api.jquery.com/jquery.getscript/

Matt Beischel - E-Commerce Optimization Specialist CohereOne

Level 2
dkhanal 08-13-14
 

Re: HTML editor is not accepting my script

This solution ended up getting rid of the Javascript error but it still doesn't open up the modal on the page...the modal opens up in a new tab. Suggesting the script didn't load properly.
Level 2
Amanda 08-14-14
 

Re: HTML editor is not accepting my script

[ Edited ]

Hey @dkhanal - I was just playing with this on a test site of mine and I managed to get it working in an experiment. You can see in the attached screenshot that the script is loaded and that the modal is showing up on screen. I listed the code I used below for reference.  Does this work for you? (Obviously you'll need to adjust the h1 selector and the text of the link.

 

If it still doesn't work, can you post your wesbite URL where you are trying to add this leadbox? 

 

$("h1").append("<div id=\"optimizely_344307963\">...</div>");
$("#optimizely_344307963").replaceWith("<div id=\"optimizely_344307963\"><a href=\"https://my.leadpages.net/leadbox/144cd3073f72a2%3A15d502426b46dc/5759826290278400/\" target=\"_blank\"> Text of your Link Here</a></div>");
$(function(){var fileRef = document.createElement('script'); fileRef.setAttribute("type","text/javascript"); fileRef.setAttribute("src", "//my.leadpages.net/leadbox-757.js"); document.body.appendChild(fileRef);});

 Screen Shot 2014-08-13 at 9.04.48 PM.png

Optimizely