SOLVED

Pop Up Window on Form

Go to solution
Anonymous
Not applicable

Pop Up Window on Form

I'd like to create a pop up window on a form. I have a white paper I'd like people to download. They go to landing page and before they are able to download the whitepaper, a pop up appears asking them to sign up for our newsletter.

How do I do this in Marketo? I'm hoping there is an easier way than the one listed here: http://community.marketo.com/MarketoArticle?id=kA050000000L3P7CAK

Thank you,
Deirdre
Tags (1)
1 ACCEPTED SOLUTION

Accepted Solutions
Anonymous
Not applicable

Re: Pop Up Window on Form

Unfortunately, I would say a javascript / jquery solution like in that post is going to be your best bet.  As a side note, if you don't know javascript I would definitely encourage you to try it.  This is an excellent starting point. There are countless resources online, and it is super helpful in customizing Marketo pages like this and more.

** UPDATE **

Here is a simple version you can just drag over an HTML box into your landing page, copy and paste the below code, update this with the URL of your mailing list landing page form.  and update the height, width, border as you'd like.

** Important** because scripts are disabled in preview, this will only be work and be visable on the live page. NOT in 'Preview Draft'

copy everything below this line

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 
<script src="https://simplemodal.googlecode.com/files/jquery.simplemodal-1.4.4.js"></script>
<script type="text/javascript">
var src = "http://www.arringtoncreative.com"; //Change this to your URL
$.modal('<iframe src="' + src + '" height="450" width="830" style="border:0" scrolling="no">', {
    closeHTML:"",
    containerCss:{
        backgroundColor:"#fff", //Background color of frame most likely won't show
border: "solid 5px #333",  //Outer Border Style
        height:450, // This Height should be the same number as above.  Update both
        padding:0,
        width:830 // This Width should be the same number as above.  Update both
    },
    overlayClose:true //Close frame on clicking outside 
});
</script>


View solution in original post

5 REPLIES 5
Anonymous
Not applicable

Re: Pop Up Window on Form

Unfortunately, I would say a javascript / jquery solution like in that post is going to be your best bet.  As a side note, if you don't know javascript I would definitely encourage you to try it.  This is an excellent starting point. There are countless resources online, and it is super helpful in customizing Marketo pages like this and more.

** UPDATE **

Here is a simple version you can just drag over an HTML box into your landing page, copy and paste the below code, update this with the URL of your mailing list landing page form.  and update the height, width, border as you'd like.

** Important** because scripts are disabled in preview, this will only be work and be visable on the live page. NOT in 'Preview Draft'

copy everything below this line

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script> 
<script src="https://simplemodal.googlecode.com/files/jquery.simplemodal-1.4.4.js"></script>
<script type="text/javascript">
var src = "http://www.arringtoncreative.com"; //Change this to your URL
$.modal('<iframe src="' + src + '" height="450" width="830" style="border:0" scrolling="no">', {
    closeHTML:"",
    containerCss:{
        backgroundColor:"#fff", //Background color of frame most likely won't show
border: "solid 5px #333",  //Outer Border Style
        height:450, // This Height should be the same number as above.  Update both
        padding:0,
        width:830 // This Width should be the same number as above.  Update both
    },
    overlayClose:true //Close frame on clicking outside 
});
</script>


Anonymous
Not applicable

Re: Pop Up Window on Form

Hi,

This is brilliant code.
What would the code be to only make the pop up appear AFTER the submit button is selected? and where would you place it?

Thank you,

Anonymous
Not applicable

Re: Pop Up Window on Form

My short answer is, don't do it. To generate the pop up once the button is submitted you would need to change the "on click" function on the button itself which causes complications with validating and submitting the form.  What are you trying to accomplish?  There may be a cleaner solution.
Anonymous
Not applicable

Re: Pop Up Window on Form

I'm trying to accomplish the same thing where a pop up window appears thanking the person for submitting the form and that allows them to download the content.  The code you provided is great Josh, but I'm in the same boat as Karen.

Any help you can provide is appreciated.  I'm struggling with this one because I'm new to javascript.

Thanks.
Anonymous
Not applicable

Re: Pop Up Window on Form

Hey Josh, how do I trigger this javascript? Would any marketo form trigger this?
If i wanted to trigger this with a click on a link, what should I do?