Last active
January 23, 2024 07:10
-
-
Save dzabrzenski/190f46538698eb88c679d8ebe12a884c to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <title>Landing bot with BotEngine.ai</title> | |
| <meta charset="utf-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet"> | |
| <style type="text/css"> | |
| * { | |
| font-family: 'Open Sans', sans-serif; | |
| box-sizing: border-box; | |
| padding: 0; | |
| margin: 0; | |
| } | |
| iframe { | |
| border: 0; | |
| -webkit-box-shadow: 0px 0px 28px -2px rgba(214,214,214,1); | |
| -moz-box-shadow: 0px 0px 28px -2px rgba(214,214,214,1); | |
| box-shadow: 0px 0px 28px -2px rgba(214,214,214,1); | |
| } | |
| nav { | |
| width: 100%; | |
| padding: 20px 20px; | |
| background: #e0eaef; | |
| margin-bottom: 40px; | |
| color: #6d838e; | |
| font-weight: 600; | |
| letter-spacing: 1px; | |
| text-align: center; | |
| text-transform: uppercase; | |
| } | |
| header { | |
| width: 1000px; | |
| height: 250px; | |
| margin: 0 auto; | |
| -webkit-border-radius: 10px; | |
| -moz-border-radius: 10px; | |
| border-radius: 10px; | |
| background: #d4e0e6; | |
| } | |
| section { | |
| width: 100%; | |
| max-width: 1000px; | |
| height: auto; | |
| margin: 25px auto; | |
| } | |
| section > div.left { | |
| width: 420px; | |
| float: left; | |
| } | |
| section > div.right { | |
| width: calc(100% - 420px); | |
| float: left; | |
| padding-left: 25px; | |
| } | |
| section > div.right > div { | |
| width: calc(50% - 5px); | |
| height: 250px; | |
| background: #e8f1f5; | |
| font-size: 15px; | |
| padding: 50px; | |
| float: left; | |
| line-height: 30px; | |
| color: #697276; | |
| -webkit-border-radius: 10px; | |
| -moz-border-radius: 10px; | |
| border-radius: 10px; | |
| margin-bottom: 20px; | |
| } | |
| section > div.right > div:nth-child(2n) { | |
| margin-right: 10px; | |
| } | |
| section > div.right > div:first-child { | |
| width: 100%; | |
| margin: 0 0 20px 0; | |
| } | |
| section > div.right > div > p { | |
| width: 90%; | |
| -webkit-border-radius: 6px; | |
| -moz-border-radius: 6px; | |
| border-radius: 6px; | |
| background: #d4e0e6; | |
| padding: 5px; | |
| margin-bottom: 15px; | |
| } | |
| section > div.right > div > p:first-child { | |
| width: 40%; | |
| background: #c2d0d7; | |
| padding: 7px; | |
| margin-bottom: 25px; | |
| } | |
| section > div.right > div > p:nth-child(2n) { | |
| width: 80%; | |
| } | |
| @media only screen and (max-width: 1024px) { | |
| header, section { | |
| width: 90%; | |
| } | |
| section > div.right > div { | |
| width: 100%; | |
| margin: 0 0 20px; | |
| } | |
| } | |
| @media only screen and (max-width: 768px) { | |
| section > div.left, | |
| section > div.right { | |
| width: 100%; | |
| padding: 20px 0; | |
| } | |
| } | |
| </style> | |
| </head> | |
| <body> | |
| <nav>Landing bot with BotEngine.ai</nav> | |
| <header></header> | |
| <section> | |
| <div class="left"> | |
| <iframe src="widget.html" width="100%" height="550" border="0"></iframe> | |
| </div> | |
| <div class="right"> | |
| <div> | |
| <p></p><p></p><p></p><p></p><p></p><p></p> | |
| </div> | |
| <div> | |
| <p></p><p></p><p></p><p></p><p></p><p></p> | |
| </div> | |
| <div> | |
| <p></p><p></p><p></p><p></p><p></p><p></p> | |
| </div> | |
| <div> | |
| <p></p><p></p><p></p><p></p><p></p><p></p> | |
| </div> | |
| </div> | |
| </section> | |
| </body> | |
| </html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Landing bot with BotEngine.ai</title> | |
| </head> | |
| <body> | |
| <script type="text/javascript"> | |
| window.__be = window.__be || {}; | |
| window.__be.id = "59cd403b8187680007244146"; // put your chat widget id here | |
| var BE_API = window.BE_API || {}; | |
| // open chat widget window after load | |
| BE_API.onLoad = function () { | |
| BE_API.openChatWindow(); | |
| }; | |
| (function() { | |
| var be = document.createElement('script'); be.type = 'text/javascript'; be.async = true; | |
| be.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'cdn.botengine.ai/widget/plugin.js'; | |
| var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(be, s); | |
| })(); | |
| </script> | |
| <style type="text/css"> | |
| #botengine-chat { | |
| width: 100% !important; | |
| } | |
| </style> | |
| </body> | |
| </html> |
V-max-ops
commented
Sep 25, 2021
<script type="text/javascript">
window.__be = window.__be || {};
window.__be.id = "614f071bd26f150007326868";
(function() {
var be = document.createElement('script'); be.type = 'text/javascript'; be.async = true;
be.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'cdn.chatbot.com/widget/plugin.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(be, s);
})();
</script>
even after linking the chat widget js code to our site, I can't use a chatbot. it's just not even appearing
hi @dzabrzenski i am trying to implement this build referencing this demo: https://cdn.chatbot.com/demo/landing-bot/index.html
i am getting an error "BE_API.openChatWidget is not a function" - in the plugin.js
wondering if you have a fix for this? thanks!
hi @dzabrzenski i am trying to implement this build referencing this demo: https://cdn.chatbot.com/demo/landing-bot/index.html i am getting an error "BE_API.openChatWidget is not a function" - in the plugin.js wondering if you have a fix for this? thanks!
I found I had to update openChatWidget to openChatWindow in the page widget.html and it worked fine.
@selkirkmac thank you! I've updated the gist file, best wishes!
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment