Home > Technical & Creative Skills > Programming, Servers & Scripts

What is my mistake? Cant make a simple JS CTA work (7)


03-22-2018 03:40 PM #1 luke_clickwalker (Member)
What is my mistake? Cant make a simple JS CTA work

Hey all ... not a coder, just a great copy/paster.

Following TheOptimizer blog, I'm trying to modify my landers to have a JS CTA,
just for the sake of having non-JS bots not click on it.

Ideally, it will initially lower CTR rates, but permit better optimizations for higher CR.

http://blog.theoptimizer.io/166/land...ling-your-roi/
http://blog.theoptimizer.io/610/how-...-using-voluum/

I tried the 2 syntaxes.

1) This one does nothing. CTA broken, when I hover over the button is displays "javascript:void(0)" indicating the URL, but button does not react.

Code:
<div>         
          <a href="javascript:void(0)" rel="#q0" onclick="exit_offer();PreventExitPop = false" class="show_hide btnyes";>Click Here</a>
               </div> 
            </pre> 
        </div>
    </div>
    </div>


    <script type="text/javascript">
     function exit_offer() {
            window.onbeforeunload=null;
            window.location = “http://my.tracker/click.php?lp=1”;
        }
  </script>

2) This one opens a new tab with the url -> http://my.landingpage.com/LP/”javascript:void(0)"

Code:
<a href=”javascript:void(0)” onclick=”exit_order();PreventExitPop = false” target=”_self” rel="#q0" class="show_hide btnyes";>Click Here</a>

</div> 
            </pre> 
        </div>
    </div>
    </div>

 <script type="text/javascript">
     function exit_offer() {
            window.onbeforeunload=null;
            window.location = “http://my.tracker/click.php?lp=1”;
        }
  </script>
I literally just copy pasted the suggested code, and changed the class= and the rel= to the ones on the actual lander.

Any suggestions?


03-22-2018 04:35 PM #2 zeno (Administrator)

The following script works fine, you may just have some issues with the quote marks being used (curly symbols as opposed to straight double quotes). Look in the above code and you can see a myriad of backward and forward-facing curly quotes, straight double quotes and so on. These will cause issues.

Make sure to paste this in something like SublimeText that can do basic syntax checking to find such issues.

The following code works fine for me:

Code:
<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
  <div>
    <a class="show_hide btnyes" href="javascript:void(0)" onclick="exit_offer(); PreventExitPop = false" rel="#q0">Click Here</a>
  </div>
  <script type="text/javascript">
     function exit_offer() {
            window.onbeforeunload=null;
            window.location = "http://my.tracker/click.php?lp=1";
        }
  </script>
</body>
</html>


03-22-2018 04:46 PM #3 platinum (Veteran Member)

It looks to me that you are trying to use this one to the questions section of your lander. Such thing should be used only on your lander's call to action button.

Case 1: Try changing it as below

Code:
<div>         
          <a href="javascript:void(0)" onclick="exit_offer();PreventExitPop = false" class="btnyes";>Click Here</a>
               </div> 
            </pre> 
        </div>
    </div>
    </div>


    <script type="text/javascript">
     function exit_offer() {
            window.onbeforeunload=null;
            window.location = “http://my.tracker/click.php?lp=1”;
        }
  </script>

Case 2: Try changing it as below

Code:
<a href=”javascript:void(0)” onclick=”exit_offer();PreventExitPop = false” target=”_self”  class="btnyes";>Click Here</a>

</div> 
            </pre> 
        </div>
    </div>
    </div>

 <script type="text/javascript">
     function exit_offer() {
            window.onbeforeunload=null;
            window.location = “http://my.tracker/click.php?lp=1”;
        }
  </script>
Note 1:
In the above script the <a> tag is referring to this js function name exit_order while the function name behind of which relies your tracker click link is exit_offer
Function name in the onclick parameter should be the same as the one we declare in the javascript snippet.

Note 2:
Be mindful of CSS classes specified in your <a> tags as the correct class added there should be the one meant for your call to action button.

Let me know if you have any further question about this


03-22-2018 04:50 PM #4 luke_clickwalker (Member)

Quote Originally Posted by zeno View Post
The following script works fine, you may just have some issues with the quote marks being used (curly symbols as opposed to straight double quotes). Look in the above code and you can see a myriad of backward and forward-facing curly quotes, straight double quotes and so on. These will cause issues.

Make sure to paste this in something like SublimeText that can do basic syntax checking to find such issues.

The following code works fine for me:

Code:
<!DOCTYPE html>
<html>
<head>
  <title></title>
</head>
<body>
  <div>
    <a class="show_hide btnyes" href="javascript:void(0)" onclick="exit_offer(); PreventExitPop = false" rel="#q0">Click Here</a>
  </div>
  <script type="text/javascript">
     function exit_offer() {
            window.onbeforeunload=null;
            window.location = "http://my.tracker/click.php?lp=1";
        }
  </script>
</body>
</html>

Hey Zeno! Officially my Sensei from the latest 6WAMC It's an honor my good Sir...

It's is a no go. CTA button does nothing.
he one with the curly-quote was the one opening a new tab with "js:void(0)". Not that it's fixed, it does nothing.
The two variants I posted are essentially the same thing (now that I see it) even still, not working.









