Can't get bootstrap modal to show

Question

Trying to use a basic modal i picked up from bootstrap site. Live link here http://soloveich.com/pr6

Need the modal to appear on "share" button click, and no luck so far.

Link code

<li id="spacer"><a href="#sharebox" data-toggle="modal" data-target="#sharebox"><div id="share"><p>Share</p></div></a></li>

Modal code

 <div class="modal fade" id="sharebox" role="dialog">
<div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
        </div>
        <div class="moda-body">
            <?php do_action( 'metroshare' ); ?>
        </div>
        <div class="modal-footer"></div>
    </div>
</div>
</div>

<?php wp_footer(); ?> 


<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="<?php bloginfo('template_url');?>/js/bootstrap.min.js"></script>

And my guess is that css has nothing to do with it.

What errors are you getting? Check with chrome devtools or something similar. — Yoni Levy, Jan 15 '14 at 20:23
And you have class="moda-body" instead of class="modal-body" — Yoni Levy, Jan 15 '14 at 20:25
Fixed that class. A few css warnings (all in bootstrap file), but no errors — shell, Jan 15 '14 at 20:38

score 0 · Answer 1 · edited May 23 '17 at 11:49

The problem is that the Bootstrap JS file isn't being loaded at all.

The jQuery file that's being loaded is coming from your theme's folder, not the jquery CDN as indicated in your code example. Also, a "View Source" on your page shows neither and no closing body tag. The line to get bootstrap JS looks fine though.

Leads me to believe there is a PHP error in your template that's causing the bottom of your page to not be output. You can check your PHP error logs for some clues.

To find your error log:

Where does PHP store the error log? (php5, apache, fastcgi, cpanel)
http://www.cyberciti.biz/faq/error_log-defines-file-where-script-errors-logged/
MAMP: /Applications/MAMP/logs/php_error.log
WAMP: C:\wamp\logs
XAMP: Where does PHP's error log reside in XAMPP?

Or just start removing stuff from your template until it works again. I'd start with removing the social media code and moving your javascript includes to above . On that note, consider using wp_enqueue_script() to load your scripts. You can find out more about it at the WordPress codex and in this tutorial: http://wp.tutsplus.com/articles/cheat-sheets/the-complete-guide-to-proper-javascript-usage-with-wordpress/

opened error log folder. Absolutely empty. There are no files at all. My guess is some problem there. jquery is working (tested it). Moved the modal code to index page. Doesn't show. Tried to call for it with button. Still no modal. And footer... I really don't get what's up with it as well. Waiting for a response on WP forum — shell, Jan 16 '14 at 02:51
To be honest, i have no idea. I copied code from example. Seemed like exactly the same code, but it just started working. — shell, Jan 24 '14 at 20:03

Can't get bootstrap modal to show

1 Answers1