Support » Plugin: Popup Maker - Popup for opt-ins, lead gen, & more » Video extending outside popup

  • Resolved cudworth

    (@cudworth)


    Hi,

    I am inserting a video but no matter what settings I try, I cannot get the video to fit the popup. It always displays with extra black area above and below the video.

    I have found a similar post which advises to use this code…
    jQuery(‘.pum’).on(‘pumAfterOpen’, function () {
    jQuery(window).trigger(‘resize’);
    });

    But where do I insert this code to give it a try?

    Thanks in advance

Viewing 11 replies - 1 through 11 (of 11 total)
  • Plugin Support Maria Togonon

    (@mariatogonon)

    Hello @cudworth – could you send us a screenshot or a quick screencast of what exactly is happening from your end? That way, we can understand it better and we can assist you further.

    Thanks in advance.

    Thread Starter cudworth

    (@cudworth)

    Hi,

    Please try this link…
    https://photos.app.goo.gl/8nkaUL8gAypNSdtU8

    You will see it one image that when I preview the popup it displays exactly as desired. However, when I view on the site it is stretched – see black spaces in popup. Only when I resize browser window does it go to desired size like in the preview.

    Thanks

    Plugin Support Maria Togonon

    (@mariatogonon)

    Hey, thanks for sending us further details.

    I checked the screenshots and I see what you mean.

    ​May I ask, do you have any caching plugins active on your site? If so, then please could you try to purge/clear all caching plugin and browsers cache? You can also try to deactivate it temporarily from your end to see if that fixes the issue. Or, you can try it in incognito mode or in a different browser. 

    If that does not help at all, then for us to assist you further with this, you will need to escalate it directly to our HelpScout support desk. Check out this link: https://wppopupmaker.com/support/ Thank you.

    Hi Maria,

    We are having the same problem on 2 different sites.

    Please see the SS – https://nimb.ws/VyAFMG

    How long before you can get it fixed?

    Thanks

    Plugin Support Maria Togonon

    (@mariatogonon)

    Hello @ep2012 – sorry for the inconvenience.

    I noticed that you have an Autoptomize caching plugin active on your website. Could you please try to deactivate it temporarily from your end to see if that fixes the issue? Or, you can try it in incognito mode or in a different browser.

    If that does not works then like I mentioned above, you will need to escalate it directly to our HelpScout support desk. That is for us to assist you further with your issue. Check out this link: https://wppopupmaker.com/support/ Thank you for your kind understanding.

    Ok, I submitted a ticket b/c turning off autoptomize coaching didn’t help.

    I hope they get back to me soon.

    Thanks

    Also experiencing the same issue. Would love to hear a fix. Thank you.

    Plugin Author Daniel Iser

    (@danieliser)

    @azunga, @ep2012, @cudworth – Posting this here so you can all hopefully find the right answer going forward.

    This is generally not an issue with our plugin, never was.

    1. The code solution in the initial comment was made to help correct issues with other plugins that resize their content based on the parent container. It is no longer needed to add it manually, as we do it by default in the plugin now.

    The reason it worked was because things like sliders & some video players sized using JavaScript, but a hidden popup container has a size of 0px by 0px (all hidden elements in browsers are sized to that), this means they don’t size correctly. The JavaScript snippet posted calls the browsers resize event when a popup is opened, which many of them listen for, and they recalculate sizes when that happens.

    2. The only plausible reason the black box is there, is that the plugin your using for videos is trying to set the height of the video based on the height of the container. But popup containers are built to fit the content inserted into them and have no height by default, as well as having the hidden on page load issue. So in all likely hood the simple fix may be to just set the height of the video using CSS or using the [video src="" height=""] shortcode.

    3. It doesn’t seem to be happening when embedding youtube or vimeo videos on a clean install with just WP core + Popup Maker when pasting a youtube link or using the [video] shortcode.

    That said they are not always ideally sized width wise using the iframe/embed method, but that is because they are not responsive players by nature/default. It requires custom CSS or similar to handle that. These are some of the reasons we built and offer our Videos extension which also includes things like autoplay on open, close on finish etc.

    So:

    a. If you are using a 3rd party player, or your theme is hijacking the WP core player with its own customizations, you would need to discuss why its breaking with them. If they can give you a solid answer as to what exactly is causing it to fail, we might be able to then figure out how our plugin overlaps with that issue and give further guidance. We can’t always fix it on our end, many times it requires addressing the root of the issue rather than us trying to put bandaids on it.

    Our own Video extension solutions involve prefetching the videos actual size and size ratio, then outputting some CSS that forces the video to always maintain that ratio while still being 100% width in the popup.

    b. If you are using embed code with hard coded height & width, you will need to find a way to make it scale and render responsively (take up the space available width wise.

    There are many CSS based solutions to make these players responsive on your own if our extension is not an option.

    In general though if you have trouble with content in the popups, and that content isn’t created from our plugin, your first stop should be the source of how that content was created (shortcode, plugin, theme etc) and their support. We can’t tell you why their stuff breaks specifically, but if they tell us what exactly is broken (JavaScript not loading, CSS missing etc) we might be able to point them in the right direction. Otherwise just gonna be guessing.

    Hope that helps. If you still need help please message us directly at https://wppopupmaker.com/support/.

    Plugin Author Daniel Iser

    (@danieliser)

    Adding an addendum:

    c. If you are using something you think is not discussed above, such as a normal embed or already using the [video] shortcode and not hardcoding height/width please send us (via support form) the System info from Popup Maker -> Tools.

    Also in pretty much all cases, try using the Health Check plugin’s troubleshooting mode to activate only Popup Maker, then retest with the video in the popup and see what you get. That will tell you & us whether it’s resulting from a conflict with another plugin or theme.

    • This reply was modified 1 year, 1 month ago by Daniel Iser.

    I am facing the same problem, I am using a mp4 video to show in a popup, I am using internal video player. After searching for solution for 4 hours, I finally get it ok.
    I installed a plugin Easy Video Player and embed video using it, its working superfine, Hope it help others. Thanks

    @vikaselhc thank you so much for that plugin!! It worked for me as well!

    @danieliser thank you for the breakdown of the issue, it completely makes sense what you said.

Viewing 11 replies - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.