Rentware Widgets

Introduction

Thank you for using Rentware Widgets.

List of widgets

Global Search Widget

This widget will redirect the user to your rentware shop with certain parameters:

time and date range
locations (optinal)
filter OR tab (optinal)
usefull for the home page on your website
preselected filter (optinal)
usefull for a category page on your website
sidebar style (optional)
usefull to display the widget as a sidebar on your website
different shop URLs (in case you have more than one shop URL, optional)

Item Price Widget

Shows the price of a specific item and will add the item to the cart in the rentware shop

Disposition Widget for multiple Items (single day view)

This widget is intended to see available time slots for multiple items within one day.

Note: We can also help you with the implementation if you don't feel confident working with code

Installation

You may need following things to get started.

You need access to the code of your Website.

Note: We can also help you with the implementation if you don't feel confident working with code

Get started with widgets

1. Empty container

First of all you need to add an container to your website where the widget should be placed:

<div id="rw-widget-global-search"></div>

2. The main script

This container will then be populated by our script.

Paste the widget script tag just before closing body tag. The following example is loading the dynamic global-search-widget (second last line)

<script>
    var loadRentwareWidgetScriptAsync = function(uri){
        return new Promise((resolve, reject) => {
        var tag = document.createElement('script');
        tag.src = uri;
        tag.async = true;
        tag.onload = () => {
            resolve();
        };
        var firstScriptTag = document.getElementsByTagName('script')[0];
        firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
    });
    }
    var rentwareWidgetScriptLoaded = loadRentwareWidgetScriptAsync('https://rentware-cwidgets-cdn.b-cdn.net/collections/globalSearchWidgetDynamic.js');
</script>

3. Adjust the output

Now to make the widget work you need to specify a couple of options like language, shop URL among other things. Have a look at the example that comes with each widget and play around with the options to see the changes.

Add another script after the one you inserted and before the closing body tag. It is important that the second script fires after the first one.

<script>
rentwareWidgetScriptLoaded.then(function(){
    GlobalSearchWithLocationsAndCategories.init({
        elementId: "rw-widget-global-search", // this tells our script which container to use
        shopUrl: "https://sprinter-rentals.rentware.io", // without forward slash in the end
        ...
        check out the different widget options on their dedicated pages.
    });
});
</script>

Note:

Documentation | Widgets version: 1.0