Sign in to follow this  
Followers 0

DMS 2 Modal is in front of page and blocks CTA

3 posts in this topic


You can see my problem here:

So I have a modal. And even though it's invisible it's still there and blocks call to action buttons. 


I've inserted the modal in my functions.php useing pagelines_before_site -hook: 

add_action('pagelines_before_site', 'beforeSite');
    function beforeSite() { ?>

<!-- Modal -->
<div class="modal fade" id="modaali" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">

        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><!--<span class="sr-only">Sulje</span>--></button>

        <h4 class="modal-title" id="myModalLabel">Ensimmäinen askel otettu!</h4>
      <div class="modal-body">
<p class="leadi center">Jätä sähköpostisi tai puhelinnumerosi niin katsomme yhdessä kuinka Bitcoin voisi hyödyttää liiketoimintaasi.</p>
<?php echo do_shortcode( '[contact-form-7 id="44" title="Ei otsikkoa"]' ); ?>
   <!--   <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>


Is this how the modal should be working or is there a bug somewhere?

Could you give me a step-by-step instruction on how to use the modal so it's not there when it's hidden?

The site is not visible since I don't want to release a version where users cannot use the CTA, but I will if it's necessary for debuging.

Thank you!


Share this post

Link to post
Share on other sites

Ok. I noticed that when I open it and close it, it then works. It was because it didin't have style="display:none" by default.

So I inserted style="display:none" to the modal and now it works. 

Is there a tutorial for the modals somewhere?

Share this post

Link to post
Share on other sites



The issue is likely your code, as there is no issue when I use the modal shortcode, which is what we recommend you use. We do not provide support to user created code unfortunately.


If you want a tutorial on how to use modals, you will want to read the Bootstrap 2.x docs. which is what we use.

1 person likes this

Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  
Followers 0

  • Similar Content

    • Problems when page loading on handheld devices
      By arcangel
      I hope someone can help I have built a landing page for my client using Pagelines DMS.
      At the bottom of the page there are some flags each opens a different modal with a 'RightSignature' contract within an Iframe.
      All works fine on a desktop, but for some reason when trying to go to the landing page on a handheld device it starts loading the page then all of a sudden it loads up a page displaying one of the contracts instead.
      Does anyone know what could be causing this? or think of a solution?
      Many thanks
    • Big white space in modal
      By yemoonyah
      I created a modal with a registration form inside (using the Pagelines modal shortcodes).
      On top of the form and right before the submit button there are huge white spaces that I can't seem to get rid of. I tried using Chrome Developer tools but I just can't figure out what is going on and how to fix it.
      It's not an issue with the S2member registration form because outside the modal it works fine.
      (click on 'I'm in" button to open the modal)
      Pagelines, WP and all plugins are up to date
      Host: WP Engine
      Any suggestions?
    • How can I have a responsive youtube-embed inside a modal?
      By ketri+

      When I insert a youtube-embed inside a modal, it won't work. I tried to have:
       <div class=" fitvids">         <iframe  src="//" frameborder="0"  allowfullscreen></iframe>       </div> But that won't work on mobile either.

      Thank you!
    • Why does .modal have its own font-family, font-weight and color definitions?
      By ketri+
      If I'm using custom fonts (like typekit) I'll need to override these here also...

      Thank you very much!
    • Modal Window Via Link
      By glennyboy
      Is it possible to add a Pagelines DMS Modal window via a link? I have a number of links that I wish to trigger the same modal and a short code won't work within my custom PHP. If possible how can I add the modal content?