It's now common practice as a part of marketing strategy to use web-to-lead form onto website. Web-to-lead form is mainly used for capturing people information who has intention to get related service/product . Web-to-lead form are designed to automate of importing visitor information from the website to CRM as lead. Before couple of days I came across the fitting this web-to-lead form onto wordpress site's sidebar.After creating Web-to-lead form using Zoho CRM when I put the created code on the sidebar with text widget , it was just showing as picture give below-
How's looking? Yeah, it's not suitably fitted within the sidebar , I have indicated it with arrow sign. So what would be the solution to fitting it within the sidebar properly?
Option 1: Increasing the width of Wordpress theme sidebar:
Increasing the width of sidebar wouldn't be wise to fit it properly unless you need to increase the width of sidebar for theme design issue. For this you must have to understand of wordpress theme structure , CSS etc. I can say it's not the job of non-technical user. So for non-technical person should go for option 2.
Option 2: Reducing the width of Web-to-lead form :
Generated Web-to-lead form contains HTML/javascript code with div and tabular structure. If you looked for size attribute in the code to change, you will get. But reducing those size won't fit it properly unless you will not reduced the size of form field size. Unfortunately field size is not mentioned in the code. It uses default value. So just add the size attribute with giving a value less than 20 as the default value of text field is 20 and see how's look. Appearing somehow changed? That's great. Then set the value properly .Add the size attribute as following :
<input type='text' maxlength='40' size="15" name='First Name' />
Finally the Web-to-lead form should look like as following -
<input type='text' maxlength='40' size="15" name='First Name' />
Finally the Web-to-lead form should look like as following -
Hope, it will help someone.

