Landing Page Insert Elements Problem | Community
Skip to main content
A
Anonymous
January 14, 2014
Solved

Landing Page Insert Elements Problem

  • January 14, 2014
  • 5 replies
  • 2595 views
I have a landing page template with the code:
<div id="mktContentWrapper" class="mktEditable">
      <!-- Base of Landing Page Content -->
</div>

Inserted Elements end up in innerWrapDiv though and not mktContentWrapper.

How do I get elements to go into the mktContentWrapper div?
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
Move the line:

<?php echo $mContext['bodyElements']; ?>

after:

<div id="mktContentWrapper" class="mktEditable">

That should fix it. That tag initializes Marketo's rendering engine, so you have to have it within the element you wish to use as the container.

5 replies

A
Anonymous
January 14, 2014
where is your "bodyelements" php tag located? Care to share the code?
A
Anonymous
January 14, 2014
Hi Jason,

$mContext['bodyElements']; appears on line 173 just after innerWrapDiv.

Below is the complete code from my template. Dragging any element into #mktContentWrapper.mktEditable, then previewing the page and viewing the resulting html source code, shows the element has been placed within innerWrapDiv and outside of mktContentWrapper.

Since innerWrapDiv is not editable, I don't understand why it is accepts edits and mktContentWrapper does not accept edits.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/2000/REC-xhtml1-200000126/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
 
 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 
<!-- SYSTEM CSS - DO NOT EDIT -->
<link rel="stylesheet" type="text/css" media="screen" href="/css/mktLPSupport.css" />
<style type="text/css">
#bodyId {
  background: #ffffff;
  font-family: Arial, sans-serif;
  font-size: 12px;
  text-align: center;
  margin: 0px;
  padding: 0px;
}
 
div#outerWrapDiv {
  position: relative;
  height: 100%;
  width: 100%;
}
 
div#innerWrapDiv {
  position: relative;
  background: #ffffff;
  padding: 0px;
  margin-left: auto;
  margin-right: auto;
  margin-top: 15px;
  margin-bottom: 0px;
  text-align: left;
}
 
</style>
 
<!-- START TEMPLATE CSS - EDIT THIS SECTION -->
 
<style>
/* Note: You can also change these in the specific Landing Pages*/
 
/* Width of Full Page */
div#innerWrapDiv {
    background: red;
    width: 100%;
  }
 
/* Main Content Area - Controls height of page */
div#mktContent {
  background: pink;
  position: relative;
  width: 100%; }
 
div#mktContentWrapper {
    background: green;
    margin: 0 auto;
    height: 650px;
    width: 960px;
    outline: 1px solid red;
}
 
 
 
/* Start fancy button */
 
div.buttonSubmit {
  position:relative;
  float:left;
}
 
 
div.buttonSubmit input, div.buttonSubmit span {
  background-image:url(https://www.marketo.com/buttons/button-submit10.gif); /* change button and path to correct customer partition */
  background-position:right 0px;
  background-repeat:no-repeat;
  border:0px none;
  color:#FFFFFF;
  cursor:pointer;
  float:left;
  font-weight:bold;
  height:36px;
  margin:0px;
  padding:0px 15px 2px;
  position:relative;
  z-index:5;
}
div.buttonSubmit span {
  background-position:left -36px;
  left:0px;
  padding:0px;
  position:absolute;
  top:0px;
  width:4px;
  z-index:10;
}
div.buttonSubmit input {
  width:auto;
  padding-left: 10px !important;
  padding-right: 10px !important;
 
}
 
#mktFrmSubmit{
    color: #FFFFFF !important;
}
 
div.buttonSubmit:hover input {  background-position: right -72px;}
div.buttonSubmit:hover span {  background-position: left -108px;}
 
#mktFrmReset {
  display:none;
}
 
/* end fancy button */
 
 
</style>
 
<!-- END TEMPLATE CSS -->
 
 
 
 
 
<!-- SYSTEM JAVASCRIPT - DO NOT EDIT -->
<script type="text/javascript">
function fieldValidate(field) {
  /* call Mkto.setError(field, message) and return false to mark a field value invalid */
  /* return 'skip' to bypass the built-in validations */
  return true;
}
function getRequiredFieldMessage(domElement, label) {
  return "This field is required";
}
function getTelephoneInvalidMessage(domElement, label) {
  return "Please enter a valid telephone number";
}
function getEmailInvalidMessage(domElement, label) {
  return "Please enter a valid email address";
}
</script>
 
 
<!-- Jquery for fancy things!-->
 
<script language="JavaScript" src="https://app.marketo.com/js/public/jquery-latest.min.js" type="text/javascript"></script>
   <script>
    // to make fancy buttons.  Uses noConflict just in case
     var $jQ = jQuery.noConflict();
 
     // Use jQuery via $j(...)
     $jQ(document).ready(function(){
 
       $jQ("#mktFrmSubmit").wrap("<div class='buttonSubmit'></div>");
       $jQ(".buttonSubmit").prepend("<span></span>");
 
     });
   </script>
 
 
 
 
 
 
<!-- SYSTEM INCLUDES - DO NOT EDIT -->
<?php echo $mContext['headElements']; ?>
</head>
<body id="bodyId" class="mktEditable" align="center" <?php echo $mContext['bodyAttributes'] ?>>
<div id="outerWrapDiv" class="mktEditable">
<div id="innerWrapDiv">
<?php echo $mContext['bodyElements']; ?>
 
 
 
 
<!-- START TEMPLATE HTML - EDIT THIS SECTION -->
 
<div id="mktContent">
<div id="mktContentWrapper" class="mktEditable">
      <!-- Base of Landing Page Content -->
</div>
</div>
 
 
<!-- END TEMPLATE HTML -->
 
 
 
 
<!-- SYSTEM FOOTER - DO NOT EDIT -->
</div>
</div>
<?php echo $mContext['endElements']; ?>
 
 
 
<!-- GOOGLE ANALYTICS.  ENTER YOUR CODE and UNCOMMENT block -->
<!--
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "YOURCODE";
urchinTracker();
</script>
-->
 
</body>
</html>
A
Anonymous
Accepted solution
January 15, 2014
Move the line:

<?php echo $mContext['bodyElements']; ?>

after:

<div id="mktContentWrapper" class="mktEditable">

That should fix it. That tag initializes Marketo's rendering engine, so you have to have it within the element you wish to use as the container.
A
Anonymous
January 15, 2014
Thanks Jason!
A
Anonymous
March 4, 2015
How is this possible when you can't include PHP in your templates?

I've tried adding <?php echo $mContext['bodyElements']; ?> in the template editor, but it throws errors saying PHP is not allowed.
Terms & ConditionsAccessibility statement

Loading footer...