Re: Not able to edit a landing page

Cecile_Maindron · ‎03-15-2013

Hi,

Our designer has created a new template for an upcoming event. The visual is showing up in the preview but not on the landing page (edit mode). We cannot add any token, text.

Can anybody help?

Cécile @ Talend

BTW this is code of the template

<!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" />


<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>



<style>
/* Note: You can also change these in the specific Landing Pages*/

/* Width of Full Page */
div#innerWrapDiv {
width: 775px;
}

/* Main Content Area - Controls height of page */
div#mktContent {
background: #eeeeee;
position: relative;
height: 650px;
width: 100%; }

/* Thin Column in Content */
div#mktColumn {
height: 100%;
width: 200px;
position: absolute;
right: 0px;
top: 0px;
background: #dddddd;
}
div#mktHeader {position:realtive; height: 100px;background: #cccccc;}
div#mktFooter {position: relative; height: 50px;background: #cccccc;}

/* 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;
}

div.footer_tags a {
   color:#A6C3DD;
   text-decoration:none;
}

/* end fancy button */

</style>




<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>



<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>


<?php echo $mContext['headElements']; ?>
</head>
<body id="bodyId" class="mktEditable" align="center" <?php echo $mContext['bodyAttributes'] ?>
<div id="outerWrapDiv" class="mktEditable">
<div id="innerWrapDiv">



<div id="page">

   <div id="header">
      </div>
   <div style="width:2000px; height:90px; background:#255B97; margin-top:10px; margin-left:-500px">
   <a href="http://www.talend.com" target="_blank"><img src="http://www.talend.com/sites/default/files/talend_connect_white.png" width="150" border="0" align="absbottom" style="margin-left:500px; margin-top:15px" /></a></div>
   <div style="width:2000px; height:5px; background:#A5B4C4; margin-left:-500px"></div>
   <a href="http://www.talend.com/index.php" title="Open Source Integration Software and Data Management Tools - Talend" class="logoTalend"><img src="http://info.talend.com/rs/talend/images/TalendConnect_email_FrankfurtBanner-lp.gif" width="774" height="352" align="left" /></a>
   <div id="contenu" class="form_page">
       <div class="textBox" style="height:900px;">
             <div id="left-col" style="width:100%;"></div>

       </div>
   </div>
   


   <div id="footer3">
   <div style="width:2000px; height:40px; background:#3068A6; margin-left:-500px"></div>
       <div style="clear:both;"></div>
<div class="footer_tags" style="background:#255B97; padding:20px 55px 18px 500px; margin:0 0 40px -500px; font-size:10px; font-family:Arial, Helvetica, sans-serif; color:#A6C3DD; width:1446px; height:85px; text-align:justify"><div class="ran_footer" style="width:775px">
Talend is the leading developer and distributor of <a href="http://www.talend.com/resource/open-source-middleware.html">open source middleware</a>. The freely available Talend Open Studio makes it faster and easier for developers to build and deploy <a href="http://www.talend.com/resource/data-integration.html">data integration</a> processes like <a href="http://www.talend.com/resource/data-migration.html">data migration</a>, <a href="http://www.talend.com/resource/data-replication.html">data replication</a>, and <a href="http://www.talend.com/resource/etl.html">ETL</a>. Subscription-based enterprise grade solutions from Talend support advanced functionality like <a href="http://www.talend.com/resource/change-data-capture.html">change data capture</a> and support for enterprise <a href="http://www.talend.com/resource/data-governance.html">data governance</a>. Talend also offers open source <a href="http://www.talend.com/resource/application-integration-solution.html">application integration solutions</a> that leverage and extend popular <a href="http://www.talend.com/resource/apache-esb.html">Apache ESB</a> technologies like <a href="http://www.talend.com/resource/apache-camel.html">Apache Camel</a>, ActiveMQ, <a href="http://www.talend.com/resource/cxf.html">CXF</a>, and Karaf. <a href="http://www.talend.com/open-source-provider/copyright-trademarks.php">Third Party Copyright and Trademarks</a>
<script src="http://www.talend.com/js/footer.php?host=www.talend.com" type="text/javascript"></script>

<script type="text/javascript">a2a_linkname="Talend: The Open Source Data Company";a2a_linkurl="http://www.talend.com";</script><script type="text/javascript" src="http://static.addtoany.com/menu/page.js"></script>

<script type="text/javascript">
   var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
   document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script><script src="http://www.google-analytics.com/ga.js" type="text/javascript"></script>
<script type="text/javascript">
   try{
       var pageTracker = _gat._getTracker("UA-659787-1");
       pageTracker._setDomainName(".talend.com");
       pageTracker._trackPageview();
   } catch(err) {}
</script>

<script type="text/javascript" src="http://px.owneriq.net/anst/s/talend.js"></script>
<script type="text/javascript">oiq_doTag();</script>

<script src="http://munchkin.marketo.net/munchkin.js" type="text/javascript"></script> <script>mktoMunchkin("347-IAT-677");</script>
      </div>
      <br />
   <div id="bg_footer">
       Copyright © 2006-2013 <a href="http://www.talend.com" target="_blank">Talend</a>. All rights reserved       

        <script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion.js">
</script><img height="1" width="1" border="0" src="http://www.googleadservices.com/pagead/conversion/1042739340/?random=1308732585582&cv=6&fst=1308732585582&num=1&fmt=3&value=0&label=Uk6eCOibhAIQjOGb8QM&bg=666666&hl=en&guid=ON&u_h=1050&u_w=1680&u_ah=1020&u_aw=1680&u_cd=32&u_his=5&u_tz=120&u_java=true&u_nplug=23&u_nmime=115&ref=http%3A//www.talend.com/download_form.php%3Fcont%3Dmdm%26src%3DHomePage&url=http%3A//www.talend.com/download_doc.php">
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt="" src="http://www.googleadservices.com/pagead/conversion/1042739340/?label=Uk6eCOibhAIQjOGb8QM&amp;guid=ON&amp;script=0"/>
</div>
</noscript>   </div>
</div>

</div></div>



</div>
</div>
<?php echo $mContext['endElements']; ?>




</body>
</html>

Anonymous · ‎03-15-2013

The areas that you want to be able to edit need to have class="mktEditable" and then its own unique ID. I am only seeing that class on the body and then the outerWrapDiv.

This video series should shed some more light on the topic: https://community.marketo.com/MarketoArticle?id=kA050000000L5L3CAK