Question

我正在开发一个wordpress插件，我需要在其中实现colorbox。我有以下代码。插件工作得很好，但颜色框不起作用。我已将相同的颜色框代码复制到html文件及其工作状态。唯一的问题是wordpress插件。要么我没有完全导入js和css或其他任何东西出错。急需帮助。

<?php

/*
Plugin Name: my plugin
Plugin URI: http://www.xxx.com/
Description: xxx
Author: xxx
Version: 1.0
Author URI: http://www.xxx.com
*/


wp_enqueue_style('colorbox.css', '\wordpress\wp-  
content\plugins\calc_plugin\colorbox.css');
wp_enqueue_script('jquery.js', '\wordpress\wp-content\plugins\calc_plugin\jquery.js',  
array('jquery1'));
wp_enqueue_script('colorbox.js', '\wordpress\wp- 
content\plugins\calc_plugin\colorbox.js', array('jquery2'));

function calc_form_markup() {
$markup = <<<EOT




<script>
$(document).ready(function(){
$(".inline").colorbox({inline:true, width:"600", height:"450"});
});
</script>


<div style='display:none' >

<div id='inline_content1' style='padding:10px; background:#fff;'>
<p><strong>This is inline content 1</strong></p>
<image src = "http://wallpaper.goodfon.com/image/240138-1360x768.jpg" width = "175"     
height = " 150">
</div>

</div>

<p><a class='inline' href="#inline_content1">Inline HTML</a></p>

EOT;

return $markup;

}

add_shortcode('calc_form', 'calc_form_markup');


?>

Answer 1

您的wp_enqueue_script错了。

以下是参数：

wp_enqueue_script( 
     $handle
    ,$src
    ,$deps
    ,$ver
    ,$in_footer 
);

$deps（依赖）是jQuery，已经包含在WordPress中并使用jquery NOT 'jquery1'进行调用。

您的JavaScript错误，在WordPress中使用无冲突包装，jQuery而不是$

$(document).ready(function()应为jQuery(document).ready(function()

Answer 2

您没有加载Colorbox运行所需的jQuery脚本。在排队Colorbox.js之前将其排队。

wp_enqueue_script("jquery");

在wordpress插件中使用彩盒

2 个答案: