-
Jonathan RobsonAsked on August 11, 2020 03:41 PM
Is there a way to inject custom CSS in an embed code for a form? Below is our current form and it works great, but we want it to stay in the center of the screen until the user clicks off of it:
add_action('wp_footer', 'loadJotFormQH');
function loadJotFormQH(){ ?>
<div class="test2020">
<script src ="https://form.jotform.com/static/feedback.js" type="text/javascript">
var JFL_201906943035049 = new JotformFeedback({
formId: '201906943035049',
base: 'https://form.jotform.com/',
windowTitle: 'Form',
background: '#FFA500',
fontColor: '#FFFFFF',
type: '2',
height: 650,
width: 800,
openOnLoad: false
});</script></div>
<?php }
I see font color, background, height, etc. Is there a way to put "position: fixed;" Or is that not possible?
Steps to recreate:
-Go to the stage site https://stage.quakerhoughton.com/
-Click 'x' on the popup
-Click the Contact Us button
-Scroll down and see that it is not fixed position, but absolute
Page URL: https://stage.quakerhoughton.com/ -
MikeReplied on August 11, 2020 08:14 PM
Have you tried using our updated lightbox code? In the updated version, the lightbox has a fixed position by default. To try the updated version you can get the fresh form lightbox code, or add 2 to the feedback script.
https://form.jotform.com/static/feedback2.js
-
JonReplied on August 12, 2020 07:29 AM
I have tried that, it results in a jquery clash and breaks my sticky menu. Is there another way?
-
Bojan Support Team LeadReplied on August 12, 2020 09:57 AM
Greetings.
I have tried to access your site, and I get a 403 forbidden error.
However, I have copied the code you have provided, and I was able to replicate the problem. I tried to fix the element, but since the JavaScript generates new div at the end of the page, without any classes or IDs, I was not able to fix it.
As an alternative, we can suggest you a pop-up form.
Thank you for your understanding.