简体   繁体   中英

How to embed an external widget to a page in Bolt?

I'm trying to embed a booking system widget to my bolt homepage (the one and only homepage , using base-2018 theme). I paste it into the Content window, selecting Source first. Bolt seems to interpret what is going on, as various tags and IDs are highlighted in the code.

The widget code is roughly so:

<div id="bokun [blabla]">Loading...</div>
<p><script type="text/javascript"><br />
var w15;<br />
(function(d, t) {<br />
  var host = 'widgets.bokun.io';<br />
  var frameUrl = 'https://' + host + '/widgets/15';<br />
  var s = d.createElement(t), options = {'host': host, 'frameUrl': frameUrl, 'widgetHash':'w15', 'autoResize':true,'height':'','width':'100%', 'minHeight': 0,'async':true, 'ssl':true, 'affiliateTrackingCode': '', 'transientSession': true, 'cookieLifetime': 43200 };<br />
  s.src = 'https://' + host + '/assets/javascripts/widgets/embedder.js';<br />
  s.onload = s.onreadystatechange = function() {<br />
    var rs = this.readyState; if (rs) if (rs != 'complete') if (rs != 'loaded') return;<br />
    try {<br />
      w15 = new BokunWidgetEmbedder(); w15.initialize(options); w15.display();<br />
    } catch (e) {}<br />
  };<br />
  var scr = d.getElementsByTagName(t)[0], par = scr.parentNode; par.insertBefore(s, scr);<br />
})(document, 'script');<br />
</script></p>

I have only edited out the unique ID this widget has. Otherwise, this is copied from the provider and works on my current Wordpress site...ALTHOUGH when I paste it into Wordpress, the editor notifies me that "there's something wrong" and offers me to correct it.

How do I insert this? Do I need to create a .js file and reference it in compliance with Twig standards and if so, how do I? I should also note that the widget will redirect to a different page within the same site once you press something within it. Thank you.

Bolt version: 3.6.5

您需要将所需的每个标记和属性添加到config.yml中

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM