Using proactive messages

lessons

15 min

Course Progress

If you’re building a chat-based agent, you’ll be charged per message that you send. However, sometimes you might want to send an initial message to customers to get their attention so that they engage with your agent. Proactive messages are a great way to do this for free.

‍

What are proactive messages?

Proactive messages are a webchat feature that allows you to send basic text messages to a user prior to a conversation. These messages don’t exist inside your Voiceflow project, and therefore you’re not billed for them. They look like this:

‍

‍

Adding proactive messages to your agent

Sending proactive messages from your agent is simple. Just embed Voiceflow’s webchat onto your website, then add the following JavaScript to send proactive messages:

	
  // one message  
  window.voiceflow.chat.proactive
  .push({ type: 'text', payload: { message: 'hello world' } })
  
  // multiple messages  
  window.voiceflow.chat.proactive  
  .push(  
    { type: 'text', payload: { message: '1!' } },  
    { type: 'text', payload: { message: '2!' } }  
  )

‍

You can also send proactive messages when certain events happen, such as a customer visiting a certain page. Here’s an example of this in action:

‍

	
  
    // Your chat embed code  goes herehere
    // ...
    
    // Send proactive messages
    window.voiceflow.chat.load({ ... }).then(() => {
    	if (window.location.href.includes('https://store.com/products/fire_sneakers') {
        	window.voiceflow.chat.proactive.clear(); // clear all previous messages
            window.voiceflow.chat.proactive.push({ 
            	type: 'text', 
                payload: { message: 'Are you interested in some 🔥🔥🔥 sneakers?' }
            }, { 
            	type: 'text', 
                payload: { message: 'Click on the chat to learn more!' }
            })
        }
    })

‍