Title: Custom html
Last modified: April 13, 2024

---

# Custom html

 *  Resolved [goddessdiana](https://wordpress.org/support/users/goddessdiana/)
 * (@goddessdiana)
 * [2 years, 1 month ago](https://wordpress.org/support/topic/custom-html-24/)
 * I’m trying to insert custom HTML block that looks fine when I click on preview.
   (
   I can’t install plugins because I’m in a plan that plugins can’t be installed).
   When I save the page and open it I see the text of the code instead the form.
   What am I doing wrong?I received the html source code from ZOHO CRM, I want to
   put it on my website and whenever customers will fill in their details, it will
   automatically add them to my contact list in zoho.**I removed only my identifying
   information from the code.This is how it should look like, in practice it shows
   part of the code itself (I have attached 2 screenshots).
 *     ```wp-block-code
       <!-- Note :
          - You can modify the font style and form style to suit your website. 
          - Code lines with comments Do not remove this code are required for the form to work properly, make sure that you do not remove these lines of code. 
          - The Mandatory check script can modified as to suit your business needs. 
          - It is important that you test the modified form before going live.-->
       <div id='crmWebToEntityForm' class='zcwf_lblLeft crmWebToEntityForm' style='background-color: #292743;color: #FFFFFF;max-width: 600px;'>
         <meta name='viewport' content='width=device-width, initial-scale=1.0'>
          <META HTTP-EQUIV ='content-type' CONTENT='text/html;charset=UTF-8'>
   
       <form id='webform' action='https://crm.zoho.eu/crm/WebToLeadForm' name=WebToLeads method='POST' onSubmit='javascript:document.charset="UTF-8"; return checkMandatory()' accept-charset='UTF-8'>
        <input type='text' style='display:none;' name='xnQ' value='e89145402c2ffdd79a11ce'></input> 
        <input type='hidden' name='zc_gad' id='zc_gad' value=''></input>
        <input type='text' style='display:none;' name='xmI' value='ea04519'></input> 
        <input type='text'  style='display:none;' name='actionType' value='TG'></input>
        <input type='text' style='display:none;' name='returnURL' value='https://ali-corn.com/thank-you/' > </input>
       	 <!-- Do not remove this code. -->
       <style>
       html,body{
       	margin: 0px;
       }
       #crmWebToEntityForm.zcwf_lblLeft {
       	width:100%;
       	padding: 25px;
       	margin: 0 auto;
       	box-sizing: border-box;
       }
       #crmWebToEntityForm.zcwf_lblLeft * {
       	box-sizing: border-box;
       }
       #crmWebToEntityForm{text-align: left;}
       #crmWebToEntityForm * {
       	direction: ltr;
       }
       .zcwf_lblLeft .zcwf_title {
       	word-wrap: break-word;
       	padding: 0px 6px 10px;
       	font-weight:bold }.zcwf_lblLeft.cpT_primaryBtn:hover{
       	background: linear-gradient(#02acff 0,#006be4 100%) no-repeat padding-box !important;
       	box-shadow: 0 -2px 0 0 #0159b9 inset !important;
       	border: 0 !important;
       	color: #fff !important;
       	outline: 0 !important;
       }.zcwf_lblLeft .zcwf_col_fld input[type=text], input[type=password], .zcwf_lblLeft .zcwf_col_fld textarea {
       	width: 60%;
       	border: 1px solid #c0c6cc !important;
       	resize: vertical;
       	border-radius: 2px;
       	float: left;
       }
       .zcwf_lblLeft .zcwf_col_lab {
       	width: 30%;
       	word-break: break-word;
       	padding: 0px 6px 0px;
       	margin-right: 10px;
       	margin-top: 5px;
       	float: left;
       	min-height: 1px;
       }
       .zcwf_lblLeft .zcwf_col_fld {
       	float: left;
       	width: 68%;
       	padding: 0px 6px 0px;
       	position: relative;
       	margin-top: 5px;
       }
       .zcwf_lblLeft .zcwf_privacy{padding: 6px;}
       .zcwf_lblLeft .wfrm_fld_dpNn{display: none;}
       .dIB{display: inline-block;}
       .zcwf_lblLeft .zcwf_col_fld_slt {
       	width: 60%;
       	border: 1px solid #ccc;
       	background: #fff;
       	border-radius: 4px;
       	font-size: 16px;
       	float: left;
       	resize: vertical;
       	padding: 2px 5px;
       }
       .zcwf_lblLeft .zcwf_row:after, .zcwf_lblLeft .zcwf_col_fld:after {
       	content: '';
       	display: table;
       	clear: both;
       }
       .zcwf_lblLeft .zcwf_col_help {
       	float: left;
       	margin-left: 7px;
       	font-size: 16px;
       	max-width: 35%;
       	word-break: break-word;
       }
       .zcwf_lblLeft .zcwf_help_icon {
       	cursor: pointer;
       	width: 16px;
       	height: 16px;
       	display: inline-block;
       	background: #fff;
       	border: 1px solid #c0c6cc;
       	color: #c1c1c1;
       	text-align: center;
       	font-size: 11px;
       	line-height: 16px;
       	font-weight: bold;
       	border-radius: 50%;
       }
       .zcwf_lblLeft .zcwf_row {margin: 15px 0px;}
       .zcwf_lblLeft .formsubmit {
       	margin-right: 5px;
       	cursor: pointer;
       	color: #292743 !important;
       	font-size: 16px;
       }
       .zcwf_lblLeft .zcwf_privacy_txt {
       	width: 90%;
       	color: rgb(0, 0, 0);
       	font-size: 16px;
       	font-family: Figtree;
       	display: inline-block;
       	vertical-align: top;
       	color: var(--baseColor);
       	padding-top: 2px;
       	margin-left: 6px;
       }
       .zcwf_lblLeft .zcwf_button {
       	font-size: 16px;
       	color: var(--baseColor);
       	border: 1px solid #c0c6cc;
       	padding: 3px 9px;
       	border-radius: 4px;
       	cursor: pointer;
       	max-width: 120px;
       	overflow: hidden;
       	text-overflow: ellipsis;
       	white-space: nowrap;
       }
       .zcwf_lblLeft .zcwf_tooltip_over{
       	position: relative;
       }
       .zcwf_lblLeft .zcwf_tooltip_ctn{
       	position: absolute;
       	background: #dedede;
       	padding: 3px 6px;
       	top: 3px;
       	border-radius: 4px;word-break: break-word;
       	min-width: 100px;
       	max-width: 150px;
       	color: var(--baseColor);
       	z-index: 100;
       }
       .zcwf_lblLeft .zcwf_ckbox{
       	float: left;
       }
       .zcwf_lblLeft .zcwf_file{
       	width: 55%;
       	box-sizing: border-box;
       	float: left;
       }
       .clearB:after{
       	content:'';
       	display: block;
       	clear: both;
       }
       @media all and (max-width: 600px) {
       	.zcwf_lblLeft .zcwf_col_lab, .zcwf_lblLeft .zcwf_col_fld {
       		width: auto;
       		float: none !important;
       	}
       	.zcwf_lblLeft .zcwf_col_help {width: 40%;}
       }
       </style>
       <div class='zcwf_title' style='max-width: 600px;color: #FFFFFF; font-family:Figtree;'>Ali-corn contact form</div><div class='zcwf_row'><div class='zcwf_col_lab' style='font-size:16px; font-family: Figtree;'><label for='First_Name'>First Name<span style='color:red;'>*</span></label></div><div class='zcwf_col_fld'><input type='text' id='First_Name' name='First Name' maxlength='40'></input><div class='zcwf_col_help'></div></div></div><div class='zcwf_row'><div class='zcwf_col_lab' style='font-size:16px; font-family: Figtree;'><label for='Last_Name'>Last Name<span style='color:red;'>*</span></label></div><div class='zcwf_col_fld'><input type='text' id='Last_Name' name='Last Name' maxlength='80'></input><div class='zcwf_col_help'></div></div></div><div class='zcwf_row'><div class='zcwf_col_lab' style='font-size:16px; font-family: Figtree;'><label for='Company'>Company<span style='color:red;'>*</span></label></div><div class='zcwf_col_fld'><input type='text' id='Company' name='Company' maxlength='200'></input><div class='zcwf_col_help'></div></div></div><div class='zcwf_row wfrm_fld_dpNn'><div class='zcwf_col_lab' style='font-size:16px; font-family: Figtree;'><label for='Lead_Source'>Lead Source</label></div><div class='zcwf_col_fld'><select class='zcwf_col_fld_slt' id='Lead_Source' name='Lead Source'  >
       			<option value='-None-'>-None-</option>
       			<option value='Advertisement'>Advertisement</option>
       			<option value='Cold Call'>Cold Call</option>
       			<option value='Employee Referral'>Employee Referral</option>
       			<option value='External Referral'>External Referral</option>
       			<option value='Partner'>Partner</option>
       			<option value='Online Store'>Online Store</option>
       			<option value='Public Relations'>Public Relations</option>
       			<option value='Trade Show'>Trade Show</option>
       			<option value='Sales Email Alias'>Sales Email Alias</option>
       			<option value='Seminar Partner'>Seminar Partner</option>
       			<option value='Facebook'>Facebook</option>
       			<option value='Internal Seminar'>Internal Seminar</option>
       			<option value='Twitter'>Twitter</option>
       			<option value='Web Download'>Web Download</option>
       		<option selected value='Web Research'>Web Research</option>
       			<option value='Chat'>Chat</option>
       			<option value='Google+'>Google+</option>
       		</select><div class='zcwf_col_help'></div></div></div><div class='zcwf_row'><div class='zcwf_col_lab' style='font-size:16px; font-family: Figtree;'><label for='Description'>Description</label></div><div class='zcwf_col_fld'><textarea id='Description' name='Description'></textarea><div class='zcwf_col_help'></div></div></div><div class='zcwf_row'><div class='zcwf_col_lab'></div><div class='zcwf_col_fld'><input type='submit' id='formsubmit' class='formsubmit zcwf_button' value='Submit' title='Submit'></div></div>
       	<script>
   
        	  function checkMandatory690413000000430001() {
       		var mndFileds = new Array('Company','First Name','Last Name');
       		var fldLangVal = new Array('Company','First\x20Name','Last\x20Name');
       		for(i=0;i<mndFileds.length;i++) {
       		  var fieldObj=document.forms['WebToLeads690413000000430001'][mndFileds[i]];
       		  if(fieldObj) {
       			if (((fieldObj.value).replace(/^\s+|\s+$/g, '')).length==0) {
       			 if(fieldObj.type =='file')
       				{ 
       				 alert('Please select a file to upload.'); 
       				 fieldObj.focus(); 
       				 return false;
       				} 
       			alert(fldLangVal[i] +' cannot be empty.'); 
          	   	  	  fieldObj.focus();
          	   	  	  return false;
       			}  else if(fieldObj.nodeName=='SELECT') {
         	   	   	 if(fieldObj.options[fieldObj.selectedIndex].value=='-None-') {
       				alert(fldLangVal[i] +' cannot be none.'); 
       				fieldObj.focus();
       				return false;
       			   }
       			} else if(fieldObj.type =='checkbox'){
        	 	 	 if(fieldObj.checked == false){
       				alert('Please accept  '+fldLangVal[i]);
       				fieldObj.focus();
       				return false;
       			   } 
       			 } 
       			 try {
       			     if(fieldObj.name == 'Last Name') {
       				name = fieldObj.value;
        	 	 	    }
       			} catch (e) {}
       		    }
       		}
       	var urlparams = new URLSearchParams( window.location.search);
       	if(urlparams.has('service') && (urlparams.get('service')==='smarturl')){
       		var webform = document.getElementById('webform');
       		 var service =  urlparams.get('service'); 
       		var smarturlfield = document.createElement('input');
       		smarturlfield.setAttribute('type','hidden');
       		smarturlfield.setAttribute('value',service);
       		smarturlfield.setAttribute('name','service');
       		webform.appendChild(smarturlfield); 
       	}
       document.querySelector('.crmWebToEntityForm .formsubmit').setAttribute('disabled', true);
       	}
   
       function tooltipShow690413000000430001(el){
       	var tooltip = el.nextElementSibling;
       	var tooltipDisplay = tooltip.style.display;
       	if(tooltipDisplay == 'none'){
       		var allTooltip = document.getElementsByClassName('zcwf_tooltip_over');
       		for(i=0; i<allTooltip.length; i++){
       			allTooltip[i].style.display='none';
       		}
       		tooltip.style.display = 'block';
       	}else{
       		tooltip.style.display='none';
       	}
       }
       </script>
       	<!-- Do not remove this --- Analytics Tracking code starts --><script id='wf_anal' src='https://crm.zohopublic.eu/crm/WebFormAnalyticsServeServlet'></script><!-- Do not remove this --- Analytics Tracking code ends. --></form>
       </div>
       ```
   

Viewing 3 replies - 1 through 3 (of 3 total)

 *  [Animesh Gaurav](https://wordpress.org/support/users/bizanimesh/)
 * (@bizanimesh)
 * [2 years, 1 month ago](https://wordpress.org/support/topic/custom-html-24/#post-17684010)
 * Hello there – the above code can’t be added to the site with WordPress.com free
   plan because it contains some restricted code ([full list is here](https://wordpress.com/support/code/#html))
   like JS, CSS, and some tags from HTML like “input”.
 * Also from your question it sounds like you have a WordPress.com site so you may
   ask any questions related to WordPress.com site at: [https://wordpress.com/forums](https://wordpress.com/forums).
 *  Thread Starter [goddessdiana](https://wordpress.org/support/users/goddessdiana/)
 * (@goddessdiana)
 * [2 years, 1 month ago](https://wordpress.org/support/topic/custom-html-24/#post-17684224)
 * I am in the explorer plan and i already used html block before.
 * I can also see the CSS is installed with jetpack.
 * I wrote on the other forum as well.
 *  Moderator [Support Moderator](https://wordpress.org/support/users/moderator/)
 * (@moderator)
 * [2 years, 1 month ago](https://wordpress.org/support/topic/custom-html-24/#post-17684843)
 * That is a WordPress.com site, which we can’t help with here.
 * To clear up any confusion, WordPress.com and WordPress.org are two different 
   entities: [https://wordpress.org/documentation/article/difference-between-wordpress-org-and-wordpress-com/](https://wordpress.org/documentation/article/difference-between-wordpress-org-and-wordpress-com/)
 * WordPress.com has complete documentation and support contacts at [https://wordpress.com/support/](https://wordpress.com/support/)
 * Thread continues at [https://wordpress.com/forums/topic/custom-html-12/](https://wordpress.com/forums/topic/custom-html-12/)

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Custom html’ is closed to new replies.

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [html](https://wordpress.org/support/topic-tag/html/)
 * [WordPress](https://wordpress.org/support/topic-tag/wordpress/)

 * In: [WordPress Mobile App](https://wordpress.org/support/forum/mobile/)
 * 3 replies
 * 2 participants
 * Last reply from: [Support Moderator](https://wordpress.org/support/users/moderator/)
 * Last activity: [2 years, 1 month ago](https://wordpress.org/support/topic/custom-html-24/#post-17684843)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics