Embed Welcome Screen Transparency | Community
Skip to main content

Embed Welcome Screen Transparency


Forum|alt.badge.img+1

@Liz unfortunately it does not help. The “welcome screen” is ok. But I think I know whats wrong.

I set the background transparency for 100% because I want my contact page look like this:
https://hoffmann.productions/bewerbungsformular/ (mobile version)

So I only have to find out how I can set my form that the welcome screen background transparency is 100% and as soon as the form starts the pop up has white background. 

15 replies

Liz
Community Team
Forum|alt.badge.img+5
  • Tech Community Advocate
  • 14996 replies
  • March 31, 2022

Hi @TimWinkler I’ve moved your question to a new topic since this seems to be a different issue. 

I don’t believe it is possible to have the welcome screen totally transparent, but @mathio can confirm this for me!


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • March 31, 2022

Hello, transparent background is available for standard / widget embed types. You can set background transparency on share page:

Or you can set the opacity option if you are using embed SDK directly.


Forum|alt.badge.img+1
  • Author
  • Explorer
  • 12 replies
  • April 1, 2022

Hello @mathio 
thanks for your reply. 
I already did that. But then I got this problem:

I need my form looks like this on mobile:
https://hoffmann.productions/bewerbungsformular/

Welcome screen: 100% transparent
form: Pop up with white background

Unfortunately, I am not familiar with Github.

 


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • April 1, 2022

If you embed as “standard” and specify background transparency to 100% you will get the same behavior as the page you linked to. On desktop your form will be inline in page, on mobile it will open in popup (without transparency).


Forum|alt.badge.img+1
  • Author
  • Explorer
  • 12 replies
  • April 1, 2022

@mathio that doesnt work. 

Desktop version is ok. But mobile:

Welcome screen: Transparent

Form screen: Pop with transparent background. 

https://drive.google.com/file/d/11GgkV-7CLeLAMuUx738UolUh7pcYAczg/view?usp=sharing 

 


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • April 5, 2022

Which device and browser can you see this in? I tested in Chrome (mobile view via dev tools) and the popup background is white as expected.


Forum|alt.badge.img+1
  • Author
  • Explorer
  • 12 replies
  • April 5, 2022

@mathio Its apple iPhone and Safari. In my devtools in chrome it also has a transparent background.
 

 


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • April 5, 2022

Are you talking about the page you linked to? https://hoffmann.productions/bewerbungsformular/

It works for me just fine. I see you are logged into WP admin, maybe thats causing the issue?


Forum|alt.badge.img+1
  • Author
  • Explorer
  • 12 replies
  • April 5, 2022

@mathio 
I just want it like the linked page.

 

But on my page there is also the problem when I am not logged in (eg. iPhone) and google drive link:
https://drive.google.com/file/d/11GgkV-7CLeLAMuUx738UolUh7pcYAczg/view?usp=sharing 


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • April 5, 2022

Can you please share URL to your page? You most likely have some conflicting CSS there.


Forum|alt.badge.img+1
  • Author
  • Explorer
  • 12 replies
  • April 5, 2022

mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • April 5, 2022

I think this might be a bug, thanks for reporting. We will have a look and let you know.


Forum|alt.badge.img+1
  • Author
  • Explorer
  • 12 replies
  • April 5, 2022

@mathio ok, fine :)


  • Navigating the Land
  • 5 replies
  • November 15, 2024

Hi team, When I’ve embed a form using the standard feature with background set to transparent, the first page is transparent whilst the remaining pages are white.  Any clues?


mathio-tf
Typeform
Forum|alt.badge.img+5
  • Typeform
  • 888 replies
  • November 18, 2024

Hello ​@LozCol 

Can you please share URL of your page with embedded form or the embed code?

Thanks.


Reply