WordPress CSS编辑器插件

时间:2016-07-26 20:43:09

标签: php css wordpress

我正在构建一个插件,用于在我的管理员中使用CSS编辑器。目前我有这些功能:

  • 使用Ace
  • 的管理员中的代码编辑器
  • 链接到前端的样式表
  • 重写规则以动态生成前端链接CSS,而无需将CSS保存到文件

后端有一个编辑器,您可以在其中创建多个"代码选项卡"这就像虚拟CSS文件。可以将这些选项卡设置为仅显示在特定页面或所有页面中。

我使用此代码将脚本排入队列。

add_action( 'wp_enqueue_scripts', 'enqueue_scripts', 10, 1 );

function enqueue_scripts() {
    wp_enqueue_script(
        'code-editor', 
        site_url(
            sprintf(
                'code-editor/css/application.min.css?pid=%s',
                $post_id
            )
        ),
        false,
        false
    );
}

然后我有这个重写规则,用于通过PHP动态显示CSS。

add_action( 'init', 'add_rewrite_rules', 10, 1 );

function add_rewrite_rules() {
    add_rewrite_rule(
        '^code-editor/css/application.min.css/?',
        'index.php?code_editor_css=1',
        'top'
    );
}

add_filter( 'query_vars', 'add_query_vars', 10, 1 );

function add_query_vars( $vars ) {
    $vars[] = "code_editor_css";

    return $vars;
}

当用户加载http://example.com/code-editor/css/application.min.css

时,会运行此代码
add_action( 'wp', 'handle_code_pages', 10, 1 );

function handle_code_page() {
    global $wp_query;

    if( isset( $wp_query->query_vars['code_editor_css'] ) ) {
        global $wpdb;

        header( "Content-Type: text/css" );

        $current_post_id = isset( $_GET["pid"] ) ? intval( $_GET["pid"] ) : "";

        $css_tabs = $wpdb->get_results(
            $wpdb->prepare(
                "SELECT * FROM {$wpdb->prefix}code_editor_tabs
                WHERE type = 'css'
                AND document_type = 'external'
                AND active = 1
                AND FIND_IN_SET(%d, page_ids)
                ORDER BY sort_order ASC",
                $current_post_id
            )
        );

        foreach( $css_tabs as $css_tab ) {
            echo $css_tab->compressed_data;
        }

        exit;
    }
}

这里的问题是,当handle_code_page()运行时,WordPress会被加载,这会大大增加服务器响应时间。我想缓存它并改善响应时间。我的想法是,当handle_code_pages()运行时,我可以将CSS代码保存在/www-root/code-editor/css/application.min.css中,然后将该文件排入队列而不是重写规则链接。因为我可以设置CSS应该只应用于某些页面,每页需要一个CSS文件。因此,如果我转到ID为16的网页,我会在/www-root/code-editor/css/application-16.min.css创建一个CSS文件并将其排入队列。

我的问题是:在WordPress根目录下的自定义文件夹中生成和保存CSS文件然后链接它们是不好的做法吗?

0 个答案:

没有答案