New feature

šŸ“£ New feature alert! Live form embedding

  • 1 August 2023
  • 19 replies
  • 629 views
šŸ“£ New feature alert! Live form embedding
Liz
Rank
Userlevel 7
Badge +5
  • Liz
  • Tech Community Advocate
  • 13708 replies

Happy August, typeformers!

Ā 

For those of you who love to embed your typeforms, youā€™re really going to dig this new feature.Ā 

Ā 

Our product team has made a small (but mighty!) update to the embed code. Previously, if you made any changes to the design of the embed (such as the button text/colors/etc), you needed to re-embed the code for those changes to go live.Ā 

Ā 

Now, with our updated live embed feature, you can make any changes to the look of your embedded typeform and those changes will automatically reflect in your embedded typeform. No more need to re-embed each time you make a change!

Ā 

Watch the video below to learn more about this feature or read about it in our Help Center article here.Ā 

Ā 

Ā 

As always, share any feedback or comments in the thread below.Ā 

Ā 

Happy embedding!

Ā 

Life is a series of awkward moments separated by snacks.

19 replies

N
Badge

Happy August, typeformers!

Ā 

For those of you who love to embed your typeforms, youā€™re really going to dig this new feature.Ā 

Ā 

Our product team has made a small (but mighty!) update to the embed code. Previously, if you made any changes to the design of the embed (such as the button text/colors/etc), you needed to re-embed the code for those changes to go live.Ā 

Ā 

Now, with our updated live embed feature, you can make any changes to the look of your embedded typeform and those changes will automatically reflect in your embedded typeform. No more need to re-embed each time you make a change!

Ā 

Watch the video below to learn more about this feature or read about it in our Help Center article here.Ā 

Ā 

Ā 

As always, share any feedback or comments in the thread below.Ā 

Ā 

Happy embedding!

Ā 

Hi Liz!

Ā 

Can different team members edit the same embed? Or are they personal?

Liz
Rank
Userlevel 7
Badge +5

Hi @netfuzzerĀ Just to clarify, do you mean edit the embed settings in the builder?Ā 

Life is a series of awkward moments separated by snacks.
C

with this awesome new feature, Is it possible to change the inline css to change the font-family of the embedded button?

solvedĀ šŸ˜€
Just add a class to the div container and add some custom css to is.


<div class="tf-button" style="padding: 0 20px 20px 0;" data-tf-live="xxxxxxxxxxxxx"></div><script src="//embed.typeform.com/next/embed.js"></script>

.tf-button button {
font-weight: unset !important;
font-family: unset !important;
height: 37px !important;
line-height: 37px !important;
}

Ā 

Liz
Rank
Userlevel 7
Badge +5

@centervanliempdĀ glad you were able to find a solution ha! Let us know if you have any other questions.Ā šŸ˜€

Life is a series of awkward moments separated by snacks.
S
Badge

Hey @Liz,

I love this feature, but somehow the side tab is showing up twice on our clientā€™s blog. The new code snippetĀ is implemented only once, but I am afraid there might be the old HTML code in there as well. Can you do me a favor and send me an example of the old HTML code so I can go through the website code and delete it (I canā€™t find it nowhere anymore).

Ā 

Thanks in advance,

Felix

Ā 

Liz
Rank
Userlevel 7
Badge +5

Hi @saphironĀ Iā€™m afraid I wouldnā€™t have any old code available, but I would suggest searching for ā€œtypeformā€ in the code itself to find any traces of the embed code!

Life is a series of awkward moments separated by snacks.
S
Badge

@Liz,

thanks for your response. Actually we realized there is no old code on the page. It seems to be a bug? Has someone reported this besides us? Here is an example:Ā https://www.spized.com/de/magazin/trainingslager-tipps

Liz
Rank
Userlevel 7
Badge +5

Hi @saphironĀ Ohhh I see what youā€™re saying. I just viewed the URL on Safari but didnā€™t see the issue. Do you know what device/browser youā€™re seeing the issue on?Ā 

Life is a series of awkward moments separated by snacks.
S
Badge

@LizĀ That would be Windows 11 with Chrome. I know my client is using a Mac, though. Same issue. Thanks for looking into this?

Liz
Rank
Userlevel 7
Badge +5

Hi @saphironĀ The screenshot above is from a mobile device - do you happen to know what device thatā€™s appearing on?Ā 

@mathioĀ you donā€™t happen to see this on your end, do you?Ā 

Life is a series of awkward moments separated by snacks.
mathio
Rank
Userlevel 7
Badge +5

Hello @saphironĀ I can see this embed is loaded twice:

I didnt find this HTML embed code in your website source code twice. Are you sure you are not loading the embed by other means?

F

is this only available for webpages? it would be really useful in embed emails as well..

mathio
Rank
Userlevel 7
Badge +5

@felipe barretoĀ unfortunately due to constraints of email platform and clients in general,Ā this is for websites only.

B
Userlevel 1
  1. @mathioĀ @LizĀ  Thanks yā€™all. Mathio said this is for websites only. This leads to 2 new points.

    Does it auto-adjust on all browsers and mobile or not? I think so = therefore thank you
  2. NEW IMPORTANT: it really would be great IF it auto-adjusts in emails too. Is there any way to do that at all ? Find out . In fact this point is SUPER important. ā€œIFā€ it can be done - then ā€œwowā€! !!Ā  :)Ā  [However I realize this is not easily possible!]

    If not - then the workaround is a ā€œimageā€ that the user must click that ā€œtakes them to a new URL with typeformā€ and of course that can be adjusted as per original post above.
Liz
Rank
Userlevel 7
Badge +5

Hi @BrainmanĀ To answer your questions,Ā 

  1. Yes, it does!
  2. It does auto-adjust in emails however, it is really dependent on the email service provider and the email provider of the respondent.Ā 

I hope this helps a bit!

Life is a series of awkward moments separated by snacks.
B
Userlevel 1

@LizĀ  This is great! Then one creative idea that marketers would love is if there was a ā€œ[adjustable] countdown timerā€ . That would be priceless as one could use that in emails and elsewhere, but all synched to a central countdown timer that one (me) has control over at Typeform HQ (my dashboard: meaning I can even re-set it )!

Ā 

Liz
Rank
Userlevel 7
Badge +5

I would love that, too, @BrainmanĀ ! Iā€™ll share your +1 to the product team.Ā šŸ˜€

Life is a series of awkward moments separated by snacks.
M

Since Typeforms areĀ an embedded element, there can be a limitation with us 'seeing' any of the form data on the website since it's technically being served from another place on the web. What options do we have for collecting external data like the referring url and passing it along to our Typeform as the source? Aka, we get a client on our site from a Google Ad and when they complete the form, we loose all the referring source data.Ā 

Liz
Rank
Userlevel 7
Badge +5

Hi @MVJessicaĀ the only way to pass information into the form would be through hidden fields. You should be able to set up the Google Ad to link the hidden fields in the URL they are directed to from the ad. This article here talks a bit more about setting up UTM fields.Ā 

Life is a series of awkward moments separated by snacks.

Reply


Still need help?

Don't be shy and ask the community.

Ask your question here!
Community T&Cs