Skip navigation
All Places > Support > Documents
Log in to create and rate content, and to follow, bookmark, and share content with other members.

Correct placement of JavaScript on landing pages

Document created by 08b21bd4b65c4441fd72920f489da6afa097beae on Dec 11, 2014Last modified by 7c0530b8c4efdd5734ac0e37c02a18c0a98056cf on Jun 25, 2015
Version 3Show Document
  • View in full screen mode

Design Studio incorporates the Custom HTML code into its own code.


It is important to evaluate the execution order to place the code in the correct position.

The editor assigns unique ID numbers to each element placed on a landing page. That is done sequentially.

 

Note:

Please ensure that you have access to an experienced JavaScript developer.

Marketo Technical Support is not set up to assist with troubleshooting JavaScript.

div id='lpeCDiv_1612' class='lpeCElement'><span class='lpContentsItem formSpan'


The screen shot shows the code is effectively before the form

rtaImage.png


Elements to be have their default properties changed must to be placed after forms or the elements they are changing, ideally as a small box in the lower right corner. On the other hand code populating fields from cookies or parameters need to be placed before the form.

The following code snippet pre-populates a field. It needs to be placed before the form, retrieving the value before the field is displayed:

<script language="Javascript" src="/js/public/jquery-latest.min.js" type="text/javascript"></script>
<script src="/js/public/jQueryString-2.0.2-Min.js" type="text/javascript" ></script>
<script>
  // to set cookies.  Uses noConflict just in case
  var $jQ = jQuery.noConflict();
  var pEmail = $jQ.getQueryString({ ID: "Email" });

document.getElementById("Email").setAttribute("value", pEmail);

</script>

The next code resizes a text area. The Custom HTML box needs to be placed after the form:

<script src="/js/public/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
var $jQ = jQuery.noConflict();
$jQ(document).ready(function() {
$jQ('#MyFieldName').parents('li').css('margin-bottom','300px;');
});
</script>

<style type="text/css">
form.lpeRegForm textarea { width: 450px; }
</style>

Attachments

    Outcomes