Question

Embeded side slider opens in the new window + answers are filled


Badge +1

We have embeded a side slider inside an app.

It opens in the window, not a s widget. Such an issue was reported on this forum for couple of times but no specific solution was proposed. 

Account is paid, form is published. On preview all was ok. 

The second question is if the form remembers user somehow and previous answers? 

I have tested it and got all answers already filled, but haven't found a description of the logiс of how it works.

Does the form remembers the answer previously submitted? How it does it? 

 

I failed to find any support help from Typeform, don't understand how to proceed with this form.

Will be very grateful for the help from community!

 

 

 

Screen record: 

 


19 replies

Userlevel 7
Badge +5

Hi @Sharhorodska Thanks for stopping by the community! Would you mind sharing the public URL where you have the form embedded so I can take a look? 

As for your second question, your respondents can start to fill in a Typeform, close it, and then return later and their answers will still be there. The only rule is they have to be on the same browser and device (and not in Incognito or Private browsing mode). Their answers will be kept safely in their browser's local storage, for 15 days.

If you’d like to pass in data that was submitted from a previous form, you’ll need to use hidden fields to pass in data from a stored location, such as your email service provider. 

Let me know if you think of any other questions at all!

Badge +1

@Liz  thanks for reply!

We have no public link yet( It is available only on out test server. That is why I have recorded a video to show. 

Regarding the hidden fields. Will it make it possible to send from my app (we have only signed in users there) send user email together with responses? 

I tried to understand how to set hidden fields but didn't find where to add it in my form

Userlevel 7
Badge +5

Hm, I’ll need to see the link directly in order to take a look at the code and test it. Is there a test page you could place it on? 

For the hidden fields, you could possibly send the data from your app, though you’ll need a way to pass the data from your app into the form. This might require you to write some code that will pass information from your app into the Typeform URL, depending on how you have the data stored in your app. 

Badge +1

@Liz  Here is a link you can check, take a look please 🙏

http://white-frontend.s3-website.eu-central-1.amazonaws.com/

typeform@gmail.com
typeform

Userlevel 7
Badge +5

Thank you! I tried to access the feedback button on the side, but it looks like it might have been removed. If so, do you mind adding it back? Thanks!

Badge +1

@Liz  It is there now! Please take a look one more time 🙏 Thank you!

Userlevel 7
Badge +5

@Sharhorodska  Thank you - I see it now! It looks like there are a lot of conflicting scripts on the page. How are you embedded the form? If you don’t mind sharing a screenshot of how the embed code is added, this will help me narrow down why it’s popping out. 

Badge +1
Script of how it is connected
​​​​​
Script when saving, ; was added

 

@Liz  please take a look!

Userlevel 7
Badge +5

Hm, @Sharhorodska are you using the embed code we provide? It looks like this is just the script portion of the code, but not the entirety of the embed code. Do you mind sharing that? 

Badge +1
<div className="embed_typeform" data-qa="side_panel">        <a          href="https://form.typeform.com/to/JFE3rsCh?typeform-medium=embed-snippet"          data-mode="side_panel"          className="typeform-share-button"          data-width="320"          data-height="500"          target="_blank"          rel="noopener noreferrer"        >          <span className="embed_typeform-icon">            <svg              width="24"              height="24"              viewBox="0 0 24 24"              fill="none"              xmlns="http://www.w3.org/2000/svg"              style={{ marginTop: '10px' }}            >              <path                d="M21 0H0V9L10.5743 24V16.5H21C22.6567 16.5 24 15.1567 24 13.5V3C24 1.34325 22.6567 0 21 0ZM7.5 9.75C6.672 9.75 6 9.07875 6 8.25C6 7.42125 6.672 6.75 7.5 6.75C8.328 6.75 9 7.42125 9 8.25C9 9.07875 8.328 9.75 7.5 9.75ZM12.75 9.75C11.922 9.75 11.25 9.07875 11.25 8.25C11.25 7.42125 11.922 6.75 12.75 6.75C13.578 6.75 14.25 7.42125 14.25 8.25C14.25 9.07875 13.578 9.75 12.75 9.75ZM18 9.75C17.172 9.75 16.5 9.07875 16.5 8.25C16.5 7.42125 17.172 6.75 18 6.75C18.828 6.75 19.5 7.42125 19.5 8.25C19.5 9.07875 18.828 9.75 18 9.75Z"                fill="white"              />            </svg>          </span>          <span className="embed_typeform-share">Share feedback</span>        </a>      </div>
Badge +1
.embed_typeform {  position: fixed;  top: calc(50% - 250px);  right: 0;  transition: width 300ms ease-out;  width: 0;  z-index: 99999;}.typeform-share-button {  box-sizing: border-box;  position: absolute;  top: 300px;  width: 200px;  height: 48px;  padding: 0 20px;  margin: 0;  cursor: pointer;  background: #828282;  border-radius: 4px 4px 0px 0px;  box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.06), 0px 2px 4px rgba(0, 0, 0, 0.08);  display: flex;  align-items: center;  justify-content: flex-start;  transform: rotate(-90deg);  transform-origin: bottom left;  color: white;  text-decoration: none;  z-index: 9999;}.embed_typeform-icon {  width: 32px;  position: relative;  text-align: center;  transform: rotate(90deg) scale(0.85);  left: -8px;}.embed_typeform-share {  text-decoration: none;  font-size: 18px;  font-family: Helvetica, Arial, sans-serif;  white-space: nowrap;  overflow: hidden;  text-overflow: ellipsis;  width: 100%;  text-align: center;  -webkit-font-smoothing: antialiased;  -moz-osx-font-smoothing: grayscale;}
Badge +1

@Liz  first is HTML, second is CSS

Userlevel 7
Badge +5

Thank you, @Sharhorodska ! Something doesn’t quite seem right with the code, particularly the portion with all the numbers. Would you mind re-copying the code from the builder and adding it back? 

Badge +1

@Liz  we have updated script, developer checked it letter by letter

and now it opens sometimes in popup, sometimes in new window((

developer managed to take a screenshot to prove it opens in popup, but I haven't sees it even once

 

You can see it here

http://orange-frontend.s3-website.eu-central-1.amazonaws.com/campaigns

typeform@gmail.com
typeform

 

I don't know what we can do more to finally use Typeform popup on website

 

 

Userlevel 7
Badge +5

@mathio do you happen to have any idea why the form is popping up in another window? :grin:

Badge +1

@Liz  is it possible to somehow find out which script may conflict with this script so that blocking it's correct work?

Userlevel 7
Badge +5

Hi @Sharhorodska Would you mind sending a video to share how you’re embedding the form to your site? It’s difficult to say what’s causing the issue without having full knowledge on how the form is being added. 

Badge +1

Hey @Liz 

I finally found support and they asked some questions that helped us finding a solution

We installed script via npm and it worked

Now we are try to make it not scroll questions together with page scroll)

 

Anyway thank you for help!

Userlevel 7
Badge +5

Hi @Sharhorodska Ah! Thank you for sharing - this is handy to know. :) I’m glad you found a solution! Let us know if you think of any other questions. :grinning:

Reply