将脚本和样式排队到具有html的页面模板

时间:2015-06-16 作者:crag

我使用html5、css3和jQuery构建了一个自定义计算器。我有它的生活,它工作得很好,但现在有人想把我的计算在他们的WP网站,我们无法找出如何在他的WP网站上得到它。

我创建了一个计算器。php页面模板并放置我的。计算器内容区域中的html代码。php。然后,我在WP中创建了一个页面,并从页面属性中选择了模板。

我现在可以在页面上看到我定制的计算器,但没有任何样式,jQuery也无法工作。

我尝试将HTML、CSS和JS都加载到计算器的内容区域中。php页面模板,所以我不必排队,但它不能100%工作。它现在确实有一些样式和一些JS的作品,但不是100%。它似乎被CSS的主题所覆盖。

所以现在我想我应该尝试将CSS和JS排队到calculaotr上。php页面。

如何将脚本和样式排队到保存HTML的特定页面模板?

PHP让我很困惑。我在我的主题文件夹中创建了一个名为calc的目录,在calc中我有一个名为CSS和JS的文件夹。

指向我的css/public\\html/wp-content/themes/parallaxpro/calc/css/main的路径。css

指向我的js/public\\html/wp-content/themes/parallaxpro/calc/js/main的路径。js公司

谢谢你的帮助!!!

1 个回复
SO网友:Hybrid Web Dev

在我看来,你想做的就是为此创建一个独立的插件。你已经有了大量的基础工作设置(如代码),只需创建插件并将所有代码放入其中即可。您甚至可以更改并保留html模板,只需通过短代码调用即可。然后可以保留标记,并在需要时使用shortcode调用注册脚本/样式表并将其排队。

我不会详细介绍如何创建插件,但首先,请创建一个名为“My\\u plugin”的新文件夹或任何您想调用的文件夹。在那个文件夹中创建一个php文件,不管它叫什么,在这个示例中,您可以调用my\\u插件。php。

在该文件中,您将粘贴以下内容:

<?php
/*
Plugin Name: Plugin Name
Plugin URL: Whatever
Description: Plugin Desc
Version: 2.0
Author: Yup
Author URI: Uh huh
Contributors: Sure

*/
这会让你开始。从那里,您可以使用以下内容挂钩和注册脚本/样式:

add_action( \'wp_enqueue_scripts\', \'my_plugin_register_style_and_scripts\' \'enqueue_styles\',15);

add_action( \'admin_enqueue_scripts\', \'my_plugin_register_style_and_scripts\', \'backend_enqueue_styles\',15);
然后输入一个函数:

function my_plugin_register_style_and_scripts () {

$plugin_url = plugin_dir_url(__FILE__);

wp_register_style(\'style_sheet_handle\', $plugin_url."file.css\');

}
有了这个功能,您可以插入您的短代码来为您的计算器输出标记,在短代码调用中,只需将您的脚本/工作表等排队,您就完成了。

通过这种方式,您已经使代码尽可能具有可移植性:)希望这有帮助。

我想提到的一件事是,通过短码调用输出标记,您必须返回它,而不是回显它,否则WP会将其置于首位。如果您使用的是普通标记,那么可以使用输出缓冲来捕获标记,然后返回标记,以使其正常工作。您可以这样做:

<?php ob_start();

//call your template here

$content = ob_get_content();

ob_end_clean();

return $content; 

结束

相关推荐