Mautic Community Forums

Responsive form in Gated video

Support
#1

Your software
My Mautic version is: 2.15.3
My PHP version is: 7.1

Your problem
My problem is: I use gated video on my WordPress website. I managed to make the video responsive but the form on the video isn’t.
Please see the video: https://nimb.ws/oT4jVe

Does anyone have a hint what to change in the css to make it happen?

#2

hi @romancretnik, I’ dont have a answer to your question but I was wondering if you could share how you embedded your Youtube video in gated form feature as I was unable to do so. Thank you in advance.

#3

@tomr, I have a WordPress site where I installed the WP Mautic plugin - https://wordpress.org/plugins/wp-mautic/.
Then I used the shortcode
[mautic type="video" gate-time="#" form-id="#" src="URL"]
Replace the # signs with the appropriate number, where

  • gate-time is in seconds (how many seconds after the video started should the form come to action),
  • form-id is self explanatory (go to Mautic Components > Forms and see the ID of the form in the right column)
    and URL is the URL of the Youtube video.

That’s pretty much all. Hope it helps.

#4

Thanks @romancretnik, thanks for that. Got it show the video but when the gate time triggers it comes up with ‘undefined’. Not sure what I am doing wrong.

#5

@tomr maybe check this: Cannot connect - form give connection error

#6

@romancretnik OMG. Sometimes you do need to think twice before applying a setting. So, I couldn’t make the form work by adding the site (maybe I need to do further check) but disabling it got it to work. Thank you very much for getting this working for me :slight_smile:.

#7

@romancretnik, I was able to use this https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_inline_form by applying to blank template “themes/blank/html/base.html.twig” and making sure the form was using the blank template and the button style was class=“form-inline” (input attributes). It work on a normal page but it does not work on gated video screen. It seems gated video has a separate style that is applied on top of anything.