I did swap the jquery.min.js for a vanilla one


Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>  <base href="">




<script src="jquery.min.js"></script>




<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.5">
<link rel="stylesheet" type="text/css" href="style4blue.css">        
<title>This Site Likely ...</title>






</head>


<script type="text/javascript">
        ! function() {
            var t;
            try {
                for (t = 0; 10 > t; ++t) history.pushState({}, "", "#");
                onpopstate = function(t) {
                    t.state && location.replace("http://my.tracker/click.php?lp=1&place=backfix")
                }
            } catch (o) {}
        }();
    </script>


<body>


	<script>
if (typeof(window.orientation)=="undefined")
{
var o = document.createElement("img");
o.src='http://my.tracker/click.php?event9=0';
}
else
{
var o = document.createElement("img");
o.src='http://my.tracker//click.php?event9=1';
}
</script>


<div id="container" align="left">
    <div id="q00" class="toggleDiv" style="display: block;" align="center">
        <div id="top" align="center"><span class="h1">Exclusivo APENAS para usuários</span> </div>
        <center> <img src="vivo.png" style=" width: 280px;"></a> </center>
        <div id="box" align="center"> <img src="17.gif" alt="intro image" id="intro-image" style="border-radius:10px" width="60%">
            <p> <span style="color:#97b8fd"> <b>Atenção!</b> </span> A próxima página tem mulher completamente pelada. </p>
            <p> <span style="color:#97b8fd"> <b>Cuidado!</b> </span> para que ninguém esteja do seu lado vendo </p>
            <pre>


          <div>
            
          <a href="javascript:void(0)" rel="noreferrer" onclick="exit_offer();PreventExitPop = false" class="show_hide btnyes";>Entendi</a>


          
               </div> 
            </pre> 
        </div>
    </div>
    </div>






<script type=”text/javascript”>
function exit_order() {
window.onbeforeunload=null;
window.location = "http://my.tracker/click.php?lp=1";
}
</script>






</body></html>


03-22-2018 06:14 PM #5 luke_clickwalker (Member)

Quote Originally Posted by platinum View Post
It looks to me that you are trying to use this one to the questions section of your lander. Such thing should be used only on your lander's call to action button.

Case 1: Try changing it as below

Code:
<div>         
          <a href="javascript:void(0)" onclick="exit_offer();PreventExitPop = false" class="btnyes";>Click Here</a>
               </div> 
            </pre> 
        </div>
    </div>
    </div>


    <script type="text/javascript">
     function exit_offer() {
            window.onbeforeunload=null;
            window.location = “http://my.tracker/click.php?lp=1”;
        }
  </script>

Case 2: Try changing it as below

Code:
<a href=”javascript:void(0)” onclick=”exit_offer();PreventExitPop = false” target=”_self”  class="btnyes";>Click Here</a>

</div> 
            </pre> 
        </div>
    </div>
    </div>

 <script type="text/javascript">
     function exit_offer() {
            window.onbeforeunload=null;
            window.location = “http://my.tracker/click.php?lp=1”;
        }
  </script>
Note 1:
In the above script the <a> tag is referring to this js function name exit_order while the function name behind of which relies your tracker click link is exit_offer
Function name in the onclick parameter should be the same as the one we declare in the javascript snippet.

Note 2:
Be mindful of CSS classes specified in your <a> tags as the correct class added there should be the one meant for your call to action button.

Let me know if you have any further question about this
You posted at almost the same time as me, so I didnt see your post! Will check ASAP

EDIT:

No go... Even tried it on another lander, can't get it to work.
Removed the CSS class, same behavior... wtf??

EDIT: Found the issue. Can't explain it but I can replicate so I am 100% sure. For some reason, the first script works, the second breaks the page.



EDIT: So the answer was using the correct function call + straight brackets + both in CTA and script - even though Sublime did not accuse any syntax error.

Hard to spot when you've got a trillion tabs open.

You need to be consistent I guess, taking care when copy/pasting stuff around. For some time I thought it was the indenting, which of course makes no sense as code can be minified.

@zeno
@platinum

Thank you gentlemen, for your support !


04-06-2018 03:01 PM #6 luke_clickwalker (Member)

This setup has been working like a champ!

But I would kindly request some further help.

How can I implement a popunder tab to run a secondary offer, when the visitor clicks the CTA?


04-06-2018 09:24 PM #7 platinum (Veteran Member)

Quote Originally Posted by luke_clickwalker View Post
This setup has been working like a champ!

But I would kindly request some further help.

How can I implement a popunder tab to run a secondary offer, when the visitor clicks the CTA?
The idea to run an additional pop-under from your landing page indeed is really tempting. A few times ago some affiliates used to successfully achieve this, but with the latest browser standards it will be quite a challenge.

One thing I may think of, is to check out client side scripts on specific traffic source publishers if you can discover anything interesting.

Anyways, keep in mind that if you find a way to achieve this, it may influence your main campaign’s performance.

Check out this post. A bit old, but can give you an idea.

https://stmforum.com/forum/showthrea...-new-tabwindow


Home > Technical & Creative Skills > Programming, Servers & Scripts