Default Cvent Button
<script type="text/javascript" src="https://www.cvent.com/wlrfps/js/widget/"></script>
<script type="text/javascript" charset="utf-8">
const options = {};
options.display = "window";
options.key ='a0c9d507-7bad-4979-9e89-8484f52f075f';
options.uid = '9145c8ec-7577-4658-8ee4-3180ec9a0b38';
var wlrfp_widget = new wlrfp.widget(options);
</script>
Default Cvent Secondary Button
<script type="text/javascript" src="https://www.cvent.com/wlrfps/js/widget/"></script>
<script type="text/javascript" charset="utf-8">
const options = {};
options.display = "window";
options.key ='a0c9d507-7bad-4979-9e89-8484f52f075f';
options.uid = '9145c8ec-7577-4658-8ee4-3180ec9a0b38';
options.button_theme = {
type: 'secondary'
}
var wlrfp_widget = new wlrfp.widget(options);
</script>
Customised Button
<script type="text/javascript" src="https://www.cvent.com/wlrfps/js/widget/"></script>
<script type="text/javascript" charset="utf-8">
const options = {};
options.display = "window";
options.key ='a0c9d507-7bad-4979-9e89-8484f52f075f';
options.uid = '9145c8ec-7577-4658-8ee4-3180ec9a0b38';
options.button_theme = {
type: 'custom',
font: {
fontFamily: 'sassyfrass',
src: "url(https://fonts.gstatic.com/s/sassyfrass/v5/LhWhMVrGOe0FLb97BjhsE-9aEtSygOan.woff2) format(woff2)",
color: 'yellow'
},
background: {
color: 'purple',
border: 'black'
}
}
var wlrfp_widget = new wlrfp.widget(options);
</script>
Inline Implementation
<script type="text/javascript" src="https://www.cvent.com/wlrfps/js/widget/"></script>
<script type="text/javascript" charset="utf-8">
const options = {};
options.display = "inline";
options.key ='a0c9d507-7bad-4979-9e89-8484f52f075f';
options.uid = '9145c8ec-7577-4658-8ee4-3180ec9a0b38';
options.height = '800px'
var wlrfp_widget = new wlrfp.widget(options);
</script>
Overlay Implementation
<script type="text/javascript" src="https://www.cvent.com/wlrfps/js/widget/"></script>
<script type="text/javascript" charset="utf-8">
const options = {};
options.display = "overlay_mode";
options.key ='a0c9d507-7bad-4979-9e89-8484f52f075f';
options.uid = '9145c8ec-7577-4658-8ee4-3180ec9a0b38';
var wlrfp_widget = new wlrfp.widget(options);
</script>
Checkbox Implementation
<form id="hotelpicker">
<input type="checkbox" name="hotels" value="262b3fa1-63c0-4ed3-bcb8-e4dc8178550a" />XX94N - A Demo Gold Resort <br />
<input type="checkbox" name="hotels" value="9632b4f5-ec24-4e44-8291-25355cf2e9f8" />JB811 - A Demo Property <br />
<input type="checkbox" name="hotels" value="9b59cd5f-4dc2-464d-ae96-89401cff0eaf" />TXS38 - A Demo Resort <br />
</form>
<script type="text/javascript" src="https://www.cvent.com/wlrfps/js/widget/"></script>
<script type="text/javascript" charset="utf-8">
function getHotelUids() {
var uids = "";
var form = document.getElementById("hotelpicker");
for (i = 0; i < form.hotels.length; i++) {
if (form.hotels[i].checked) {
if (!form.hotels[i].value) continue; // skip blank uids
uids = uids
? uids + "," + form.hotels[i].value
: form.hotels[i].value;
}
}
return uids;
}
const options = {};
options.display = "window";
options.key ='a0c9d507-7bad-4979-9e89-8484f52f075f';
options.populateUid = 'getHotelUids';
var wlrfp_widget = new wlrfp.widget(options);
</script>
Multi-Select Implementation
<form>
<select id="hotelpicker" multiple size="5">
<option value="" selected>Please choose one or more hotels</option>
<option value="262b3fa1-63c0-4ed3-bcb8-e4dc8178550a">XX94N - A Demo Gold Resort</option>
<option value="9632b4f5-ec24-4e44-8291-25355cf2e9f8">JB811 - A Demo Property</option>
<option value="9b59cd5f-4dc2-464d-ae96-89401cff0eaf">TXS38 - A Demo Resort</option>
</select>
</form>
<script type="text/javascript" src="https://www.cvent.com/wlrfps/js/widget/"></script>
<script type="text/javascript" charset="utf-8">
function getHotelUids() {
var uids = "";
var hotels = document.getElementById("hotelpicker");
for ( i=0; i<hotels.options.length; i++ ) {
if ( hotels.options[i].selected ) {
if ( !hotels.options[i].value ) continue;
uids = ( uids ) ? uids + "," + hotels.options[i].value : hotels.options[i].value;
}
}
return uids;
}
const options = {};
options.display = "window";
options.key ='a0c9d507-7bad-4979-9e89-8484f52f075f';
options.populateUid = 'getHotelUids';
var wlrfp_widget = new wlrfp.widget(options);
</script>
External Button Implementation
<button onclick='wlrfp_widget.show()'>This is external button, style as you want</button>
<script type="text/javascript" src="https://www.cvent.com/wlrfps/js/widget/"></script>
<script type="text/javascript" charset="utf-8">
const options = {};
options.button = "none";
options.key ='a0c9d507-7bad-4979-9e89-8484f52f075f';
options.uid = '9145c8ec-7577-4658-8ee4-3180ec9a0b38';
var wlrfp_widget = new wlrfp.widget(options);
</script>
Last updated on