Php wordpress:仅在出现短代码的地方加载javascript

Php wordpress:仅在出现短代码的地方加载javascript,php,wordpress,Php,Wordpress,有一个有趣的难题。我需要加载大约8个javascript文件和相同数量的插件样式。只有在运行我的短代码时才需要这些代码 我尝试用print_样式和print_脚本加载它们,但它们不能正确呈现,而且这样做会破坏xhtml验证。所以现在他们加载到每一页上,由于需要的文件数量太多,所以不可能像这样离开它 在另一个项目中,我在插件的index.php文件中编写了一个函数,该函数将获取当前页面,搜索我的短代码,如果找到,它将打印脚本,但这是一个丑陋的黑客行为 有人有什么建议或解决办法吗? 任何帮助都将不胜

有一个有趣的难题。我需要加载大约8个javascript文件和相同数量的插件样式。只有在运行我的短代码时才需要这些代码

我尝试用print_样式和print_脚本加载它们,但它们不能正确呈现,而且这样做会破坏xhtml验证。所以现在他们加载到每一页上,由于需要的文件数量太多,所以不可能像这样离开它

在另一个项目中,我在插件的index.php文件中编写了一个函数,该函数将获取当前页面,搜索我的短代码,如果找到,它将打印脚本,但这是一个丑陋的黑客行为

有人有什么建议或解决办法吗? 任何帮助都将不胜感激, 当做
Daithi

这些脚本将加载到多少页?是否可以维护一个页面数组,并且只在当前页面位于数组中时加载脚本/样式表


否则,如果不扫描代码,就没有办法做到这一点,因为WP甚至不知道短代码存在,直到进入页面加载。

Braedep是正确的,我很确定,在WP\u排队\u脚本执行时/样式表加载时,没有办法检测短代码的使用情况

有什么理由你必须在8个文件中这样做吗?一个会更有效,那么在每个页面上加载它可能不是问题

你可以考虑一个PHP样式表解决方案,如果需要的话只执行某些样式。css.php文件可能类似于:

<?php
header("content-type: text/css");
/* You can require the blog header to refer to WP variables and make queries */
//require '../../../wp-blog-header.php';
$css = '';
$css .= file_get_contents('style.css');
/* Consider using GET variables or querying a variable in the WP database to determine which stylesheets should be loaded. You could add an option to the backend that allows a stylesheet to be turned on or off. */
if($condition1 == TRUE) $css .= file_get_contents('condition1.css');
if($condition2 == TRUE) $css .= file_get_contents('condition2.css');
?>


更少的脚本和样式表意味着更少的http请求和更快的加载时间。

回答我自己的问题。。。我第一次让人写的。您必须搜索每个页面以检查是否正在使用您的短代码。这必须在加载页面数据和显示页面之前完成。对我来说,这完全是对系统的过度使用,但不幸的是,它就是这样。我是从以下方面得到这一信息的: 和

因此,首先:

add_action('template_redirect','wp_my_shortcode_head');
然后:


将“YOURSHORTCODE”替换为您的短代码的名称,并将您的wp_enqueue_脚本添加到显示//shortcode正在使用的位置。

只需在此处阅读本教程:

这似乎是最好的办法

add_action('init', 'register_my_script');
add_action('wp_footer', 'print_my_script');

function register_my_script() {
    wp_register_script('my-script', plugins_url('my-script.js', __FILE__), array('jquery'), '1.0', true);
}

function print_my_script() {
    global $add_my_script;

    if ( ! $add_my_script )
        return;

    wp_print_scripts('my-script');
}
在这种情况下,仅当$add\u my\u脚本 在呈现页面期间的某个点设置了全局

因此,如果在以下任何一个脚本中找到[myshortcode…],则将添加该脚本: 当前页面上的帖子


我在这里读到一个解决方案: 基本上,如果使用wordpress 3.3,您可以在短代码函数中将脚本排队

function my_shortcode($atts){
    wp_enqueue_script( 'my-script', plugins_url( 'plugin_name/js/script.js' ), array('jquery'), NULL, true);

    // if you add a css it will be added to the footer
//wp_enqueue_style( 'my-css', plugins_url( 'plugin_name/css/style.css' ) );

    //the rest of shortcode functionality
}
使用短代码在每页动态加载脚本和样式 优势
  • 不会在每次调用快捷码时搜索所有帖子。
  • 只有当页面上有快捷代码时,才能动态添加样式和脚本
  • 不使用正则表达式,因为它们往往比
    strstr()或
    strps()慢。如果需要拾取参数,则应使用上面提到的快捷码regex
  • 减少文件调用
