Does anyone know how to style the email forms in marketo?

[Anonymous]

Hi Kenny,

I think using the nth-child was the easiest solution.

here is are the style I used targeting the first two divs, and it worked. I am going to go ahead and do it for all other divs. Thank you.

.mktoForm div.mktoFormRow:nth-child(2){

     background-color: #fe2103;

}

.mktoForm div.mktoFormRow:nth-child(4){

     background-color: #3efe03;

}

[Kenny_Elkington]

Happy to help, Camilo.

[Anonymous]

Hello Kenny, I had one more questions regarding the form labels. Is there away we can place the labels to the right of the check boxes? where is the documentation for how to use the form builder?

[Kenny_Elkington]

There's a few ways to do it, but it's been answered many times: Switch form label and checkbox position  The formbuilder documentation is all over on docs.marketo.com: https://docs.marketo.com/display/DOCS/Forms

[Anonymous]

the form is not in an email. the form will appear in a landing page. but the markup generated for each of those form elements have the same classes for the divs that enclose the form element. . Like so:

<form class='mktoForm mktoNoJS' action='http://go.palisade.com/index.php/leadCapture/save' method='post'>

   <div class='mktoFormRow'>

   <div class='mktoFormCol'>

   <label class="mktoLabel" for='Email'>

   <span class="email-label">Email Address:</span> </label>

   <input type="text" class='mktoField mktoTextField' name='Email' id='Email'>

   </div>

   </div>

   <div class='mktoFormRow'>

   <div class='mktoFormCol'>

   <label class="mktoLabel" for='enewsRegularOptin'>

  Palisade Newsletter  </label>

   <input type="text" class='mktoField mktoTextField' name='enewsRegularOptin' id='enewsRegularOptin'>

   </div>

   </div>

   <div class='mktoFormRow'>

   <div class='mktoFormCol'>

   <label class="mktoLabel" for='enewsAcademicOptIn'>

  Palisade Academic Newsletter  </label>

   <input type="text" class='mktoField mktoTextField' name='enewsAcademicOptIn' id='enewsAcademicOptIn'>

   </div>

   </div>

   <div class='mktoFormRow'>

   <div class='mktoFormCol'>

   <label class="mktoLabel" for='subscriptionFreeWebcastDemos'>

  Free Webinars  </label>

   <input type="text" class='mktoField mktoTextField' name='subscriptionFreeWebcastDemos' id='subscriptionFreeWebcastDemos'>

   </div>

   </div>

   <div class='mktoFormRow'>

   <div class='mktoFormCol'>

   <label class="mktoLabel" for='subscriptionRegionalEvents'>

  Regional Events  </label>

   <input type="text" class='mktoField mktoTextField' name='subscriptionRegionalEvents' id='subscriptionRegionalEvents'>

   </div>

   </div>

   <div class='mktoFormRow'>

   <div class='mktoFormCol'>

   <label class="mktoLabel" for='softwareAnnouncementsOptIn'>

  Software Announcements  </label>

   <input type="text" class='mktoField mktoTextField' name='softwareAnnouncementsOptIn' id='softwareAnnouncementsOptIn'>

   </div>

   </div>

   <div class='mktoFormRow'>

   <div class='mktoFormCol'>

   <label class="mktoLabel" for='BigPicture'>

  BigPicture News  </label>

   <input type="text" class='mktoField mktoTextField' name='BigPicture' id='BigPicture'>

   </div>

   </div>

   <div class='mktoFormRow'>

   <div class='mktoFormCol'>

   <label class="mktoLabel" for='Unsubscribed'>

  Unsubscribe  </label>

   <input type="text" class='mktoField mktoTextField' name='Unsubscribed' id='Unsubscribed'>

   </div>

   </div>

   <span style="display:none;"><input type="text" name="_marketo_comments" value=""></span>

   <span class='mktoButtonWrap'><button type='submit' class='mktoButton'>Submit</button></span>

   <input type="hidden" name="lpId" value="1278" />

   <input type="hidden" name="subId" value="315" />

   <input type="hidden" name="lpurl" value="http://go.palisade.com/SubscriptionPreferences.html?cr={creative}&amp;kw={keyword}" />

   <input type="hidden" name="formid" value="1131" />

   <input type="hidden" name="ret" value="" />

   <input type="hidden" name="munchkinId" value="612-PLE-960"/>

   <input type="hidden" name="kw" value=""/>

   <input type="hidden" name="cr" value=""/>

   <input type="hidden" name="searchstr" value=""/>

   <input type="hidden" name="_mkt_disp" value="return"/>

   <input type="hidden" name="_mkt_trk" value=""/>

  </form>

[Anonymous]

Thank You Kenny.

I was able to find the solutions through your suggestions. I do have one more question. Where can I update the mobile style sheet associated with a template?