仅当帖子中存在特定内容时才加载Java脚本?

时间:2010-12-24 作者:Denis Belousov

我正在尝试将我的“Prettypoto”插件的Javascript添加到页面中,仅当其内容包含rel=\'prettyPhoto\'. 这看起来很简单,但我在互联网上找到的所有解决方案都不适合我。一个例子是:

<?php
function load_my_js() {
  if(is_admin() ) return; // never mind if this is an admin page
  global $post;
  if (strpos($post->post_content,\'rel="prettyPhoto\') == false) return
  wp_register_script(\'js_test\',plugins_url().\'/demo/test.js\',array(\'jquery\'));
  wp_enqueue_script(\'js_test\');
}
add_action(\'wp\',\'load_my_js\');
?>
Yoast的另一个:

function yst_conditional_thickbox() {
  global $post;
  if (is_singular() &&
    strpos($post->post_content,\'class="thickbox"\') !== false) {
      wp_enqueue_script(\'thickbox\');
      wp_enqueue_style(\'thickbox\');
  }
}
add_action(\'wp_print_styles\',\'yst_conditional_thickbox\');
也许你知道怎么做?非常感谢。


UPDATE

下面是代码的外观:

class UglyPhotoPlugin {
  static function on_load() {
    add_action(\'wp\',array(__CLASS__,\'load_my_js\'));
  }
  static function load_my_js() {
    if (!is_admin()) {
      global $post;
      if (strpos($post->post_content,\'rel="prettyPhoto"\') !== false) {
        wp_enqueue_script( \'jquery\' );
        wp_enqueue_script( \'prettyJs\', get_bloginfo(\'template_directory\').\'/js/jquery.prettyPhoto.js\', array( \'jquery\' ) );
      }
    }
  }
}
UglyPhotoPlugin::on_load();
HTML输出:

We are here!stdClass Object
(
    [ID] => 17
    [post_author] => 1
    [post_date] => 2009-12-25 17:10:18
    [post_date_gmt] => 2009-12-25 17:10:18
    [post_content] => 
    [post_title] => Portfolio
    [post_excerpt] => 
    [post_status] => publish
    [comment_status] => closed
    [ping_status] => closed
    [post_password] => 
    [post_name] => portfolio
    [to_ping] => 
    [pinged] => 
    [post_modified] => 2010-12-21 00:24:59
    [post_modified_gmt] => 2010-12-21 00:24:59
    [post_content_filtered] => 
    [post_parent] => 0
    [guid] => http://mysite.com/?page_id=17
    [menu_order] => 3
    [post_type] => page
    [post_mime_type] => 
    [comment_count] => 0
    [ancestors] => Array
        (
        )

    [filter] => raw
)
此代码在上面生成!DOCTYPE.我说得对吗?

1 个回复
SO网友:MikeSchinkel

不确定您的代码到底做错了什么,但这里有一些正确的代码。我决定将代码封装在一个类中,用于您的插件,出于幽默感,我将其称为“丑陋的照片插件”以下是完整代码:

<?php
/*
Plugin Name: Ugly Photo Plugin
*/
class UglyPhotoPlugin {
  static function on_load() {
    add_action(\'wp\',array(__CLASS__,\'wp\'));
    add_shortcode(\'ugly-photo\',array(__CLASS__,\'ugly_photo_shortcode\'));
  }
  static function ugly_photo_shortcode($attributes,$content,$code) {
    return \'<div rel="ugly-photo">\' . $content . \'</div>\';
  }
  static function wp() {
    if (!is_admin()) {
      global $post;
      if (strpos($post->post_content,\'[ugly-photo]\') !== false) {
        wp_enqueue_script( \'jquery\' );
        wp_enqueue_script( \'js_test\', 
          plugins_url(\'/demo/test.js\',__FILE__), 
          array(\'jquery\') );
      }
    }
  }
}
UglyPhotoPlugin::on_load();
请注意,我决定使用短代码[ugly-photo] 我正在测试它,而不是\'rel="prettyPhoto"\' 因为WordPress的WYSIWYG TinyMCE编辑器将删除"rel" 从您的<div> 因此,使用短代码可以解决这个问题。

以下是编辑帖子时的样子:

WordPress Post Editor with 'Ugly Photo' Shortcode
(来源:mikeschinkel.com)

下面是我的Javascript文件的内容以及我的位置:

https://mikeschinkel.com/websnaps/skitched-20101225-004514.jpg
(来源:mikeschinkel.com)

最后是结果:

Conditional Loading of Javascript in WordPress
(来源:mikeschinkel.com)

P、 美国节日快乐!

结束

相关推荐

如何将外部jQuery/Javascript文件与WordPress链接

因此,我使用Starkers作为我下一个WP主题的基础,我遇到了一个小问题,我在header.php 但是当我使用Firebug检查我的网站时,我注意到jquery被下载了两次,我做了一些挖掘,并注意到我不仅包括了文件,还包括了wp_head() 作用在尝试修复该问题时,我注意到头文件中有一条注释,该注释源于“210”主题:/* Always have wp_head() just before the closing </head> * tag of your theme, or