Streaming live at 10am (PST)

Embed Code Issue


#1

Hi All,

Since Webflow have updated the way they handle code, I’ve not got a few issues with some embedded code on bedroom one page. It looks fine within designer but when published it’s all gone out of line.

Share link below if anybody could help to fix it?

https://preview.webflow.com/preview/irton-hall?preview=4cab9c23874300fc291e222f9dfcb948

This is how it looks when published.

http://irton-hall.webflow.io/bedroom-one

cheers
David


#2

Maybe start by removing that part from your codes


#3

Cheers Vincent, will give it a try. Hope you’re well?


#4

Nah, that didn’t help :frowning:


#5

Hi Vincent, could you have a look at the code for me and give me a price to fix it?

cheers
David


#6

Hi @1960creative, I was taking a look and it seems there is some trouble with the form html code, where did you get this code originally?

There ae some unclosed tags in the code, here is the first one I could see that was reported by the unclosed tag finder tool:

Closing tag </span> on line 72 does not match open tag <fieldset id="availability"> on line 62.

This is this place in the form code:

Basically, it looks like there are closing tags which are expected but not found in the right place in the html form code:

Custom code can be tricky, so knowing where this code came from to see if there is an original version of this code that does not have the closing tag issues would probably be the next step.


#7

Hi Dave, thanks for your recent comment. The original code was supplied by a 3rd party who controls the bookings etc. This all worked fine before, but was too long to re-upload as there was a character limit?

I’ve included the original code as requested.

Booking Widget #block-block-3, iframe { position: absolute; top: 0px; right: 0px; z-index: 10; margin: 1em 0; float: right; } /* fieldset styling */ fieldset#availability, #InnQuest { padding: 0.2em 0.5em; margin: 0; border : none; background: #f9d2aa; width: 225px; } #res_widget td { font-size: 0.9em; } /* legend styling */ #availability legend { display: none; } #availability table { margin: 0 0 0.5em 0; border: none; border-collapse: collapse; } #availability tbody { border: none; } #availability table td { padding: 0 10px 0 0; } form p { position: relative; margin: 3px 0; padding: 0; } form#aspnetForm p.no_margin { margin: 0; } input.submit { width: auto; } br.empty { margin: 0; padding: 0; height: 1px; } .holder { float: left; } .holder div { float: left; margin-right: 5px; display: inline; } .small { font-size: 0.9em; }
function Summit() { if (document.frmWidget.cboProperty.value == "") { alert("Please choose acccommdation"); return false; } else if (document.frmWidget.cboProperty.value == "1") { document.frmWidget.action = "https://www.irtonhall-reservations.co.uk:448/asp/home.asp" } else { //document.frmWidget.action = "some other property url" } document.frmWidget.target = "top" document.frmWidget.submit(); }
    function showCurrentTime()
    {


        var currentDate = new Date()

        var day = currentDate.getDate()
        var month = currentDate.getMonth()
        var year = currentDate.getFullYear()


        month = month + 1;

        if (month <= 9)
        {

            month = "0" + parseInt(month)

        }

        document.frmWidget.CIY.value = year;
        document.frmWidget.CIM.value = month;
        document.frmWidget.CID.value = day;

        document.frmWidget.COY.value = year;
        document.frmWidget.COM.value = month;
        document.frmWidget.COD.value = parseInt(day) + 1;
    }

    document.body.onload = function ()
    {
        showCurrentTime();
    }
</script>
<form name="frmWidget" method="get" id="frmWidget" action="" onload="showCurrentTime()">
<fieldset id="availability">
    <legend><font face="Calibri" color="black">Hotel Availability</font></legend>
    <select name="cboProperty" id="cboProperty" style="width: 180px;">
        <option value="">Choose Accommodation...</option>
        <option value="1">Irton Hall: B&B Accommodation</option>
    </select>
    <label for="CIM"><font face="Calibri" color="black">Arrival Date:</font></label>
    <br />
    <table cellpadding="0" cellspacing="0" border="0">
        <tbody>
            <tr>
                <td scope="col">
                    <select name="CIM" size="1" id="CIM">
                        <option value="01" selected="selected">January</option>
                        <option value="02">February</option>
                        <option value="03">March</option>
                        <option value="04">April</option>
                        <option value="05">May</option>
                        <option value="06">June</option>
                        <option value="07">July</option>
                        <option value="08">August</option>
                        <option value="09">September</option>
                        <option value="10">October</option>
                        <option value="11">November</option>
                        <option value="12">December</option>
                    </select>
                </td>
                <!--month-->
                <td scope="col">
                    <select name="CID" size="1" id="CID">
                        <option value="01" selected="selected">01</option>
                        <option value="02">02</option>
                        <option value="03">03</option>
                        <option value="04">04</option>
                        <option value="05">05</option>
                        <option value="06">06</option>
                        <option value="07">07</option>
                        <option value="08">08</option>
                        <option value="09">09</option>
                        <option value="10">10</option>
                        <option value="11">11</option>
                        <option value="12">12</option>
                        <option value="13">13</option>
                        <option value="14">14</option>
                        <option value="15">15</option>
                        <option value="16">16</option>
                        <option value="17">17</option>
                        <option value="18">18</option>
                        <option value="19">19</option>
                        <option value="20">20</option>
                        <option value="21">21</option>
                        <option value="22">22</option>
                        <option value="23">23</option>
                        <option value="24">24</option>
                        <option value="25">25</option>
                        <option value="26">26</option>
                        <option value="27">27</option>
                        <option value="28">28</option>
                        <option value="29">29</option>
                        <option value="30">30</option>
                        <option value="31">31</option>
                    </select>
                </td>
                <!--Day-->
                <td scope="col">
                    <select name="CIY" size="1" id="CIY">
                        <option value="2012" selected="selected">2012</option>
                        <option value="2013">2013</option>
                    </select>
                </td>
                <!--Year-->
            </tr>
        </tbody>
    </table>
    <!--Arrival Date-->
    <label for="COM"><font face="Calibri" color="black">Departure Date:</font></label>
    <br class="clear" />
    <table cellpadding="0" cellspacing="0">
        <tbody>
            <tr>
                <td scope="col">
                    <select name="COM" size="1" id="COM">
                        <option value="01" selected="selected">January</option>
                        <option value="02">February</option>
                        <option value="03">March</option>
                        <option value="04">April</option>
                        <option value="05">May</option>
                        <option value="06">June</option>
                        <option value="07">July</option>
                        <option value="08">August</option>
                        <option value="09">September</option>
                        <option value="10">October</option>
                        <option value="11">November</option>
                        <option value="12">December</option>
                    </select>
                </td>
                <td scope="col">
                    <select name="COD" size="1" id="COD">
                        <option value="01" selected="selected">01</option>
                        <option value="02">02</option>
                        <option value="03">03</option>
                        <option value="04">04</option>
                        <option value="05">05</option>
                        <option value="06">06</option>
                        <option value="07">07</option>
                        <option value="08">08</option>
                        <option value="09">09</option>
                        <option value="10">10</option>
                        <option value="11">11</option>
                        <option value="12">12</option>
                        <option value="13">13</option>
                        <option value="14">14</option>
                        <option value="15">15</option>
                        <option value="16">16</option>
                        <option value="17">17</option>
                        <option value="18">18</option>
                        <option value="19">19</option>
                        <option value="20">20</option>
                        <option value="21">21</option>
                        <option value="22">22</option>
                        <option value="23">23</option>
                        <option value="24">24</option>
                        <option value="25">25</option>
                        <option value="26">26</option>
                        <option value="27">27</option>
                        <option value="28">28</option>
                        <option value="29">29</option>
                        <option value="30">30</option>
                        <option value="31">31</option>
                    </select>
                </td>
                <!--Day-->
                <td scope="col">
                    <select name="COY" size="1" id="COY">
                        <option value="2012" selected="selected">2012</option>
                        <option value="2013">2013</option>
                    </select>
                </td>
                <!--Year-->
            </tr>
        </tbody>
    </table>
    <!--Departure Date-->
    <table cellpadding="0" cellspacing="0" id="numbers">
        <tbody>
            <tr>
                <td scope="col" width="49px">
                    <label for="AD"><font face="Calibri" color="black">Adults:</font></label>
                    <br />
                    <select name="AD" id="AD">
                        <option value="1">1</option>
                        <option value="2" selected="selected">2</option>
                        <option value="3">03</option>
                        <option value="4">04</option>
                        <option value="5">05</option>
                        <option value="6">06</option>
                        <option value="7">07</option>
                        <option value="8">08</option>
                        <option value="9">09</option>
                        <option value="10">10</option>
                    </select>
                </td>
                <!--Adults-->
                <td scope="col">
                    <label for="CH"><font face="Calibri" color="black">Children:</font></label>
                    <br />
                    <select name="CH" id="CH">
                        <option value="0" selected="selected">0</option>
                        <option value="1">1</option>
                        <option value="2">2</option>
                        <option value="3">03</option>
                        <option value="4">04</option>
                        <option value="5">05</option>
                        <option value="6">06</option>
                        <option value="7">07</option>
                        <option value="8">08</option>
                        <option value="9">09</option>
                        <option value="10">10</option>
                    </select>
                </td>
                <!--Children-->
                <td scope="col">
                    <!--<input size="10" name="PromoCode" maxlength="10" value="" type="text" id="PromoCode"> -->
                </td>
                <!--Promo Code-->
            </tr>
        </tbody>
    </table>
    <!--Adults, Children-->
    <input type="button" name="action1" onclick="Summit();" value="Check Availability">
</fieldset>
</form>

cheers
David