I have created a modal pop up using JavaScript.

The HTML for the modal is in a get_template_part("content","contact")` file.

The issue is, only on the home page does the modal pop up Through a click method.

When I visit another page, the modal doesn't pop up open.

How can I solve this issue?

Below is my JavaScript code:

$("#contactModal").click(function() {
$(".close").click(function()    {

Here, my HTML code:

<!-- Contact -->
<div id="contactModal" class="contactWrapper">
    <div class="contactText">
        <a><p>You think we're cool? <br><span>Let's Get in touch.</span></p></a>
</div><!-- end blogContainer -->
<!-- The Modal -->
<div id="myModal" class="modal">
    <div class="modal-content">
        <span class="close">&times;</span>
        <?php echo do_shortcode( '[contact-form-7 id="143" title="Main Contact Form"]' ); ?>
  • 1
    Hi, welcome to WPSE. Can you please specify how do you output your script to the browser? Using an external js file or via functions.php file?
    – Johansson
    Apr 18, 2017 at 9:37
  • You may surely have to add more details so as to enable the community understand the real nature of your challenge. For now, all may point to the fact that it is only available on your homepage. Apr 18, 2017 at 14:25
  • @JackJohansson, I am using an external file.
    – Leroy
    Apr 18, 2017 at 19:23
  • @nyedidikeke, there isn't much to it really. I am using the get_template() way of adding content to specific pages. The HTML mark up in is a content-contact.php file.
    – Leroy
    Apr 18, 2017 at 19:25
  • 2
    @Leroy I agree with the other comment. You might want to add some more details, such as error log of your browser for example. And please check your HTML output (View page source) to make sure the JS file and HTML markup are actually present on other pages.
    – Johansson
    Apr 18, 2017 at 19:38


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.