Typeform embed in Webflow | Community
Skip to main content
Answered

Typeform embed in Webflow

A

Hello,

I have this code to insert the button on my Webflow page:

```html
<button data-tf-popup="ncWgMFq1" data-tf-opacity="100" data-tf-hubspot data-tf-size="70" data-tf-iframe-props="title=My new form" data-tf-transitive-search-params data-tf-medium="snippet" style="all:unset;font-family:Helvetica,Arial,sans-serif;display:inline-block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background-color:#3EEBB5;color:#000;font-size:20px;border-radius:10px;padding:0 33px;font-weight:bold;height:50px;cursor:pointer;line-height:50px;text-align:center;margin:0;text-decoration:none;">Más información</button>
<script src="//embed.typeform.com/next/embed.js"></script>
```

However, when I publish the website, the button does not appear.

Could you tell me what the issue might be?

Best answer by picsoung

Hi Alba

We launched a Webflow plugin that should help you embed a typeform easily.
You can get it here https://webflow.com/apps/detail/typeform

There is no need to copy-paste code anymore

If you really want to use this method, maybe you could share any error code you see in the console? Or a link to the page where you are embedding the form.

Thank you

View original

    3 replies

    picsoung
    Typeform
    Forum|alt.badge.img+5
    • picsoung
    • Developer Advocate @ Typeform
    • 384 replies
    • Answer
    • May 13, 2024

    Hi Alba

    We launched a Webflow plugin that should help you embed a typeform easily.
    You can get it here https://webflow.com/apps/detail/typeform

    There is no need to copy-paste code anymore

    If you really want to use this method, maybe you could share any error code you see in the console? Or a link to the page where you are embedding the form.

    Thank you

    john.desborough
    Grace
    2 people like this
    • john.desborough
      john.desborough
    • Grace
      Grace
    A

    Hi,

    Thank you for your recommendation about the Webflow plugin for Typeform. However, I want to insert the form on my website as a popup and also have the ability to make deeper customizations to the button. That's why I prefer using the full code.

    Here is the full code for the button:

    <button data-tf-popup="ncWgMFq1" data-tf-opacity="100" data-tf-hubspot data-tf-size="70" data-tf-iframe-props="title=My new form" data-tf-transitive-search-params data-tf-medium="snippet" style="all:unset;font-family:Poppins,Arial,sans-serif;display:inline-block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background-color:#3EEBB5;color:#FFFFFF;font-size:20px;border-radius:10px;padding:0 33px;font-weight:bold;height:50px;cursor:pointer;line-height:50px;text-align:center;margin:0;text-decoration:none;">Más información</button>

    <script src="//embed.typeform.com/next/embed.js"></script>

     

    Preview link of the website: https://preview.webflow.com/preview/hr-bot-factory?utm_medium=preview_link&utm_source=designer&utm_content=hr-bot-factory&preview=49f0dbfa4743c45d29060faf9209f864&pageId=6639fe76b5adb551b716256a&workflow=preview

    Thank you!

    Best regards, Alba

    picsoung
    Typeform
    Forum|alt.badge.img+5
    • picsoung
    • Developer Advocate @ Typeform
    • 384 replies
    • May 21, 2024

    Hi @albagonnzalez 

    I went ahead and checked the preview link but I can’t see the embed code there.

    Is there anything preventing this button to show? Like a conflicting CSS rule?

     

    Reply


    Still need help?

    Don't be shy and ask the community.

    Ask your question here!
    Community T&Cs