UmairPerwaiz•2mo ago

When user clicks on the website I want to immediately pop up

I am using wordpress. I have created a page on Wordpress. I want that whenever that page loads , chatbot should immediately popup. How can I do this

1 Reply

Tico | Voiceflow Assistant•2mo ago

How to make the Voiceflow chat widget pop-up as soon as the page loads (WordPress) 1. Go to the WordPress page where you want the chat to auto-open. • If you use Gutenberg, add a Custom HTML block.
• If you prefer, install a snippet/ header-injection plugin (e.g. “Code Snippets”, “Header & Footer”) and target only this page. 2. Paste the widget code below and replace PROJECT_ID with your Voiceflow project ID (and adjust the runtime URL / versionID if you changed them in the integration tab):

<script type="text/javascript">
  (function (d, t) {
    const v = d.createElement(t);
    const s = d.getElementsByTagName(t)[0];
    v.onload = function () {
      // 1️⃣  Load the widget
      window.voiceflow.chat.load({
        verify: { projectID: 'PROJECT_ID' },
        url: 'https://general-runtime.voiceflow.com',
        versionID: 'production'
      }).then(() => {
        // 2️⃣  Immediately open it
        window.voiceflow.chat.open();
      });
    };
    v.src = 'https://cdn.voiceflow.com/widget/bundle.mjs';
    v.type = 'text/javascript';
    s.parentNode.insertBefore(v, s);
  })(document, 'script');
</script>

<script type="text/javascript">
  (function (d, t) {
    const v = d.createElement(t);
    const s = d.getElementsByTagName(t)[0];
    v.onload = function () {
      // 1️⃣  Load the widget
      window.voiceflow.chat.load({
        verify: { projectID: 'PROJECT_ID' },
        url: 'https://general-runtime.voiceflow.com',
        versionID: 'production'
      }).then(() => {
        // 2️⃣  Immediately open it
        window.voiceflow.chat.open();
      });
    };
    v.src = 'https://cdn.voiceflow.com/widget/bundle.mjs';
    v.type = 'text/javascript';
    s.parentNode.insertBefore(v, s);
  })(document, 'script');
</script>

That’s it – every time the page loads, the widget script initializes and open() programmatically pops the chat window instead of waiting for the visitor to click the launcher. Need a slight delay? Replace window.voiceflow.chat.open(); with:

setTimeout(() => window.voiceflow.chat.open(), 3000); // opens after 3 s

setTimeout(() => window.voiceflow.chat.open(), 3000); // opens after 3 s

(Optional) Prevent auto-opening for returning visitors

if (!sessionStorage.getItem('vfChatOpened')) {
  window.voiceflow.chat.open();
  sessionStorage.setItem('vfChatOpened', 'true');
}

if (!sessionStorage.getItem('vfChatOpened')) {
  window.voiceflow.chat.open();
  sessionStorage.setItem('vfChatOpened', 'true');
}

Reference: Voiceflow Web Chat API – open() method in Custom Triggers docs
https://docs.voiceflow.com

When user clicks on the website I want to immediately pop up

Did you find this page helpful?