Sign-up form problem

Sign-up form problem

I have created a sign up form in campaign but while loading in my wordpress it get broken down:

the bellow are the link one from my site and one from zoho campaign with same code:



  1. Note :I also attached the code
  3. <!--Zoho  Web-Optin Form Starts Here-->
  4. <link href="https://campaigns.zoho.com/css/ui.theme.css" rel="stylesheet" type="text/css" />
  5. <link href="https://campaigns.zoho.com/css/ui.datepicker.css" rel="stylesheet" type="text/css" />
  6. <link href="https://campaigns.zoho.com/css/ui.core.css" rel="stylesheet" type="text/css" />
  7. <script type="text/javascript" src="https://campaigns.zoho.com/js/jquery-1.11.0.min.js"></script>
  8. <script type='text/javascript' src='https://campaigns.zoho.com/js/jquery-migrate-1.2.1.min.js'></script>
  9. <script type="text/javascript" src='https://campaigns.zoho.com/js/ui.datepicker.js'  charset="utf-8"></script>
  10. <script type="text/javascript" src="https://campaigns.zoho.com/js/jquery.form.js"></script>
  11. <script type="text/javascript" src="https://campaigns.zoho.com/js/optin_min.js"></script>
  12. <script type="text/javascript">
  13. var $ZC = jQuery.noConflict();
  14. var trackingText='ZCFORMVIEW';
  15. $ZC(document).ready( function($) {
  16. $ZC("#zc_trackCode").val(trackingText);
  17. $ZC("#fieldBorder").val($ZC("[changeItem='SIGNUP_FORM_FIELD']").css("border-color"));
  18. _setOptin(false,function(th){
  19. /*Before submit, if you want to trigger your event, "include your code here"*/
  20. });

  22. /*Load Captcha For this*/ 
  23.  loadCaptcha('https://campaigns.zoho.com/campaigns/CaptchaVerify.zc?mode=generate');

  25.  /*Tracking Enabled*/ 
  26.  trackSignupEvent(trackingText);
  27.  });
  28. </script>

  30. <meta name="viewport" content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
  31. <div id="customForm">
  32. <div id="SIGNUP_PAGE" style="padding: 0px; color: rgb(204, 204, 204); font-family: Geneva; font-size: 10px; overflow-y: auto; background-color: rgb(212, 205, 212);" name="SIGNUP_PAGE">
  33. <div style="margin:0px auto" name="" changename="" changeid="">
  34. <div id="imgBlock" style="margin: 0px auto; width: 600px; text-align: center;" name="LOGO_DIV" logo="true"></div>
  35. </div>
  36. <br>
  37. <div id="signupMainDiv" style="margin: 0px auto; width: 100%; min-width: 230px; max-width: 600px;" changename="SIGNUPFORM" changeid="SIGNUPFORM" signupform"="">
  38. <div "="">
  39. <div style="position:relative;top: 30px;">
  40. <div id="Zc_SignupSuccess" style="display:none;position:absolute;margin-left:4%;width:90%;background-color: white; padding: 3px; border: 3px solid rgb(194, 225, 154);  margin-top: 10px;margin-bottom:10px; ">
  41. <table width="100%" border="0" cellspacing="0" cellpadding="0">
  42. <tbody>
  43. <tr>
  44. <td width="10%">
  45. <img align="absmiddle" class="successicon" src="https://campaigns.zoho.com/images/challangeiconenable.jpg">
  46. </td>
  47. <td>
  48. <span id="signupSuccessMsg" style="color: rgb(73, 140, 132); font-family: sans-serif; font-size: 14px;">&nbsp;&nbsp;Thank you for Signing Up</span>
  49. </td>
  50. </tr>
  51. </tbody>
  52. </table>
  53. </div>
  54. </div>
  55. <form id="zcampaignOptinForm" style="margin:0px;" action="https://zc1.maillist-manage.com/campaigns/weboptin.zc" method="POST" target="_zcSignup">
  56. <div id="SIGNUP_BODY_ALL" style="border: 0px rgb(176, 174, 174);" name="SIGNUP_BODY_ALL">
  57. <h1 id="SIGNUP_HEADING" style="margin: 0px; padding: 0px; border: 6px rgb(91, 91, 91); border-image: none; text-align: left; color: rgb(12, 130, 104); font-family: Arial; font-size: 20px; word-break: break-all;" name="SIGNUP_HEADING" changeid="SIGNUP_MSG" changetype="SIGNUP_HEADER">Subscribe to our Newsletters</h1>
  58. <div id="SIGNUP_BODY" style="padding: 1px; text-align: center; color: rgb(68, 68, 68); font-family: Arial; font-size: 12px; background-color: rgb(113, 222, 220);" name="SIGNUP_BODY">
  59. <div style="width:90%; margin:0px auto;text-align:left;">
  60. <div id="SIGNUP_DESCRIPTION" style="line-height:1.6;" changeid="SIGNUP_MSG" changetype="SIGNUP_DESCRIPTION">We believe that as television data increasingly merges with the Internet’s direct response measurements (including the “click”), this merger and the resulting data combinations will be critically important to all television industry participants. Since 2010 Across Platforms has concentrated on building technologies, and collecting data that fit within this paradigm.Across Platforms publishes three newsletters designed to showcase our television industry database and technologies.</div>
  61. <div id="errorMsgDiv" style="display:none;background-color:#FFEBE8;padding:10px 10px; color:#d20000; font-size:11px; margin:10px 0px;border:solid 1px #ffd9d3; margin-top:20px;">&nbsp;&nbsp;Please correct the marked field(s) below</div>
  62. <div>
  63. <div style="font-size:12px; color:#333;font-family:Arial, Helvetica, sans-serif; margin-top:10px;">
  64. <div style="padding:10px 0px 10px 0px;">
  65. <div>
  66. <input name="FIRSTNAME" class="placeholder" style="padding: 2px; border: 1px solid rgb(222, 222, 222); border-image: none; width: 97%; height: 28px; color: rgb(68, 68, 68); text-indent: 5px; font-size: 12px; box-sizing: border-box; background-color: rgb(242, 252, 239);" type="text" maxlength="100" placeholder="First Name" changeitem="SIGNUP_FORM_FIELD">&nbsp;
  70. <span style="color: rgb(0, 179, 173); font-size: 11px;" name="SIGNUP_REQUIRED">*</span>
  72. <span id="dt_FIRSTNAME" style="display:none">1,true,1,First Name,2</span>
  73. </div>
  77. <div style="clear:both"></div>
  81. </div>
  82. <div style="padding:10px 0px 10px 0px;">
  83. <div>
  84. <input name="LASTNAME" class="placeholder" style="padding: 2px; border: 1px solid rgb(222, 222, 222); border-image: none; width: 97%; height: 28px; color: rgb(68, 68, 68); text-indent: 5px; font-size: 12px; box-sizing: border-box; background-color: rgb(242, 252, 239);" type="text" maxlength="100" placeholder="Last Name" changeitem="SIGNUP_FORM_FIELD">&nbsp;<span style="color: rgb(0, 179, 173); font-size: 11px;" name="SIGNUP_REQUIRED">*</span>
  85. <span id="dt_LASTNAME" style="display:none">1,true,1,Last Name,2</span>
  86. </div><div style="clear:both"></div></div>
  87. <div style="padding:10px 0px 10px 0px;">
  88. <div>
  89. <input name="CONTACT_EMAIL" class="placeholder" style="padding: 2px; border: 1px solid rgb(222, 222, 222); border-image: none; width: 97%; height: 28px; color: rgb(68, 68, 68); text-indent: 5px; font-size: 12px; box-sizing: border-box; background-color: rgb(242, 252, 239);" type="text" maxlength="100" placeholder="Contact Email" changeitem="SIGNUP_FORM_FIELD">&nbsp;<span style="color: rgb(0, 179, 173); font-size: 11px;" name="SIGNUP_REQUIRED">*</span>
  90. <span id="dt_CONTACT_EMAIL" style="display:none">1,true,6,Contact Email,2</span>
  91. </div><div style="clear:both"></div></div>
  92. </div><!-- Captcha for Signup -->
  93. <div id="captcha" style="padding:10px 0px 10px 0px; " name="captchaContainer">
  94. <div>
  95. <div style="width:97%;  min-width:170px; margin-top:5px;">
  96. <img style="cursor: pointer; max-width: 200px; float: right;" onclick="loadCaptcha('',this);" src="//campaigns.zoho.com/images/refresh_icon.png">
  97. <div id="captchaDiv" style="height:60px;padding: 20px;background:#fff;border: 1px solid rgb(222, 222, 222);" name="" captcha="true"></div>
  98. </div>
  99. <input class="placeholder" id="captchaText" style="padding: 2px; border: 1px solid rgb(222, 222, 222); border-image: none; width: 97%; height: 28px; color: rgb(68, 68, 68); text-indent: 5px; font-size: 12px; margin-top: 5px; box-sizing: border-box; background-color: rgb(242, 252, 239);" type="text" maxlength="100" placeholder="Captcha" changeitem="SIGNUP_FORM_FIELD">&nbsp;<span style="color: rgb(0, 179, 173); font-size: 11px;" name="SIGNUP_REQUIRED">*</span></div><div style="clear:both"></div></div><!-- Captcha for Signup End--><!-- Other Lists Subscription Start-->
  100. <div id="selectMailingLists" style="margin-top:20px;" identity="mailingLists">
  101. <div style="color: rgb(68, 68, 68); font-family: Arial; font-size: 12px;" name="SIGNUP_FORM_LIST" changetype="SIGNUP_FORM_LIST">By checking any of the publications listed below , you expressly agree and accept our privacy policy, and you also agree (at no cost to you) to subscribe to the publications that you have selected.</div>
  102. <table width="96%" class="mt10" id="listRelTable" border="0" cellspacing="0" cellpadding="0">
  103. <tbody>
  104. <tr>
  105. <td width="150">
  106. <label style="color: rgb(68, 68, 68); font-family: Arial; font-size: 12px;" name="SIGNUP_FORM_LIST">
  107. <div align="left" class="txtnormal bdr_btm" style="padding:10px" onmouseover="this.className='txtnormal bdr_btm_hover';" onmouseout="this.className='txtnormal bdr_btm';" valign="top">
  108. <input name="listCheckBox" id="323000001211179" type="checkbox" value="323000001211179">Home Shopping Industry Report</div>
  109. </label>
  110. </td>
  111. </tr>
  112. <tr>
  113. <td width="150">
  114. <label style="color: rgb(68, 68, 68); font-family: Arial; font-size: 12px;" name="SIGNUP_FORM_LIST">
  115. <div align="left" class="txtnormal bdr_btm" style="padding:10px" onmouseover="this.className='txtnormal bdr_btm_hover';" onmouseout="this.className='txtnormal bdr_btm';" valign="top">
  116. <input name="listCheckBox" id="323000010695389" type="checkbox" value="323000010695389">MVPD Metrics Report</div>
  117. </label>
  118. </td>
  119. </tr>
  120. <tr>
  121. <td width="150">
  122. <label style="color: rgb(68, 68, 68); font-family: Arial; font-size: 12px;" name="SIGNUP_FORM_LIST">
  123. <div align="left" class="txtnormal bdr_btm" style="padding:10px" onmouseover="this.className='txtnormal bdr_btm_hover';" onmouseout="this.className='txtnormal bdr_btm';" valign="top">
  124. <input name="listCheckBox" id="323000000411026" type="checkbox" value="323000000411026">Subchannel Report</div>
  125. </label>
  126. </td>
  127. </tr>
  128. </tbody>
  129. </table>
  130. </div>
  131. <div style=" border-bottom:#ebebeb dotted 1px; margin-top:10px; clear:both;"></div>
  132. <div id=" REQUIRED_FIELD_TEXT" style="padding: 10px 10px 10px 0px; color: rgb(0, 179, 173); font-size: 11px;" name="SIGNUP_REQUIRED" changetype="REQUIRED_FIELD_TEXT">*Required Fields</div>
  133. <div style="padding:10px; text-align:center;">
  134. <input name="SIGNUP_SUBMIT_BUTTON" id="zcWebOptin" style="background-position: bottom; padding: 5px 20px; outline: invert; border-radius: 10px; border: 2px solid rgb(0, 214, 207); text-align: center; color: rgb(255, 255, 255); font-size: 17px; background-repeat: repeat-x; cursor: pointer; -webkit-appearance: none; background-color: rgb(0, 214, 207);" type="button" value="Subscribe" action="Save" changetype="SIGNUP_SUBMIT_BUTTON_TEXT">
  135. </div>
  136. </div>
  137. </div>
  138. </div><!-- Do not edit the below Zoho Campaigns hidden tags -->
  139. <input id="fieldBorder" type="hidden" value="">
  140. <input name="zc_trackCode" id="zc_trackCode" onload="" type="hidden" value="">
  141. <input name="submitType" id="submitType" type="hidden" value="optinCustomView">
  142. <input name="lD" id="lD" type="hidden" value="1125c44d9d70ba">
  143. <input name="emailReportId" id="emailReportId" type="hidden" value="">
  144. <input name="zx" id="cmpZuid" type="hidden" value="15e0351">
  145. <input name="zcvers" type="hidden" value="2.0">
  146. <input name="oldListIds" id="allCheckedListIds" type="hidden" value="">
  147. <input name="mode" id="mode" type="hidden" value="OptinCreateView">
  148. <input name="zcld" id="zcld" type="hidden" value="1125c44d9d70ba">
  149. <input id="document_domain" type="hidden" value="zoho.com">
  150. <input id="zc_Url" type="hidden" value="zc1.maillist-manage.com">
  151. <input name="zc_formIx" id="zc_formIx" type="hidden" value="19f1555a995ee12e2897067c18174dfa"><!-- End of the campaigns hidden tags --></div>
  152. </form>
  153. </div>
  154. <div id="privacyNotes" style="margin: 0px auto;margin-top:20px;text-align:left;" name="SIGNUPFORM" identity="privacyNotes">
  155. <span>Note: It is our responsibility to protect your privacy and we guarantee that your email address will be completely confidential.</span>
  156. </div>
  157. </div>
  158. </div>
  159. <img id="refImage" style="display: none; max-width: 200px;" onload="referenceSetter(this)" src="https://zc1.maillist-manage.com/images/spacer.gif">
  160. </div>
  161. <div id="zcOptinOverLay" style="display:none;text-align: center; background-color: rgb(0, 0, 0); opacity: 0.5; z-index: 100; position: fixed; width: 100%; top: 0px; left: 0px; height: 988px;" oncontextmenu="return false"></div>
  162. <div id="zcOptinSuccessPopup" style="display:none;z-index: 9999;width: 800px; height: 40%;top: 84px;position: fixed; left: 26%;background-color: #FFFFFF;border-color: #E6E6E6; border-style: solid; border-width: 1px;  box-shadow: 0 1px 10px #424242;padding: 35px;">
  163. <span id="closeSuccess" style="position: absolute;top: -16px;right:-14px;z-index:99999;cursor: pointer;">
  164. <img src="https://campaigns.zoho.com/images/videoclose.png">
  165. </span>
  166. <div id="zcOptinSuccessPanel"></div>
  167. </div>

  169. <!--Zoho  Web-Optin Form Ends Here-->

    Access your files securely from anywhere

        Zoho Developer Community

            Bootcamp
            Community
            Pricing
            Webinars
            What's New
            Integrations
            Contact Support
            Contact Sales

              Zoho Survey Resources
                Features
                Survey Templates
                Integrations
                Community
                iOS Mobile Surveys
                Pricing
                Android Mobile Surveys
                Insurvey Blogs
                Insight Blogs
                Tips & Tricks





                              Latest Feature Updates


                                  Zoho Desk Resources

                                  • Desk Community Learning Series


                                  • Digest


                                  • Functions


                                  • Meetups


                                  • Kbase


                                  • Resources


                                  • Glossary


                                  • Desk Marketplace


                                  • MVP Corner


                                  • Word of the Day




                                      Zoho Marketing Automation
                                        Zoho SalesIQ Resources

                                              • Sticky Posts

                                              • Marketer's space - Understanding portal roles in the new user management system

                                                Hello, As part of our new user management setup, we recently introduced portals and workspaces. Portals enable you to manage multiple products under a single brand within a single account. Workspaces are the spaces you can create within a portal for individual

                                              • Promote Campaigns on your LinkedIn Company page

                                                Hello!   We are happy to announce that Zoho Campaigns has further improved its integration with LinkedIn to provide more services. This time, we've come up with a new feature where you can promote your email and social campaigns on your LinkedIn company page.   LinkedIn company page is a hub where followers are updated about the company, its products & services and of course new features & updates. It acts as a public portal for prospects, vendors and partners, etc. You can engage your followers

                                              • The much-awaited real-time sync between Zoho Campaigns and Zoho CRM is live.

                                                Hello all, You don't have to wait for 24 hours to pull data from CRM to Campaigns anymore. Instantly bring subscriber data from contacts, leads, and custom modules and get going with your nurturing process right away.  What has changed?  We have two types of syncs now: Immediate and periodic.  The UI: We have cut down on the number of steps for the sync from three to two.  When to use which sync: Immediate Sync: When you want the data to get reflected in Campaigns as and when it is added in CRM.

                                              • Marketer's Space: Template Editor - Dynamic Content

                                                Dynamic content has become an inevitable part of email marketing. It's basically the process of displaying content to your leads that is relevant to them based upon them matching a particular criteria you have set previously.    To put it in simpler terms, it is the right content for the right people at the right time.    How to use the dynamic content While creating an email campaign, you go on to select a pre-designed or basic template to add content, and then click Advanced --> Dynamic to create

                                              • Sending Autoresponders to Existing Contacts

                                                Hello! In recent times, many of our users wanted to send Autoresponders to existing contacts. Since, these contacts existed already; they will never be receiving that message scheduled in the Autoresponders.  But, is there really a way to push these Autoresponder message(s) to such existing contacts? Well, Zoho Campaigns has again come up with a solution for such request laid by many of our users. We are happy to announce the new enhancement on Autoresponders through which you can send the Autoresponder


                                              Manage your brands on social media
                                              Access Zoho Social

                                                Zoho Pagesense Resources


                                                    Zoho TeamInbox Resources

                                                      Zoho DataPrep Resources



                                                        Zoho CRM Plus Resources

                                                          Zoho Books Resources


                                                            Zoho Subscriptions Resources

                                                              Zoho Projects Resources


                                                                Zoho Sprints Resources


                                                                  Qntrl Resources


                                                                    Zoho Creator Resources



                                                                        Zoho Campaigns Resources


                                                                          Zoho CRM Resources

                                                                          • CRM Community Learning Series

                                                                            CRM Community Learning Series


                                                                          • Kaizen

                                                                            Kaizen

                                                                          • Functions

                                                                            Functions

                                                                          • Meetups

                                                                            Meetups

                                                                          • Kbase

                                                                            Kbase

                                                                          • Resources

                                                                            Resources

                                                                          • Digest

                                                                            Digest

                                                                          • CRM Marketplace

                                                                            CRM Marketplace

                                                                          • MVP Corner

                                                                            MVP Corner





                                                                              Design. Discuss. Deliver.

                                                                              Create visually engaging stories with Zoho Show.

                                                                              Get Started Now