Pasang Widget Bing Chat AI GPT+4 GRATIS - Jawaraspeed

Pasang Widget Bing Chat AI GPT+4 GRATIS - Jawaraspeed

Copy Kode HTML lalu pasang ke blogmu. Pastekan di head atau footer.

 <style>  
 .botbot-chat-widget {  
  position: fixed;  
  bottom: 20px;  
  right: 20px;  
  z-index: 1000;  
 }  
 .botbot-chat-widget *, .botbot-chat-widget *::before, .botbot-chat-widget *::after {  
  box-sizing: border-box;  
 }  
 .botbot-chat-widget.show .chat-content {  
  display: block;  
 }  
 .botbot-chat-widget.show .msg-button {  
  background: #f3f3f3;  
 }  
 .botbot-chat-widget .msg-button {  
  width: 60px;  
  height: 60px;  
  border-radius: 50%;  
  display: block;  
  border: 0;  
  box-shadow: 0 2px 3px #ddd, 2px 0 3px #ddd;  
  cursor: pointer;  
  outline: none;  
  border: 0.5px solid #ddd;  
  background: white;  
 }  
 .botbot-chat-widget .msg-button img {  
  max-width: 100%;  
 }  
 .botbot-chat-widget .msg-button:hover {  
  opacity: 0.9;  
 }  
 .botbot-chat-widget .chat-content {  
  display: none;  
  position: absolute;  
  bottom: calc(100% + 20px);  
  right: 0;  
  box-shadow: 0 4px 5px #ddd;  
  background: white;  
 }  
 .botbot-chat-widget .chat-content iframe {  
  width: 500px;  
  height: 520px;  
  border: 0;  
 }  
 </style>  
  <div style="position: relative;" >  
   <div class="botbot-chat-widget">  
     <div class="chat-content"></div>  
     <button class="msg-button" onclick="handleToggleChatWidget();" data-botbot-url="https://bingchat.jawaraspeed.com/web/#/">  
       <img src="https://static.wikia.nocookie.net/logopedia/images/d/d9/Bing_Chat_2023.svg" alt="">  
     Chat AI</button>  
   </div>  
 </div>  
    <script id="rendered-js" >  
 (function (win) {  
  win.handleToggleChatWidget = function handleToggleChatWidget() {  
   var chatWidget = document.querySelector('.botbot-chat-widget');  
   var chatWidgetContent = chatWidget.querySelector('.chat-content');  
   var button = chatWidget.querySelector('.msg-button');  
   var iframe = document.getElementById('botbot-iframe');  
   var expanded = chatWidget.getAttribute('aria-expanded');  
   var botbotUrl = button.getAttribute('data-botbot-url');  
   if (expanded === 'true') {  
    chatWidget.classList.remove('show');  
    chatWidget.setAttribute('aria-expanded', false);  
   } else {  
    if (!iframe) {  
     iframe = document.createElement('iframe');  
     iframe.setAttribute('id', 'botbot-iframe');  
     iframe.setAttribute('src', botbotUrl);  
     iframe.setAttribute('allowfullscreen', 'true');  
     chatWidgetContent.appendChild(iframe);  
    }  
    chatWidget.classList.add('show');  
    chatWidget.setAttribute('aria-expanded', true);  
   }  
  };  
 })(window);  
   </script>