替换WordPress登录页logo的方法

由于WordPress版本的更新,替换这个logo已经不是像原来一样只需要替换一个logo-login.png这么简单的事情了。现在WordPress的登录页面logo已经替换成.svg格式,并在链接中加入了版本标记,所以直接替换是不起作用的,必须把版本号一起改了。下面是具体步骤:

1、首先需要一个64×64的.svg文件,没有的话用png在线转一个,在线转换。将此文件重命名为:

wordpress-logo.svg

2、审查元素发现在登录页面调用了一个叫做login.min.css的样式表(请注意这个样式表是带ver字段的,也就是说有版本号的区别)。在第1290行标记了logo的URL20151023124006

请注意,这个URL也是带版本号的,之后要修改。

background-image: none,url(../images/wordpress-logo.svg?ver=20131107);

3、将/wp-admin/images/中的wordpress-logo.svg用步骤1中的文件替换

4、修改login.min.css

~# vi wp-admin/css/login.min.css

找到步骤2中所提到的字段,将ver=20131107修改为步骤1中.svg文件的创建日期(我是今天创建的所以日期是20151023),或者直接删除“ ?ver=20131107 ”。

5、修改css完成后,这个css文件并没有生效,因为在wp-login.php中是这样引用的:

<link rel='stylesheet' id='login-css' href='http://blog.zivers.com/wp-admin/css/login.min.css?ver=4.3.1' type='text/css' media='all'/>

注意到,css的引用中也带了ver参数,即也有版本控制。所以我们需要更新一下css的引用

~# vi wp-login.php

找到下面这一行

wp_admin_css( 'login', true );

在wp-login中是调用了wp_admin_css()这个方法来生成css引用列表的。我们可以在wp-includes/general-template.php这个文件中找到wp_admin_css()方法的声明:

function wp_admin_css( $file = 'wp-admin', $force_echo = false ) {
        // For backward compatibility
        $handle = 0 === strpos( $file, 'css/' ) ? substr( $file, 4 ) : $file;

        if ( wp_styles()->query( $handle ) ) {
                if ( $force_echo || did_action( 'wp_print_styles' ) ) // we already printed the style queue. Print this one immediately
                        wp_print_styles( $handle );
                else // Add to style queue
                        wp_enqueue_style( $handle );
                return;
        }

        echo apply_filters( 'wp_admin_css', "<link rel='stylesheet' href='" . esc_url( wp_admin_css_uri( $file ) ) . "' type='text/css' />\n", $file );

        if ( function_exists( 'is_rtl' ) && is_rtl() ) {
                /** This filter is documented in wp-includes/general-template.php */
                echo apply_filters( 'wp_admin_css', "<link rel='stylesheet' href='" . esc_url( wp_admin_css_uri( "$file-rtl" ) ) . "' type='text/css' />\n", "$file-rtl" );
        }
}

所以,重新生成只需要在调用wp_admin_css的时候将参数$force_echo设为false即可,即修该wp-login.php中的调用语句:

wp_admin_css( 'login', false );

6、刷新登录页面即可看到效果。

为了安全,将刚才修改的wp_admin_css()方法的参数改回true。

发表评论

电子邮件地址不会被公开。 必填项已用*标注