Replace Submit Button with JPG? | Community
Skip to main content
April 29, 2014
Solved

Replace Submit Button with JPG?

  • April 29, 2014
  • 13 replies
  • 4022 views
I see a bunch of articles about changing the style of a form submit button (forms 2.0) but nothing around swapping out our own JPG. I would like to use the buttons that our website uses but I don’t know a lot about javascript. Any suggestions from the community? Much appreciated! 
This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.
Best answer by
Hi Mary,

You can try a solution that we use.

Paste the code below in a custom html element in a marketo landing page.

Also replace the code where

PUT THE URL PATH OF YOUR IMAGE HERE

appears with the url path of your jpg image.



<style>
button[type="submit"].mktoButton{
display:none !important;
}
</style>
<!-- jquery if needed OPTIONAL -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
 
<script type="text/javascript">
$(document).ready(function(){
setTimeout(function(){
$('button.mktoButton[type=submit]').after('<img src="PUT THE URL PATH OF YOUR IMAGE HERE" style="cursor:pointer" class="myOwnButton"/>');
$('img.myOwnButton').click(function(){
$('button.mktoButton[type=submit]').click();
});
},2000)
 
});
</script> 


13 replies

April 30, 2014
@Haven Ramos Thanks! That worked beautifully. 
Accepted solution
April 30, 2014
Hi Mary,

You can try a solution that we use.

Paste the code below in a custom html element in a marketo landing page.

Also replace the code where

PUT THE URL PATH OF YOUR IMAGE HERE

appears with the url path of your jpg image.



<style>
button[type="submit"].mktoButton{
display:none !important;
}
</style>
<!-- jquery if needed OPTIONAL -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
 
<script type="text/javascript">
$(document).ready(function(){
setTimeout(function(){
$('button.mktoButton[type=submit]').after('<img src="PUT THE URL PATH OF YOUR IMAGE HERE" style="cursor:pointer" class="myOwnButton"/>');
$('img.myOwnButton').click(function(){
$('button.mktoButton[type=submit]').click();
});
},2000)
 
});
</script> 


Josh_Hill13
New Participant
April 29, 2014
Mary,

You would need to use a custom script. I believe there are some threads on this which may include real scripts.

BUT in Forms 2.0 you can edit the CSS, so you could do it this way too.