Dear Vapi Support Team, I am experiencing an issue with integrating the Vapi Voice Widget into my website. When I embed the widget using the provided script, it does not appear at the location where I insert the script in my HTML code. Instead, it renders at the bottom of the page near the footer. I have attempted to force the widget to have a position: relative style, but it still doesn't appear where I expect it to. This makes working with relative positioning extremely difficult. I followed the instructions from your documentation: https://docs.vapi.ai/examples/voice-widget I would like the widget to appear exactly where I place it in my HTML code so that I can control its position relative to other elements on the page. Could you please advise on how to properly position the widget within my page layout? Thank you for your assistance. Best regards, Patrick Jung

@DerUnglaublicheToast Hello Patrick, I'm sorry to hear that you're having trouble positioning the Vapi Voice Widget on your website. Let's try to resolve this issue together. Firstly, ensure that you've placed the widget snippet in the correct location within your HTML code. It should be inserted where you want the widget to appear, not necessarily at the bottom of the page. If you've already done this and the widget is still not appearing in the desired location, it could be due to CSS conflicts or other elements affecting the widget's position. To help you further, I would need to see how you've implemented the widget in your code. Could you please provide a snippet of your HTML where you've placed the Vapi widget and any relevant CSS? This will allow me to understand the context better and offer a more precise solution. In the meantime, you can also try the following steps: 1. Ensure that the parent element where you're placing the widget has a defined position (e.g.,

position: relative;

). 2. Check if there are any CSS rules applied globally that might be overriding the widget's style. 3. Use the browser's developer tools to inspect the widget's element and see if there are any unexpected styles being applied. Once you provide the additional details, I'll do my best to assist you in resolving the positioning issue. Best regards, Vapi Support Team

@User I worked with elementor I make it position relative !important it is not at the place where I put it, I tried many places to put it but it has no influence on the widget. I guess it's because of the script has a own position. I want to know is there a solution? Can I modifi the script to say the snippet has to be in a specific div container with the Id XY

Hey @DerUnglaublicheToast check out this code (index.html and styles.css) files for placing button to the required place do let me know if you have further questions, https://codesandbox.io/p/sandbox/nedzo-vapi-2s4nnq

WOW Thank you for helping it works

@DerUnglaublicheToast if this is resolved for you, can i close this ticket?

yes