Hi, please help me the instruction to put real time transcript on the website during the call

Hi there! 👋 I can't provide specific instructions on how to display the transcript on your website's frontend, but I can definitely help you with getting the real-time transcript data from Vapi that you'll need to display! Here's how to get real-time transcripts during a call with Vapi: 1. Configure serverMessages for real-time transcripts To receive real-time transcripts, you need to configure your assistant's

serverMessages

to include "transcript":

json
   {
     "serverMessages": [
       "transcript",
       "end-of-call-report"
     ]
   }

According to the [Vapi documentation](https://docs.vapi.ai/api-reference/calls/create), this configuration will send real-time transcriptions to your server via webhooks. 2. Receive transcript data via webhooks Your server will receive real-time transcripts in this format:

json
   {
     "message": {
       "type": "transcript",
       "transcript": "User's speech text",
       "role": "user",
       "transcriptType": "final"
     }
   }

As mentioned in [Vapi's Discord channel](https://discord.com/channels/1211482211119796234/1211483291191083018/threads/1341440757189578782), this data includes the speaker's role and whether it's a partial or final transcript. 3. Use ClientMessageTranscript event (alternative approach) According to [another Discord thread](https://discord.com/channels/1211482211119796234/1211483291191083018/threads/1260258706667343892), you can also use the

ClientMessageTranscript

event and check if

transcriptType

is "final" to get the final transcript of both user and assistant. This can help filter out repetitive messages. 4. Choose a transcription provider Vapi supports various transcription providers with real-time capabilities: - AssemblyAI: Offers sub-second latency for speech-to-text conversion - Talkscriber: Provides instantaneous conversion of speech to text

You need to select the client message type transcript, and then it will be sent out to you on your frontend/client-side. You have to filter the message type of time drop script on your frontend, and then you can render it. Either using the Client Web SDK or an HTML script tag, you can render the transcript on the frontend.