Code requirements for uploading HTML landing pages

Important: If you have asked a third-party to create the code for your landing page, it is important that you provide them with this information in order to avoid integration problems in Eloqua.

In order for your HTML to render properly in Eloqua and across all browsers, it is recommended to use the following guidelines:

  • DocType is XHTML-1.0-Strict (except for migrated pages). This DocType is used to ensure the best possible rendering of landing pages across browsers, and therefore all uploaded content must also use this DocType:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

  • Code must validate properly according to W3C Markup Validation Service at http://validator.w3.org/.

  • JS code must pass the JSLint JavaScript Code Quality Tool (see http://www.jslint.com/):

    • All JS should live in the header tag.
    • Broken JS will cause your page to not render in Internet Explorer.
  • Do not target the <BODY> tag with CSS.

  • Ensure compatibility with the following basic Eloqua CSS reset included in the application for proper rendering across different browsers:

    html{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,

    form,fieldset,legend,input,button,textarea,p,blockquote,th

    td{margin:0;padding:0;}table{border-collapse:collapse;borderspacing:0;}fieldset,img{border:0;}address,

    caption,cite,code,dfn,em,strong,th,var
    optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}caption,th{text-align:left;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}

  • Do not use these System class names:

    • .sc-view
    • .sc-view-overflow
    • .sc-container-view
    • .overlays-active
    • .inline-styled-view
    • .inline-styled-view{}
    • .hidden-border
    • .body
    • .sc-view.static-layout
    • .main
    • .elq-form
    • .elq-form-ce
  • Use static or absolute positioning, and avoid relative or fixed-positioned elements.

  • Use of tables is permitted.

  • Do notuse relative paths to reference images, stylesheets, and so on.

  • Do not use <html>, <head>, <body> opening or closing tags within a text or shared content section.

  • Ensure all elements have correct opening and closing tags.

Note: If you re-save any transitioned content in the landing page editor, you must reset the following: page dimensions, body background color/images, document background color/images.

After you have verified that all requirements have been met, you can proceed to upload the HTML code for your landing pages. See Creating landing pages using the HTML upload wizard.

Related

Landing pages

Creating new landing pages and templates using the HTML upload wizard