Hi,
Thank you for waiting, while I performed some testing and research.
1. Loading the Bootstrap's Modal element, on page load:
The way the Bootstrap's Modal element works ( ref: hidden link ), it can be loaded when a page is loaded, without any additional script.
All you'll need is to introduce a "show" class, into the existing wrapping div with class "modal":
Existing code:
<div id="free-rounds-used-modal" class="modal-normalise modal fade" tabindex="-1" role="dialog">
......
</div>
Updated code:
<div id="free-rounds-used-modal" class="modal-normalise modal show" tabindex="-1" role="dialog">
......
</div>
2. Loading the Bootstrap's Modal element, on page load, only when a certain PHP condition is true:
For this, you can first create a custom shortcode, that evaluates the required condition and only returns the wrapped content, if it is true.
( ref: https://codex.wordpress.org/Shortcode_API )
Example:
// A shortcode to evaluate a PHP condition and output content only if it is true
add_shortcode( 'evaluate_condition_shortcode', 'evaluate_condition_shortcode_func');
function evaluate_condition_shortcode_func( $atts, $content = null ) {
// the condition that needs to be evaluated
if (is_page()) {
// return or show the content if the condtion is true
return $content;
}
}
Note: Feel free to replace the "is_page()" with the condition(s) that you need to evaluate.
In your content, you can use this shortcode like this:
[evaluate_condition_shortcode]
<div id="free-rounds-used-modal" class="modal-normalise modal show" tabindex="-1" role="dialog">
......
</div>
[/evaluate_condition_shortcode]
I hope this helps and for more personalized assistance around custom code, you can consider hiring a professional from our list of recommended contractors:
https://toolset.com/contractors/
regards,
Waqar