Z-Index & Button display issues
I've been trying to add a button (which opens a sidebar) to my site but have been running into trouble. The form & button code (below) comes from Typeform.
I have tried entering it as a code snippet on an individual page but nothing displays
Entering it as footer code displays nothing
Entering it into the header code gets the button to show but it is hidden behind every other element on the page.
The Typeform dev has said that the Z-index of their widget is 10001, the code below says its 9999. But either way, I've tried increasing the below Z-Index code but both the button and the form still get hidden behind the rest of the elements on the page.
Can anyone see why this may be happening or maybe how I can alter the z-index of the rest of the site to try that method?
- <div style="position:fixed;top:calc(50% - 250px);right:0;transition:width 300ms ease-out;width:0;" data-qa="side_panel"> <a class="typeform-share button" href="https://form.typeform.com/to/pWnkcLQB?typeform-medium=embed-snippet" data-mode="side_panel" style="box-sizing:border-box;position:absolute;top:300px;width:200px;height:48px;padding:0 20px;margin:0;cursor:pointer;background:#3A7685;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:99999;" data-width="320" data-height="500" target="_blank"> <span class="icon" style="width:32px;position:relative;text-align:center;transform:rotate(90deg) scale(0.85);left:-8px;"> <svg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg' style="margin-top: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 style="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;"> Launch me </span> </a> </div><script> (function() { var qs,js,q,s,d=document, gi=d.getElementById, ce=d.createElement, gt=d.getElementsByTagName, id="typef_orm_share", b="https://embed.typeform.com/"; if(!gi.call(d,id)){ js=ce.call(d,"script"); js.id=id; js.src=b+"embed.js"; q=gt.call(d,"script")[0]; q.parentNode.insertBefore(js,q) } })() </script>
Access your files securely from anywhere
Zoho Developer Community
Deliver unforgettable customer experiences
Deliver unforgettable customer experiences
New to Zoho Marketing Plus?
Everything you need to run your marketing
New to Zoho Marketing Plus?
Everything you need to run your marketing
Zoho Desk Resources
-
Desk Community Learning Series
-
-
-
-
-
-
-
-
-
Sticky Posts
Unveiling Zoho Sites 2.0 - A new dimension in website building
Dear Zoho Sites Users, We are thrilled to announce the launch of Zoho Sites 2.0 today! This refresh represents a significant step forward in the capabilities of Zoho Sites and is crucial for creating a lasting and positive impact on our customers' businesses.
Website Accessibility
I have two sites created in Zoho Sites which are both live. Some questions: 1. Are any of the template themes WCAG 2.1 AA compliant? 2. How do I change the format of a sub-heading in the header section? 3. Is there any way to add focus indication for
Visual Editor Webinar
Join our FREE live webinar to learn how to use the Zoho Sites Visual Editor to easily design your website. Our product specialist will demonstrate how this tool will help you customize your website to suit your requirements. Register here: https://www.zoho.com/sites/webinars/
SEO for your Zoho Sites Website
Join our live webinar to learn how to use Zoho Sites' SEO tools to boost your website's ranking. Our product specialist will demonstrate everything you need to know about optimizing your web pages to make them search engine friendly. Register here for free: https://www.zoho.com/sites/webinars/
Zoho Sites Webinar | Integrations
Join our FREE live webinar to learn how to integrate both Zoho and third-party products with your Zoho Sites website. Our product expert will demonstrate how to use these integrations to grow, manage, and retain the customers you bring in. Learn how to take your business forward and build stunningly robust and efficient websites. Register here: https://www.zoho.com/sites/webinars/
Zoho TeamInbox Resources
Zoho DataPrep Resources
Zoho CRM Plus Resources
Zoho Books Resources
Zoho Subscriptions Resources
Zoho Projects Resources
Zoho Sprints Resources
Qntrl Resources
Zoho Creator Resources
Zoho Campaigns Resources
Zoho CRM Resources
Zoho Show Resources
Writer Get Started. Write Away!
Writer is a powerful online word processor, designed for collaborative work.