使用 Zurb Foundation 和 wordpress 没有冲突

Question

我目前正在使用 foundation 开发自定义主题，_s 我有几个 questions.I 已经遵循了本教程 Here 查询了我的所有脚本等，现在它正在运行。

我唯一担心的是 jquery，在一些论坛上说我必须注销 jquery 然后注册另一个等等。在一些论坛上它说我必须使用非冲突模式，而其他人告诉我只是查询它，仅此而已。在这种情况下什么是正确的做法？我不是在寻找一个临时的解决方案，我希望这个主题在未来没有问题或中断地更新。

在使用非冲突方式的情况下。我创建了一个名为 foundation.js 的文件，并使用以下代码将其放入 functions.php 文件中：

jQuery.noConflict();
jQuery(document).ready(function($) {
    $(document).foundation();
});

这是正确的方法吗？

Answer 1

WordPress 附带的 jQuery 库设置为 noConflict() 模式。在 noConflict() 模式下，jQuery 的全局 $ 快捷方式不可用。所以在 foundation.js 你可以只使用：

jQuery(document).ready(function ($) {
    jQuery(document).foundation();
});

check this link from the Codex

Answer 2

文档很粗略，但这应该是正确的方法，至少对我有用：

在functions.php中：

function my_enqueue_foundation() {
    wp_register_script('foundation', get_template_directory_uri() . '/js/foundation.min.js','','1.1', true);
    wp_enqueue_script('foundation');
}
add_action( 'wp_enqueue_scripts', 'my_enqueue_foundation' );

然后在footer.php

初始化基础

<?php wp_footer(); ?>


<script> jQuery(document).foundation(); </script>

Answer 3

如果您按照您链接到 (github) 的教程进行操作，那么您已经准备就绪。在主题的 functions.php 文件基础 JS 和一个初始化脚本入队：

function awesome_theme_scripts(){
    // scripts here ...
    wp_enqueue_script( 'foundation-js', get_template_directory_uri() . '/foundation/js/foundation.min.js', array( 'jquery' ), '1', true );
    wp_enqueue_script( 'foundation-init-js', get_template_directory_uri() . '/foundation.js', array( 'jquery' ), '1', true );
    // more scripts...
}

后者包含noConflict代码并初始化Foundation：

jQuery(document).ready(function($) {
    $(document).foundation();
});

使用 Zurb Foundation 和 wordpress 没有冲突

using Zurb Foundation with wordpress no conflict

jquery

wordpress

zurb-foundation-5