I’m trying to have a modal box open by default when calling it by its id.
For example, if i enter the url www.mysite.com#post-28
(#post28 being the ID of the post)
I will land with the moadal box and the content of the post-28.
For this I have been using the following jquery ( iattach a basic version of the code):
<script>
jQuery(function ($) {
function popModal() {
{ alert("Your book is overdue.")
};
}
var hash = window.location.hash;
if (hash.substring(1) == 'post-<? the_ID(); ?>') {
popModal();
}
});
</script>
Which is not working when im calling dynamically post-<? the_ID(); ?>
However if I use this code instead:
<script>
jQuery(function ($) {
function popModal() {
{ alert("Your book is overdue.")
};
}
var hash = window.location.hash;
if (hash.substring(1) == 'post-17') {
popModal();
}
});
</script>
( post-17 being a post ID),
It does work.
I believe the problem is related how I call the post by <? the_ID ?>
any help will be incredible !
Thanks
— EDIT —
This is how i called my JS and seems to crash:
add_action( 'wp_enqueue_scripts', 'themeeo_scripts' );
function themeeo_scripts() {
// Load stylesheets
wp_register_style('theme-style', get_template_directory_uri() . '/css/style.css',array('bootstrap'));
wp_register_style('font-awesome', get_template_directory_uri() . '/css/font-awesome.min.css');
wp_register_style('bootstrap', get_template_directory_uri() . '/css/bootstrap.min.css');
wp_register_style('owl-carousel', get_template_directory_uri() . '/css/owl.carousel.css');
wp_register_style('tether', get_template_directory_uri() . '/css/tether.min.css');
wp_register_style('responsive-styles', get_template_directory_uri() . '/css/responsive.css',array('bootstrap'));
wp_register_style('custom-style', get_template_directory_uri() . '/css/custom.css',array('bootstrap'));
// wp_enqueue_style('tether');
wp_enqueue_style('bootstrap');
wp_enqueue_style('font-awesome');
wp_enqueue_style('style-dynamic');
wp_enqueue_style('responsive-styles');
wp_enqueue_style('theme-style');
wp_enqueue_style('custom-style');
if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
wp_enqueue_script( 'comment-reply' );
}
// Load jQuery scripts
wp_register_script('jquery', get_template_directory_uri() . '/js/jquery.js', array('jquery'));
wp_register_script('custom', get_template_directory_uri() . '/js/jquery.custom.js', array('jquery'));
wp_register_script('bootstrap', get_template_directory_uri() . '/js/bootstrap.min.js', array('jquery'));
wp_register_script('owl-carousel', get_template_directory_uri() . '/js/owl.carousel.min.js', array('jquery'));
wp_register_script('tether', get_template_directory_uri() . '/js/tether.min.js', array('jquery'));
wp_register_script('velocity', get_template_directory_uri() . '/js/velocity.js', array('jquery'));
wp_register_script('velocityui', get_template_directory_uri() . '/js/velocity.ui.js', array('jquery'));
wp_register_script('helium-parallax-js', get_template_directory_uri() . '/js/helium.parallax.js', array('jquery'));
wp_register_script('urlhash', get_template_directory_uri() . '/js/urlhash.js', array('jquery'));
wp_localize_script( 'custom', 'menuToggleText', array(
'open' => esc_html__( 'Open child menu' ),
'close' => esc_html__( 'Close child menu' ),
) );
wp_enqueue_script('helium-parallax-js');
wp_enqueue_script('jquery');
wp_enqueue_script('tether');
wp_enqueue_script('bootstrap', '', '', '', true);
wp_enqueue_script('owl-carousel', '', '', '', true);
wp_enqueue_script('tether', '', '', '', true);
wp_enqueue_script('custom', '', '', '', true);
wp_enqueue_script('skrollr.js', '', '', '', true);
wp_enqueue_script('velocity', '', '', '', true);
wp_enqueue_script('velocityui', '', '', '', true);
wp_enqueue_script( 'urlhash', get_template_directory_uri() . '/js/urlhash.js', array( 'jquery' ) );
if ( is_single() ){
$localization = array(
'post_id' => get_the_ID(),
);
wp_localize_script( 'urlhash', 'localized_object', $localization );
}
}