修改模板并向其中添加jQuery

时间:2011-03-02 作者:dnagirl

有一个名为“所有书签”的页面模板,用于显示按类别分组的所有链接。我想通过两种方式对其进行修改:

通过单击类别标题,每个类别的链接都应该是可折叠/可扩展的。模板应该接受一个类别列表,以包括或排除可折叠部分的类别,假设我只需要向每个类别标题添加一个类,以便我的jQuery代码可以影响它们。对于类别限制,我可能需要一种将参数传递给模板的方法。然而,我对WP完全没有兴趣,我也不知道

如果模板可以使用参数,或者模板需要引用自定义PHP函数,那么jQuery代码应该放在哪里?是将类添加到模板中,还是创建一个新模板?如果模板可以使用参数,或者模板需要引用自定义PHP函数,那么新模板应该放在哪里?我一直在WordPress周围徘徊。组织一段时间变得越来越沮丧。如果有人能解决上述问题,并给我指出一个关于WP代码结构的好解释,我将不胜感激。

谢谢

Version: WP 3.1
Theme: Suffusion 3.7.7

1 个回复
最合适的回答,由SO网友:t31os 整理而成

您可以这样做,而不是修改模板,因为您无论如何都需要jQuery。。

添加到functions.php

add_action( \'wp_enqueue_scripts\', \'blogroll_toggles\' );
function blogroll_toggles() {
    if( is_page_template( \'bookmarks.php\' ) )
        wp_enqueue_script( \'blogroll-toggle\', get_bloginfo( \'stylesheet_directory\' ) . \'/blogroll-toggle.js\', array( \'jquery\' ) );
}
或在中创建新文件夹wp-content/plugins/ 文件夹,在新文件夹中创建一个文件,例如。blogroll-plugin.php, 并添加以下内容。

<?php
/*
    Plugin Name: Suffusion Blogroll Toggles
*/
add_action( \'wp_enqueue_scripts\', \'blogroll_toggles\' );
function blogroll_toggles() {
    if( is_page_template( \'bookmarks.php\' ) )
        wp_enqueue_script( \'blogroll-toggle\', plugins_url( \'/blogroll-toggle.js\', __FILE__ ), array( \'jquery\' ) );
}
每当加载附加有书签模板的页面时,该函数基本上将在脚本中排队。jQuery被设置为脚本的依赖项,因此无需单独加载。

在主题(或插件)文件夹中创建一个文件并调用它blogroll-toggle.js, 然后将以下代码放入该文件中。

jQuery(document).ready( function($) {
    // Hide the blogroll lists
    $(\'div.entry ul.blogroll\').hide();
    // Attach a click function to the headings
    $(\'div.entry h4\').click( function() {
            // Make sure we\'re targeting the blogroll heading, if not, stop here(do nothing)
        if( !$(this).next(\'ul.blogroll\') )
            return false;
            // Toggle the blogroll list that follows the heading
        $(this).next(\'ul.blogroll\').toggle();
    });
});
jQuery没有经过测试,但应该可以工作(我已经做了几十次切换)。

NOTE: 如果用作插件,请记住像激活其他插件一样激活它。

如果代码有任何问题,请告诉我。:)

结束