WordPress自定义登录页面LOGO,链接,文字,样式等

说实话,小編居然觉得WordPress的后台登录页面也很简单,但对于一些使用WordPress的人不仅仅是作为博客,那么问题就来了,登录页面需要进行定制或者修改,并且符合整体风格的,所以小編在互联网上搜索了一个解决方案。也是一个记录分享!我相信您可以通过本文中的详细代码示例自定义更符合您的愿望的登录页面。同时,这比直接修改WordPress源文件更方便。它与WordPress升级覆盖问题不同。

自定义WordPress登录屏幕标志

在主题目录functions.php中添加以下代码:

//Customize WordPress login interface Logo 
function custom_login_logo ( )  { 
    echo  '<style type="text/css"> 
      h1 a { background-image:url(' . get_stylesheet_directory_uri() . '/images/logo.png ) !important; } 
    </style>' ; 
} 
add_action ( 'login_head' ,  'custom_login_logo' ) ;

使用上述方法时,应该提醒您要更换的Logo图像位于主题目录的/images/logo.png下。默认的WordPress背景标志大小为274px*63px。

删除WordPress登录屏幕标志

如果你想让后台登录界面更加简洁,你可以尝试只留下输入框,删除WordPress登录界面Logo。同样的方法将下面的代码添加到主题目录functions.php中:

//Delete the WordPress login interface Logo 
function admin_bar_remove ( )  { 
    global  $wp_admin_bar ; 
    /* Remove their stuff */ 
    $wp_admin_bar -> remove_menu ( 'wp-logo' ) ; 
} 
add_action ( 'wp_before_admin_bar_render' ,  'admin_bar_remove' ,  0 ) ;

更改Logo链接到主页链接:

// The LOGO link for the custom login page is the home page link 
add_filter ( 'login_headerurl' ,  create_function ( false , "return get_bloginfo('url');" ) ) ;

将Logo的链接更改为任何链接:

//Custom login interface LOGO link is any link 
function custom_loginlogo_url ( $url )  { 
    return  'https://mjiong.com' ;  //Modify URL address 
} 
add_filter (  'login_headerurl' ,  'custom_loginlogo_url'  ) ;

自定义Logo提示信息(tltle)

为网站名称定制:

// The custom login page's LOGO hint is the site name 
add_filter ( 'login_headertitle' ,  create_function ( false , "return get_bloginfo('name');" ) ) ;

将其自定义为任何其他文本:

/Custom login page LOGO hints for any text 
function custom_loginlogo_desc ( $url )  { 
    return  'tears snow blog' ;  //modify text information 
} 
add_filter (  'login_headertitle' ,  'custom_loginlogo_desc'  ) ;

自定义登录框内容

/ add additional information on the log in 
function custom_login_message ( )  { 
    echo  '<P> Welcome' . Get_bloginfo ( 'name' ) . ', Continuing </ p> <br /> after login' ; 
} 
the add_action ( 'login_form' ,  'custom_login_message' ) ;

自定义底部内容

// Customize the bottom information 
function custom_html ( )  { 
    echo  '<p style="text-align:center">© '  . get_bloginfo ( url ) . '</p>' ; 
} 
add_action ( 'login_footer' ,  'custom_html' ) ;

自定义CSS

为了更灵活地修改登录页面的显示样式,建议添加一个自定义CSS文件,然后查看登录页面源代码的html结构,并编写自己的CSS样式。你可以使用下面的代码来介绍你自己的CSS,注意在代码中修改css地址,下面的调用是在主题根目录下的login_style.css:

//Add a custom CSS 
function custom_login ( )  { 
    echo  '<link rel="stylesheet" type="text/css" href="'  . get_stylesheet_directory_uri()  .  '/login_style.css" />' ; 
} 
the add_action ( 'login_head' ,  'custom_login' ) ;

其实到最后的小編还是觉得!以上代码可以帮助您自定义WordPress默认的后台登录页面。如果您使用WordPress进行其他网站开发,也许您不会使用WordPress默认的后台登录页面。你可以从上面的代码中看到。开箱即用,对于不懂代码的人来说,自定义此页面非常方便,但对于理解代码的人员来说,可以做一个单独的登录页面。

小編没有太多的话要说。您可以使用上述代码自定义您的WordPress后台登录页面。

整理来自互联网



Mjiong君

爱生活,爱技术,爱分享

You may also like...

发表评论

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