popup onLoad?
-
Topic
-
I love the theme and love the Bootstrap goodies etc. Just wondering if there’s much involved in getting the builtin popup to trigger when the page loads? Normally I’d advise a client against this behaviour, but they want to make it bleedingly obvious that the info on the posts (pricing indicators) is out of date and give users the option to go to the more up to date info, while still giving them access to the archival info, and keeping the link love. Thanks again for an awesome framework and plugins!
-
Replies
-
Hello,
I’ve never done this myself, but I would say you’d just have to do it with javascript. See docs for Bootstrap modals here:
http://twitter.github.io/bootstrap/javascript.html#modals
If you’re using one of the sample child theme’s you should already have a jQuery no conflict wrapper setup in the included javascript file to start placing your scripts.
You could also even target this to happen on a specific page by using the classes that WP adds to the
<body>in your selector.$('.page-id-123 #myModal').modal ...I’m also trying to do something on page load, but I just want to call a JavaScript function. Is there a way to incorporate onload=”myFunction()” into the BODY tag through my child theme functions.php? Or some other or better way to achieve this?
(I actually only need to run the function on one particular page, so I made the JavaScript function check window.location.href and do nothing unless it’s been called from the page I need it for.)
Thank you!
@msiep You want to put your javascript into a javascript file located in your child theme, and then enqueue that file from your child theme’s functions.php.
http://codex.wordpress.org/Function_Reference/wp_enqueue_script
I would suggest utilizing the jQuery library, which the theme uses on the frontend of your site already. The setup for your javascript file could look something like this:
jQuery(document).ready(function($) { // the DOM is ready... $(window).load(function() { // everything in the window is loaded ... if ( $('body').hasClass('page-id-123') ) { // do something when page with id 123 is loaded ... } } });
- You must be logged in to reply to this topic.