我想在單個產品頁面中創建一個 onclick 模式。我整理了以下內容：
FILES
js/modal-jquery.js并modal-box.html上傳到子主題的目錄中。
css在子主題的 css 中。
我在functions.php中加入了jquery
// Enqueue MODAL Jquery JS
function my_enqueue_stuff() {
if(is_singular( 'product' ))
{
wp_enqueue_script( 'modal-jquery-js', get_stylesheet_directory_uri() . '/js/modal-jquery.js');
// wp_enqueue_script( 'modal-box', get_stylesheet_directory_uri() . 'modal-box.html');
}
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_stuff' );
鏈接在functions.php
// POPUP LINK
add_action( 'woocommerce_before_add_to_cart_form', 'popup-modal', 3 );
function popup-modal() {
// $file = file directory to modal-box.html
echo '<a href="#" data-modal-id="popup"> Click me </a>';
}
modal-box.html
<div id="popup" class="modal-box">
<header>
<a href="#" class="js-modal-close close">×</a>
<h3>Modal Title</h3>
</header>
<div class="modal-body">
<p>Modal Body</p>
</div>
<footer>
<a href="#" class="js-modal-close">Close Button</a>
</footer>
</div>
我不確定這是否是正確的方法。
我一直在嘗試將 modal-box.html 添加到function popup-modal(). 我也試過排隊，modal-box.html但它給出了一條錯誤訊息Uncaught SyntaxError: expected expression, got '<'
如何將 html 檔案作為外部檔案加載到單個產品頁面中？如果這不是正確的方法，我如何向單個產品頁面添加模式框？
謝謝
uj5u.com熱心網友回復：
而不是is_singular( 'product' )使用woocommerce自己的is_product()
對于模態，如何將它包含在頁腳中，也只包含在產品頁面上，像這樣？：
function your_modal_footer(){
if( !is_product() ){
return;
}
?>
<div id="popup" class="modal-box">
<header>
<a href="#" class="js-modal-close close">×</a>
<h3>Modal Title</h3>
</header>
<div class="modal-body">
<p>Modal Body</p>
</div>
<footer>
<a href="#" class="js-modal-close">Close Button</a>
</footer>
</div>
<?php
}
add_action('wp_footer', 'your_modal_footer');
我會將 a 添加style="display:none;"到彈出式 div 中，然后在單擊彈出式觸發器時使其可見。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/353753.html
標籤：php 查询 WordPress的 求购 钩子商务