Viewing 15 posts - 1 through 15 (of 15 total)
  • Author
    Posts
  • July 15, 2023 at 8:48 pm #1413376
    marion

    Hello!

    How can I insert a full screen typeform form? I inserted the provided code from typeform but the form is not shown full page.
    Even if I set, that there should be no header, sidebar, footer etc… the typeform is not shown correctly.
    Many thanks!

    Best, Marion

    July 16, 2023 at 12:06 pm #1413395
    Rikard

    Hey marion,

    Please try the following in Quick CSS under Enfold->General Styling:

    .page-id-1208 .main_color .container {
  width: 100%; 
  max-width: 100%;
  padding: 0;
}

    Best regards,
    Rikard

    July 18, 2023 at 9:26 pm #1413650
    marion

    Hi Rikard, many thanks for your input. It seems, that this one solves part of the problem. I still have a big black footer with no content overlapping nearly the whole page. Any ideas? Many thanks and best Marion

    July 19, 2023 at 8:46 am #1413669
    Ismael

    Hi,

    Thank you for the update.

    Adding the following css code should adjust the height of main container and decrease the size of the footer container.

    .page-id-1208 .post-entry.post-entry-1208 {
    min-height: 90vh;
}

    You may need to toggle or temporarily disable the Enfold > Performance > File Compression settings in order to ensure that the changes take effect.

    Best regards,
    Ismael

    July 19, 2023 at 11:47 am #1413701
    marion

    super, works perfectly! many thanks! best regards, marion

    July 19, 2023 at 7:37 pm #1413739
    marion

    ah one more thing: unfortunately the page is not responsive / mobile friendly anymore… how can I solve this? thanks for your help in advance! best regards, marion

    July 19, 2023 at 8:21 pm #1413742
    Rikard

    Hi,

    Thanks for the update. I can’t see any content on the page you linked to, where can we see it? Please note that we can help with small fixes, but we won’t be able to help with larger customisations of third party code.

    Best regards,
    Rikard

    July 19, 2023 at 8:42 pm #1413755
    marion

    Hello Rikard, it’s the same page, again. Best, Marion

    July 20, 2023 at 9:59 am #1413815
    Rikard

    Hi,

    Thanks, but that is the page I’ve checked. There is a red stripe at the top, then the rest of the screen is completely black. There is no content at all. I’ve checked in private windows in three different browsers, and the results are the same in all of them.

    Best regards,
    Rikard

    July 20, 2023 at 10:08 am #1413816
    marion

    Hi Rikard, many thanks for your effort! Indeed, the red stripe is the embedded typeform – but you can’t see it, because of the black part (the footer? no idea…)… If I check in Chrome on desktop, I do see the typeform thanks to the css snippets above. But on mobile, unfortunately not. Any additional ideas?

    July 21, 2023 at 10:01 am #1413924
    Ismael

    Hi,

    Have you removed the CSS code? If so, please add it back. Before checking the page on mobile view, ensure you purge the cache or clear the browser history. Additionally, consider viewing it in incognito mode to avoid any cached data.

    Best regards,
    Ismael

    July 24, 2023 at 5:16 pm #1414251
    marion

    Hi there! The code is still there. Yes – it was the cache. Sorry 🙈
    So on the mobile screen I do have 2 white stripes on the left and right side of the embedded form. How can I optimize this one? Thanks for your help!

    Best, Marion

    July 25, 2023 at 4:13 am #1414303
    Ismael

    Hi,

    Glad to know that the changes are working. To remove the “white stripes” on mobile view, please include this code in the css media query.

    .page-id-1208 #wrap_all .container {
    width: 100%;
    max-width: 100%;
}

    Best regards,
    Ismael

    July 25, 2023 at 6:17 pm #1414403
    marion

    Hi Ismael,

    thanks! Unfortunately, there are still white stripes as soon as the width is below app. 700px. I can’t understand this one… do you have any additional input for me? Many thanks!

    Best regards, Marion

    July 26, 2023 at 12:56 am #1414449
    Mike

    Hi,
    Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

    #top.page-id-1208 .main_color.container_wrap_first {
	 background-color: #e41d13;
}

    After applying the css, please clear your browser cache and check.

    Best regards,
    Mike

  • Author
    Posts
Viewing 15 posts - 1 through 15 (of 15 total)
  • You must be logged in to reply to this topic.