使用插件在Wordpress中的帖子中添加javascript代码

时间:2014-04-23 15:34:40

标签: php wordpress-plugin wordpress

我知道这是一个非常普遍的问题(我之前从未在wordpress中开发插件),但我要求一些帮助指出正确的方向。我想做一些我认为非常简单的事情:我已经开发了一个Web小部件,它从服务器上询问一些信息。基本上,开发人员在网络中插入的代码是这样的:

<div id="widget_wrapper"></div>
<script type="text/javascript" src="server/js/widget.js"></script>
<script type="text/javascript">
        var config = {
                item_id: 1,
                width: 500,
                heigth: 200
        };
init_widget(document.getElementById("widget_wrapper"), config);
</script>

我想用wordpress的插件复制这个功能。我希望用户在他的帖子上插入一些自定义标签(类似的东西),这样用户就可以指定他想要在标签内访问哪个元素。但我希望用户可以在帖子中插入,而不是像他页面一侧的小部件一样。有人可以给我一些开始开发它的技巧吗?

编辑1

我希望它也可以在Wordpress.com托管的博客中使用,因此用户只需将javascript代码粘贴到帖子中即可。

编辑2

为了澄清:基本上我想用插件做的是用户可以在你的帖子中插入一个标签来做类似我的web小部件的东西:用户指定你要在帖子中打印信息的item_id,并且服务器将在iframe中返回信息,iframe将插入div id =&#34; widget_wrapper&#34;。插件是什么,一旦插入给定(并引用item_id)标签,就在该空间中绘制信息。 enter image description here

1 个答案:

答案 0 :(得分:2)

实现这一目标的一种方法是使用短代码。

http://codex.wordpress.org/Shortcode_API

你可以在你的插件中创建一个类似这样的函数......

add_shortcode('my_tag_name', 'process_my_shortcode');
function process_my_shortcode($atts)
{
   $item_id = $atts['item_id'];
   $output_html = '<div id="widget_wrapper"></div>'.
                  '<script type="text/javascript" src="server/js/widget.js"></script>'.
                  '<script type="text/javascript">'.
                  'var config = { item_id:'.$item_id.', width: 500, heigth: 200 };'.
                  'init_widget(document.getElementById("widget_wrapper"), config);'.
                  '</script>';

   return $output_html;
}

现在,当用户在帖子中写下以下内容时,它将被页面中所需的代码替换。

[my_tag_name item_id="1"]