• Login
    • Search
    • [[global:header.categories]]
    • [[global:header.recent]]
    • [[global:header.popular]]
    • MyVR.com

    Solved Installing Booking and Calendar on Personal Site

    Other
    3
    20
    14336
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Tristan Brotherton
      Tristan Brotherton MyVR Employee last edited by Danny Eiden

      Hi Ismael,

      If your property is not enabled (active), or you don’t have online booking enabled in MyVR. You will see this type of behavior. Is the property your doing this for ready to be online bookable?

      1 Reply Last reply Reply Quote 0
      • I
        Ismael Burciaga last edited by

        THANKS turning it active now… also how do i get the property ID number? I have looked everywhere and cant find it.

        Thanks

        1 Reply Last reply Reply Quote 0
        • Tristan Brotherton
          Tristan Brotherton MyVR Employee last edited by Tristan Brotherton

          @Ismael-Burciaga you can find that on the widgets application page:

          0_1486066848142_upload-a4edffb0-8e55-49da-977a-30b2371a0673

          In the property Keys section

          Out of interest, why do you need the key, I see it’s already in the code you posted?

          I 1 Reply Last reply Reply Quote 0
          • I
            Ismael Burciaga @Tristan Brotherton last edited by

            @Tristan-Brotherton Thanks! I copied the code exactly from your documentation. I assume that would not be mine.

            1 Reply Last reply Reply Quote 0
            • I
              Ismael Burciaga last edited by Tristan Brotherton

              Ok so I finaly figured out the booking widget but when i paste the code in the template, it just sends me to myvr.com

              <script type='text/javascript'>
                  var _myvr = _myvr || {};
                  _myvr.bookingButtons = _myvr.bookingButtons || [];
                  _myvr.bookingButtons.push({
                      property: '8b5a23c3c939090d',
                      text: 'Book Now',
                      index: _myvr.bookingButtons.length,
                      id: ''
                  });
                  (function(buttonIndex) {
                      var allScripts = document.getElementsByTagName('script');
                      var thisScript = allScripts[allScripts.length -1];
                      thisScript.id = 'myvrBookingButtonScript_' + buttonIndex;
                      if (!document.getElementById('myvrBookingButtonScriptLoader')) {
                          var bookingButton = document.createElement('script');
                          bookingButton.type = 'text/javascript';
                          bookingButton.async = true;
                          bookingButton.id = 'myvrBookingButtonScriptLoader';
                          bookingButton.src = ('https:' == document.location.protocol ? 'https://' : 'http://')
                              + 'static.myvr.com/public/booking-button/widget.js';
                          var s = document.getElementsByTagName('script')[0];
                          s.parentNode.insertBefore(bookingButton, s);
                      }
                  })(_myvr.bookingButtons.length - 1);
              </script>
              
              

              URL: http://184.168.30.222/~buttercuphaven/the-property/

              The property is active.

              Not sure what my issue is.

              1 Reply Last reply Reply Quote 0
              • I
                Ismael Burciaga last edited by

                Actually, is it possible to place a booking form on our website page? I noticed that the code above is for a button. Also if so, can you help me install it/use the right code?

                We are officially paying for the service and all we want to do is put a booking form and the availability calendar on our page. So frustrating theres not like a simple iframe or embed code we can just place. When we do place the code, it just sends us to myvr.com

                Thanks

                1 Reply Last reply Reply Quote 0
                • Danny Eiden
                  Danny Eiden last edited by Tristan Brotherton

                  Hi Ismael,

                  I looked around in your website and noticed a few things.

                  1. The code you were originally using was for MyVR.js. MyVR.js is a Javascript library that allows you to create a fully custom website with access to a lot of data within your MyVR account.
                    The booking widget is a different option for people who want to use MyVR without using our website. It is a small bit of Javascript that you place in your website where you would like a booking button to appear. It is a much simpler option.

                  2. As you mentioned, you copied code directly from the MyVR.js documentation. This code illustrates how to call the function, but should not be copied directly. If copied directly, it will immediately redirect the web browser to the booking page for the property with ID b6b0f2fe278f612b. This is a made up property ID used only in example documentation, so it causes an error that redirects the browser again to myvr.com. You should remove the code you copied to stop your page from taking you to the MyVR website.

                  3. If you’d like the Book Now button currently on your website to take you to the MyVR booking page, you should remove the href attribute from that button and add an id attribute to that button. Then enter that id into MyVR when building the widget Here is an example of using an existing button on the page with the MyVR booking widget. Here is a screenshot of the UI in MyVR for entering an id for the button
                    0_1486586635951_Screen Shot 2017-02-08 at 12.42.39 PM.png
                    Note that this is optional. You can simply set “I’ll Use My Own Button” to “No” and copy the code we provide to wherever you want our button to appear.

                  Now, to answer your question

                  Actually, is it possible to place a booking form on our website page?

                  We do not offer a ready-made booking form to put on a web page. You can, however, use MyVR.js to build a form that collects all relevant information (check in, check out, number of adults, etc.) before taking renters to the booking page MyVR provides. When the renter gets to the booking page, all of the information they filled out on your web page would already be filled in. We do not offer the ability to complete the entire booking process on 3rd party web pages because of issues with credit card security.

                  Lastly

                  So frustrating theres not like a simple iframe or embed code we can just place.

                  I am sorry that this experience has been frustrating. You can, however, simply place the Booking Widget code anywhere in your website to generate a booking button. You can also use our calendar widget to display the availability and rates of your property on your website.

                  Our booking default booking button looks like this
                  0_1486587685559_Screen Shot 2017-02-08 at 1.01.08 PM.png
                  And our default calendar looks like this
                  0_1486587834749_Screen Shot 2017-02-08 at 1.03.45 PM.png

                  I hope this helps.

                  Cheers,
                  Danny

                  1 Reply Last reply Reply Quote 0
                  • I
                    Ismael Burciaga last edited by

                    Thanks for following up. So is this website here using one of your websites or is it custom website http://www.sonomasquarecottage.com/rates-and-calendar/

                    Thanks

                    Danny Eiden 1 Reply Last reply Reply Quote 0
                    • Danny Eiden
                      Danny Eiden @Ismael Burciaga last edited by

                      @Ismael-Burciaga said in Installing Booking and Calendar on Personal Site:

                      Thanks for following up. So is this website here using one of your websites or is it custom website http://www.sonomasquarecottage.com/rates-and-calendar/

                      You’re welcome. That website is one of our websites. It was custom built using MyVR’s website builder.

                      1 Reply Last reply Reply Quote 0
                      • I
                        Ismael Burciaga last edited by

                        Ok perfect thanks for the quick reply. Last question, I went to this link to view my property and it says its broke. Did i forget something when setting up my property?

                        Thanks

                        Danny Eiden 1 Reply Last reply Reply Quote 0
                        • Danny Eiden
                          Danny Eiden @Ismael Burciaga last edited by

                          @Ismael-Burciaga That looks like it might be a bug. Could you report that using the “Support” button in MyVR or using our public contact page? There’s also a handy “Report an Issue” button on the home page of the MyVR Community.

                          Thanks,
                          Danny

                          1 Reply Last reply Reply Quote 0
                          • I
                            Ismael Burciaga last edited by

                            Danny thanks for the reply.

                            Ok so I have added the correct code onto my wordpress site for the booking button and the calendar but not sure why it keeps taking me to myVR when i visit the page:

                            CODE IN HEAD:

                            <script type=“text/javascript” src=“https://static.myvr.com/public/myvrjs/v1/myvr.js”></script>
                            <script type=“text/javascript”>
                            myvr.init(“LIVE_5fa27a801402eb92ef1f4ec27e0a8672”);
                            </script>

                            CODE IN PAGE TEMPLATE:

                            		<div class="booking-form">
                            		
                            			<div class="myvr-calendar">
                            				<script id='myvrCalendarScript' type='text/javascript'>
                            				  (function(m,y,v,r,t,a,g){m.MyVRWidgetObject=t,m[t]=m[t]||function(){
                            				  (m[t].q=m[t].q||[]).push(arguments);},m[t].l=1*new Date(),a=y.createElement(v),
                            				  g=y.getElementsByTagName(v)[0],a.async=1,a.src=r,g.parentNode.insertBefore(a,g);
                            				  }(window,document,'script','https://static.myvr.com/public/calendar/widget.js','myvr'));
                            				  myvr('calendar', {propertyKey:'8b5a23c3c939090d', showRates:false});
                            				
                            				  /*
                            				    You can optionally specify a unique HTML element id as a 3rd parameter
                            				    above.  If specified, the calendar will be rendered at the element
                            				    instead of inline.
                            				
                            				    myvr('calendar', {
                            				      propertyKey:'8b5a23c3c939090d',
                            				      showRates:false,
                            				      elementId:'#elementId'
                            				    });
                            				  */
                            				</script>
                            
                            			</div>
                            
                            
                            			<script type='text/javascript'>
                            			    var _myvr = _myvr || {};
                            			    _myvr.bookingButtons = _myvr.bookingButtons || [];
                            			    _myvr.bookingButtons.push({
                            			        property: '8b5a23c3c939090d',
                            			        text: 'Book Now',
                            			        index: _myvr.bookingButtons.length,
                            			        id: ''
                            			    });
                            			    (function(buttonIndex) {
                            			        var allScripts = document.getElementsByTagName('script');
                            			        var thisScript = allScripts[allScripts.length -1];
                            			        thisScript.id = 'myvrBookingButtonScript_' + buttonIndex;
                            			        if (!document.getElementById('myvrBookingButtonScriptLoader')) {
                            			            var bookingButton = document.createElement('script');
                            			            bookingButton.type = 'text/javascript';
                            			            bookingButton.async = true;
                            			            bookingButton.id = 'myvrBookingButtonScriptLoader';
                            			            bookingButton.src = ('https:' == document.location.protocol ? 'https://' : 'http://')
                            			                + 'static.myvr.com/public/booking-button/widget.js';
                            			            var s = document.getElementsByTagName('script')[0];
                            			            s.parentNode.insertBefore(bookingButton, s);
                            			        }
                            			    })(_myvr.bookingButtons.length - 1);
                            			</script>
                            
                            
                            		</div>
                            

                            PAGE I HAVE THE CODE ON: http://184.168.30.222/~buttercuphaven/the-property/

                            Is there something I am doing wrong?

                            Thanks

                            1 Reply Last reply Reply Quote 0
                            • Tristan Brotherton
                              Tristan Brotherton MyVR Employee last edited by

                              @Ismael-Burciaga Looking at your page source I see other invalid code in there.

                              <script>
                              					var promise = myvr.book({
                              					    property: "b6b0f2fe278f612b",
                              					    adults: 1,
                              					    children: 1,
                              					    checkIn: "2016-01-01",
                              					    checkOut: "2016-02-01",
                              					    addons: ["caeb9c167089c18e", "99676ebdd62342e3"],
                              					});					
                              				</script>
                              

                              For example.

                              My suggestion: clean up and remove all of the javascript in your page, and use the booking link provided to you in the widget for your book now button.

                              1 Reply Last reply Reply Quote 0
                              • I
                                Ismael Burciaga last edited by

                                Hello tristan,

                                Where did you see that code at? I looked at my page-template and didnt see

                                <script>
                                var promise = myvr.book({
                                property: “b6b0f2fe278f612b”,
                                adults: 1,
                                children: 1,
                                checkIn: “2016-01-01”,
                                checkOut: “2016-02-01”,
                                addons: [“caeb9c167089c18e”, “99676ebdd62342e3”],
                                });
                                </script>

                                Thanks

                                1 Reply Last reply Reply Quote 0
                                • I
                                  Ismael Burciaga last edited by

                                  OH man I was putting the code on the wrong page template… Ok if i have any other issues, I will ping you.

                                  1 Reply Last reply Reply Quote 0
                                  • I
                                    Ismael Burciaga last edited by

                                    Ok So i see the book now button but now I dont see my calendar. I used the code:

                                    			<div class="myvr-calendar">
                                    				<script id='myvrCalendarScript' type='text/javascript'>
                                    				  (function(m,y,v,r,t,a,g){m.MyVRWidgetObject=t,m[t]=m[t]||function(){
                                    				  (m[t].q=m[t].q||[]).push(arguments);},m[t].l=1*new Date(),a=y.createElement(v),
                                    				  g=y.getElementsByTagName(v)[0],a.async=1,a.src=r,g.parentNode.insertBefore(a,g);
                                    				  }(window,document,'script','https://static.myvr.com/public/calendar/widget.js','myvr'));
                                    				  myvr('calendar', {propertyKey:'8b5a23c3c939090d', showRates:false});
                                    				
                                    				  /*
                                    				    You can optionally specify a unique HTML element id as a 3rd parameter
                                    				    above.  If specified, the calendar will be rendered at the element
                                    				    instead of inline.
                                    				
                                    				    myvr('calendar', {
                                    				      propertyKey:'8b5a23c3c939090d',
                                    				      showRates:false,
                                    				      elementId:'#elementId'
                                    				    });
                                    				  */
                                    				</script>
                                    
                                    			</div>
                                    

                                    Thanks

                                    1 Reply Last reply Reply Quote 0
                                    • Danny Eiden
                                      Danny Eiden last edited by

                                      Hi Ismael,

                                      The issue is that you still have some MyVR.js code on your page that is preventing the calendar widget from working properly. If you remove the following bits of code, the calendar should work.

                                      <script type="text/javascript" src="https://static.myvr.com/public/myvrjs/v1/myvr.js"></script>
                                      
                                      <script type="text/javascript">
                                        myvr.init("LIVE_5fa27a801402eb92ef1f4ec27e0a8672");
                                      </script>
                                      

                                      Here is an example with those lines of code commented out. You can see that the calendar appears. If you uncomment the lines of code (e.g. remove the <!-- -->), you will see that the calendar stops working.

                                      Best,
                                      Danny

                                      1 Reply Last reply Reply Quote 0
                                      • I
                                        Ismael Burciaga last edited by

                                        Danny Thanks. I will remove that.

                                        Also, my client is wanting the GET A QUOTE page like this page: http://www.sonomasquarecottage.com/rates-and-calendar/ who is using your service.

                                        Is that a form you offer your customers too if someone has their own website? like maybe a link similar to the BOOK NOW link?

                                        Thanks
                                        Ismael

                                        Danny Eiden 1 Reply Last reply Reply Quote 0
                                        • Danny Eiden
                                          Danny Eiden @Ismael Burciaga last edited by

                                          Also, my client is wanting the GET A QUOTE page like this page: >http://www.sonomasquarecottage.com/rates-and-calendar/ who is using your service.

                                          Is that a form you offer your customers too if someone has their own website? like maybe a link similar to the BOOK NOW link?

                                          Unfortunatly we do not offer a pre-built widget to get a quote. If you are comfortable writing custom HTML and JS, you can create your own form and use the MyVR.js Quote function to get a quote based on user input. However, as I mentioned earlier, using both MyVR.js and widgets on the same page can cause issues.

                                          1 Reply Last reply Reply Quote 0
                                          • First post
                                            Last post

                                          About the MyVR Community

                                          • Getting Started
                                          • Community Rules
                                          • Best Practices
                                          Copyright © 2016 - 2020 MyVR | Contact Us
                                          Admin Login | Logout