如何挂接和修改新版本的用户界面(3.6+)?

时间:2014-06-24 作者:jjeaton

假设我想在“新”修订UI中添加一些post\\u meta。我只在修订版上保存了一些元数据,并希望在此屏幕上显示它。

enter image description here

通常,我会敞开心扉wp-admin/revisions.php 寻找一些钩子并编写代码。但是修订页已经完成了Backbone. 我不懂脊梁骨(完全愿意学习)。然而,我在WordPress中找不到任何关于如何修改现有管理主干视图的信息。

是否有人成功地修改了此界面,并可以提供一个如何完成的示例?

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

不幸的是,WordPress并没有为连接到主干模板制定标准化的最佳实践。已经有plans suggested 将熟悉的过滤器和动作API引入WordPress中的Javascript,但这一运动缺乏吸引力。卡尔·丹利created a library which does just that, 如果您正试图以最短的时间构建/jerry rig代码,这对您所要做的一切都很有帮助。

基本上,你是在试图掩盖revisions.view.Meta\'s微模板。

没有一种简单的方法可以覆盖微模板标记本身。我的建议是.template()revisions.view.Meta, 那些是revisions.view.MetaFromrevisions.view.MetaTo. 要做到这一点,这里有一些样板:

add_action( \'admin_footer-revision.php\', function() {
    $post = get_post();
    ?>
    <script id="tmpl-revisions-meta-override" type="text/html">
        <# if ( ! _.isUndefined( data.attributes ) ) { #>
            <div class="diff-title">
                <# if ( \'from\' === data.type ) { #>
                    <strong><?php _ex( \'From:\', \'Followed by post revision info\' ); ?></strong>
                <# } else if ( \'to\' === data.type ) { #>
                    <strong><?php _ex( \'To:\', \'Followed by post revision info\' ); ?></strong>
                <# } #>
                <div class="author-card<# if ( data.attributes.autosave ) { #> autosave<# } #>">
                    {{{ data.attributes.author.avatar }}}
                    <div class="author-info">
                    <# if ( data.attributes.autosave ) { #>
                        <span class="byline"><?php printf( __( \'Autosave by %s\' ),
                            \'<span class="author-name">{{ data.attributes.author.name }}</span>\' ); ?></span>
                    <# } else if ( data.attributes.current ) { #>
                        <span class="byline"><?php printf( __( \'Current Revision by %s\' ),
                            \'<span class="author-name">{{ data.attributes.author.name }}</span>\' ); ?></span>
                    <# } else { #>
                        <span class="byline"><?php printf( __( \'Revision by %s\' ),
                            \'<span class="author-name">{{ data.attributes.author.name }}</span>\' ); ?></span>
                    <# } #>
                        <span class="time-ago">{{ data.attributes.timeAgo }}</span>
                        <span class="date">({{ data.attributes.dateShort }})</span>
                    </div>
                    Your custom text here
                <# if ( \'to\' === data.type && data.attributes.restoreUrl ) { #>
                    <input  <?php if ( wp_check_post_lock( $post->ID ) ) { ?>
                        disabled="disabled"
                    <?php } else { ?>
                        <# if ( data.attributes.current ) { #>
                            disabled="disabled"
                        <# } #>
                    <?php } ?>
                    <# if ( data.attributes.autosave ) { #>
                        type="button" class="restore-revision button button-primary" value="<?php esc_attr_e( \'Restore This Autosave\' ); ?>" />
                    <# } else { #>
                        type="button" class="restore-revision button button-primary" value="<?php esc_attr_e( \'Restore This Revision\' ); ?>" />
                    <# } #>
                <# } #>
            </div>
        <# if ( \'tooltip\' === data.type ) { #>
            <div class="revisions-tooltip-arrow"><span></span></div>
        <# } #>
    <# } #>
    </script>
    <script>
    (function($) {
        wp.revisions.view.MetaFrom.prototype.template = wp.template(\'revisions-meta-override\');
        wp.revisions.view.MetaTo.prototype.template = wp.template(\'revisions-meta-override\');
    })(jQuery);
    </script>
    <?php
} );
并解释这一点。我们正在链接到修订版管理页面的页脚,因此我们保证构造函数revisions.view.MetaFromrevisions.view.MetaTo have been defined, 但在修订模块引导程序之前has been triggered. 这很重要,因为我们希望在使用构造函数之前对其进行修改。我复制了revisions.view.Meta\'将microtemplate逐字转换为模板的重写版本#tmpl-revisions-meta-override, 但请注意,我添加了Your custom text here 在模板中,您似乎需要自定义文本。然后,我重写两个构造函数template() 方法,使用修改后的微模板ID作为参考。

瞧。现在,这取决于您想对自定义文本执行什么操作。如果你想在里面塞一些文字,那就去做吧。如果您想输出特定于该版本的文本,那么您需要查看Carl Danley前面提到的库,并触发一个过滤器挂钩data 以便您可以输出特定于手头数据的内容。

我知道,这太疯狂了。但这就是我们在WordPress主干模板中覆盖Javascript的地方。我们应该讨论如何像您要求的那样将可定制性烘焙到core中,但我们不是因为缺乏兴趣/动力。在我们的weekly WordPress core developer chats. 我会去的。

结束