[Resolved] Site not optimized for mobile

Home Forums Support Site not optimized for mobile

  • This topic has 3 replies, 2 voices, and was last updated 1 year ago by Leo.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1011071
    Louie

    I received a note from Google that part of my site was not mobile friendly. Part of the content did not fit on the page when viewed with a mobile device. That would have to be my webform. I use Zoho CRM for web-to-lead. You have three choices when you put the form on your site:
    1. Embed
    2. iFrame
    3. Source

    I was using the embed when I got the Google email so I tried iFrame. It still did not fit. Zoho’s final response to me was: “Yes, Zoho CRM webform is not supported for mobile responsive. You can customise the Webform source code CSS for mobile responsive with a help of a web developer.
    Thank you!”

    Below is the source code. Is there a developer who can tell me what to change in this CSS, and where to place it? I am very far from being a developer. Thank you for any assistance, in advance.
    – Louie
    ============================
    <!– 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.
    – Do not remove captcha and other form elements that are necessary for the form to work. –>

    <META HTTP-EQUIV =’content-type’ CONTENT=’text/html;charset=UTF-8′>
    <form action=’https://crm.zoho.com/crm/WebToLeadForm&#8217; name=WebToLeads2948899000004769001 method=’POST’ onSubmit=’javascript:document.charset=”UTF-8″; return checkMandatory2948899000004769001()’ accept-charset=’UTF-8′>

    <!– Do not remove this code. –>
    <input type=’text’ style=’display:none;’ name=’xnQsjsdp’ value=’bdfd16a21a2ec020c0a69c05c347cb8c0a4e6df41a506058a68cb3bcecbfa790’/>
    <input type=’hidden’ name=’zc_gad’ id=’zc_gad’ value=”/>
    <input type=’text’ style=’display:none;’ name=’xmIwtLD’ value=’86ec4afebe098fd057686a327d2d49303401fcbb337d17787beb998a13d275bc’/>
    <input type=’text’ style=’display:none;’ name=’actionType’ value=’TGVhZHM=’/>

    <input type=’text’ style=’display:none;’ name=’returnURL’ value=’https://mindiq.com/thank-you’ />
    <!– Do not remove this code. –>
    <input type=’text’ style=’display:none;’ id=’ldeskuid’ name=’ldeskuid’></input>
    <input type=’text’ style=’display:none;’ id=’LDTuvid’ name=’LDTuvid’></input>
    <!– Do not remove this code. –>
    <style>
    tr , td {
    padding:6px;
    border-spacing:0px;
    border-width:0px;
    }
    </style>
    <table style=’width:600px;background-color:#3d3d3d;color:#ffffff’>

    <tr><td colspan=’2′ style=’text-align:left;color:#ffffff;font-family:Arial;font-size:18px;’>MindIQ Training Request</td></tr>

    <tr><td style=’nowrap:nowrap;text-align:left;font-size:16px;font-family:Arial;width:200px;’>Company<span style=’color:red;’>*</span></td><td style=’width:250px;’ ><input type=’text’ style=’width:250px;’ maxlength=’100′ name=’Company’ /></td></tr>

    <tr><td style=’nowrap:nowrap;text-align:left;font-size:16px;font-family:Arial;width:200px;’>First Name<span style=’color:red;’>*</span></td><td style=’width:250px;’ ><input type=’text’ style=’width:250px;’ maxlength=’40’ name=’First Name’ /></td></tr>

    <tr><td style=’nowrap:nowrap;text-align:left;font-size:16px;font-family:Arial;width:200px;’>Last Name<span style=’color:red;’>*</span></td><td style=’width:250px;’ ><input type=’text’ style=’width:250px;’ maxlength=’80’ name=’Last Name’ /></td></tr>

    <tr><td style=’nowrap:nowrap;text-align:left;font-size:16px;font-family:Arial;width:200px;’>Phone<span style=’color:red;’>*</span></td><td style=’width:250px;’ ><input type=’text’ style=’width:250px;’ maxlength=’30’ name=’Phone’ /></td></tr>

    <tr><td style=’nowrap:nowrap;text-align:left;font-size:16px;font-family:Arial;width:200px;’>Email<span style=’color:red;’>*</span></td><td style=’width:250px;’ ><input type=’text’ style=’width:250px;’ maxlength=’100′ name=’Email’ /></td></tr>

    <tr><td style=’nowrap:nowrap;text-align:left;font-size:16px;font-family:Arial;width:200px;’>Let us know how we can help your team improve.<span style=’color:red;’>*</span> </td><td> <textarea name=’Description’ maxlength=’32000′ style=’width:250px;’> </textarea></td></tr>

    <tr><td style=’nowrap:nowrap;text-align:left;font-size:16px;font-family:Arial;width:200px;’>Enter the Captcha</td>
    <td><input type=’text’ style=’width:250px;’ maxlength=’80’ name=’enterdigest’ /></td>
    </tr>

    <tr><td></td>
    <!– Do not remove this code. –>
    <td>
    Reload</td>
    </tr>

    <tr><td colspan=’2′ style=’text-align:center; padding-top:15px;font-size:16px;’>
    <input style=’font-size:16px;color:#ffffff’ type=’submit’ value=’Submit’ />
    <input type=’reset’ style=’font-size:16px;color:#ffffff’ value=’Reset’ />
    </td>
    </tr>
    </table>
    <script>
    var mndFileds=new Array(‘Company’,’First Name’,’Last Name’,’Email’,’Phone’,’Description’);
    var fldLangVal=new Array(‘Company’,’First Name’,’Last Name’,’Email’,’Phone’,’Let us know how we can help your team improve.’);
    var name=”;
    var email=”;

    /* Do not remove this code. */
    function reloadImg() {
    if(document.getElementById(‘imgid’).src.indexOf(‘&d’) !== -1 ) {
    document.getElementById(‘imgid’).src=document.getElementById(‘imgid’).src.substring(0,document.getElementById(‘imgid’).src.indexOf(‘&d’))+’&d’+new Date().getTime();
    } else {
    document.getElementById(‘imgid’).src = document.getElementById(‘imgid’).src+’&d’+new Date().getTime();
    }
    }

    function checkMandatory2948899000004769001() {
    for(i=0;i<mndFileds.length;i++) {
    var fieldObj=document.forms[‘WebToLeads2948899000004769001’][mndFileds];
    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 +’ cannot be empty.’);
    fieldObj.focus();
    return false;
    } else if(fieldObj.nodeName==’SELECT’) {
    if(fieldObj.options[fieldObj.selectedIndex].value==’-None-‘) {
    alert(fldLangVal +’ cannot be none.’);
    fieldObj.focus();
    return false;
    }
    } else if(fieldObj.type ==’checkbox’){
    if(fieldObj.checked == false){
    alert(‘Please accept ‘+fldLangVal);
    fieldObj.focus();
    return false;
    }
    }
    try {
    if(fieldObj.name == ‘Last Name’) {
    name = fieldObj.value;
    }
    } catch (e) {}
    }
    }
    trackVisitor();
    }
    </script><script type=’text/javascript’ id=’VisitorTracking’>var $zoho= $zoho || {};$zoho.salesiq = $zoho.salesiq || {widgetcode:’874c63b8e1950b5e22c2af5686d1367b44f55c6f41c41ff2676ac445374961e0′, values:{},ready:function(){$zoho.salesiq.floatbutton.visible(‘hide’);}};var d=document;s=d.createElement(‘script’);s.type=’text/javascript’;s.id=’zsiqscript’;s.defer=true;s.src=’https://salesiq.zoho.com/widget&#8217;;t=d.getElementsByTagName(‘script’)[0];t.parentNode.insertBefore(s,t);function trackVisitor(){try{if($zoho){var LDTuvidObj = document.forms[‘WebToLeads2948899000004769001’][‘LDTuvid’];if(LDTuvidObj){LDTuvidObj.value = $zoho.salesiq.visitor.uniqueid();}var firstnameObj = document.forms[‘WebToLeads2948899000004769001’][‘First Name’];if(firstnameObj){name = firstnameObj.value +’ ‘+name;}$zoho.salesiq.visitor.name(name);var emailObj = document.forms[‘WebToLeads2948899000004769001’][‘Email’];if(emailObj){email = emailObj.value;$zoho.salesiq.visitor.email(email);}}} catch(e){}}</script>
    </form>
    <!– Do not remove this code. –>
    <iframe name=’captchaFrame’ style=’display:none;’></iframe>

    #1011072
    Leo
    Staff
    Customer Support

    Hi there,

    There is actually very little CSS that I can see – most of it is inline HTML style which is kind of bad practice and hard to overwrite.

    Are there any alternative options for this form plugin? It’s quite surprising to make something that’s not mobile responsive nowadays.

    If not then you can try looking for a developer on a site like Codeable:
    https://codeable.io/

    Or you can ask the plugin support to see if they can recommend anyone.

    #1011082
    Louie

    I can use Ninja forms. Not that hard to export and import a Lead. Worth it for a clean bill of health – IMHO. Thanks for the help, Leo.

    #1011085
    Leo
    Staff
    Customer Support
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.