代码解释
  • 仅当文章不是修订版且与指定的
    post\u类型
    匹配时,才使用
    save\u post
    钩子查找页面上的短代码

  • 使用“自动加载”设置为“是”的
    add\u option()
    将找到的帖子ID保存为数组,除非该条目已存在。然后它将使用
    update\u option()

  • 使用hook
    wp\u enqueue\u scripts
    调用我们的
    add\u scripts\u和\u styles()
    函数

  • function my_shortcode($atts){
        wp_enqueue_script( 'my-script', plugins_url( 'plugin_name/js/script.js' ), array('jquery'), NULL, true);
    
        // if you add a css it will be added to the footer
    //wp_enqueue_style( 'my-css', plugins_url( 'plugin_name/css/style.css' ) );
    
        //the rest of shortcode functionality
    }
    
  • 然后,该函数调用
    get\u option()
    来检索页面ID数组。如果当前
    $page\u id
    位于
    $option\u id\u数组中,则会添加脚本和样式

  • 请注意:我转换了OOP命名空间类的代码,因此可能遗漏了一些内容。如果有,请在评论中告诉我

    代码示例:查找短代码出现 代码示例:短代码动态包含脚本和样式
    如果帖子/页面有短代码,则加载脚本和样式

    最好的解决方案是,当且仅当当前帖子或页面的内容中包含短代码时,才将文件加载到页面标题中。这正是以下函数的作用:

    function flip_register_frontend_assets() 
    {
    
    //在此处注册脚本和样式

    wp_register_style('pp_font','plugin_styles.css', null, null, 'all');
    
    global $post;  
    
    //检查您的内容是否有快捷码

    if(isset($post->post_content) && has_shortcode( $post->post_content, 'your-
    shortcode')){  
    
    //将脚本和样式列在此处

     wp_enqueue_style( 'pp_font');
    
     }
     }
    
    只需将此函数放在一个插件文件中,就可以了。
    您需要将[您的短代码]替换为要搜索的短代码,还需要将plugin_styles.css替换为样式表名称。

    您可以使用此代码检查短代码是在页面内容中还是在侧边栏小部件中实现的

    <?php
    
    if ( shortcode_exists( 'gallery' ) ) {
        // The [gallery] short code exists.
    }
    
    ?>
    

    我使用WordPress版本5.4和OOP风格的代码,我不知道这是否会影响上述解决方案中没有一个不适合我的原因,因此我提出了以下解决方案:

    public function enqueue_scripts() {
     global $post;
     //error_log( print_r( $post, true ) );
     //error_log( print_r(  $post->post_content, true ) );
     //error_log( print_r(  strpos($post->post_content, '[YOUR_SHORTCODE]'),true));
    
     if ( is_a( $post, 'WP_Post' ) && strpos($post->post_content, '[YOUR_SHORTCODE]') ) 
     {
         wp_register_style('my-css', $_css_url);
         wp_register_script('my-js', $_js_url);
     }
    }
    

    希望这对其他人有所帮助。

    用户粘贴快捷码的任何地方。我找到了答案,第一次似乎我是对的。每个页面都必须在加载时进行搜索。Stackoverflow不允许我粘贴代码作为我自己问题的答案,所以这里有链接:太好了,这将非常有用。所有这些插件都添加了很多脚本。。。顺便问一下,询问stackoverflow是否比wordpress.stackexchange更好?您可以使用
    strstr()
    strps()
    而不是regex来查找您的短代码。。。如果只想检查一个字符串是否包含在另一个字符串中,则说明
    不要使用preg_match()。改为使用strps()或strstr(),因为它们会更快。
    但是如果短代码有args,那么它就不起作用。我不认为通过…这将不包括样式表,因为调用短代码太晚了
     wp_enqueue_style( 'pp_font');
    
     }
     }
    
    <?php
    
    if ( shortcode_exists( 'gallery' ) ) {
        // The [gallery] short code exists.
    }
    
    ?>
    
    public function enqueue_scripts() {
     global $post;
     //error_log( print_r( $post, true ) );
     //error_log( print_r(  $post->post_content, true ) );
     //error_log( print_r(  strpos($post->post_content, '[YOUR_SHORTCODE]'),true));
    
     if ( is_a( $post, 'WP_Post' ) && strpos($post->post_content, '[YOUR_SHORTCODE]') ) 
     {
         wp_register_style('my-css', $_css_url);
         wp_register_script('my-js', $_js_url);
     }
    }