自定义登录页面 | CSS-Tricks

您知道，通常位于 yoursite.com/wp-login.php 的那个页面。这些是您应该放在活动主题的 functions.php 文件中的内容。

更改徽标

默认情况下是 WordPress 徽标，这将更改该图像的文件路径。将文件路径和文件名更改为您的需求。

function custom_login_logo() {
	echo '<style type="text/css">h1 a { background: url('.get_bloginfo('template_directory').'/images/logo-login.gif) 50% 50% no-repeat !important; }</style>';
}
add_action('login_head', 'custom_login_logo');

更改 URL

… 点击徽标跳转到的位置。默认情况下跳转到 WordPress.org，这将将其更改为您的主页。

function change_wp_login_url() {
	return bloginfo('url');
}
add_filter('login_headerurl', 'change_wp_login_url');

更改标题

也就是说，更改您刚刚替换的图像的 title 属性。这会将其更改为设置中博客的名称。

function change_wp_login_title() {
	return get_option('blogname');
}
add_filter('login_headertitle', 'change_wp_login_title');

Jim

# 2011年1月7日

替换仪表板徽标也很有用

<style type=”text/css”>
  #header-logo { background-image: url(‘.get_bloginfo(‘template_directory’).’/img/dashboardlogo.gif) !important; }
</style>

相关问题：如果使用子主题，如何引用该目录？template_directory 引用的是父主题。谢谢！

Hassan

评论永久链接# 2011年3月18日

get_stylesheet_directory_uri();
RAMZI

评论永久链接# 2015年6月6日

很棒，但你能告诉我把这个自定义 CSS 放到哪里吗 xD

Kaushik Biswas

# 2011年2月2日

嗯！对我有很大帮助。谢谢，我一直想找一种简单的方法来更改个人博客的登录页面。

Tino1408

# 2011年2月22日

嗯，我在这方面是个新手，但你要把它放在哪里，比如放在 functions.php 的最底部，还是必须放在中间？

Tino1408

# 2011年2月22日

另外，你能举个例子说明在哪里放置它吗？我认为这将非常有帮助。谢谢

wptidbits

# 2011年3月4日

我认为把它放在 functions.php 的中间还是末尾都没有关系。只需确保在 functions.php 文件代码的最后面，没有任何空格。

例如，如果最后一行是…‘change_wp_login_title’); 请确保在“;”之后按下删除键，直到没有空格为止。

大多数情况下，当页面加载时调用此功能时，functions.php 不会运行，并且会报错。仅仅是我的一点建议。

Michael Gunner

# 2011年5月5日

如果你想更改整个页面的 CSS，请使用

function custom_login() { 
  echo '<link rel="stylesheet" type="text/css" href="'.get_bloginfo('template_directory').'/custom-login.css" /<'; 
}

amy marie adams

# 2011年5月25日

wordpress 有一个流行的插件，它非常棒并且易于使用，可以为您完成以上所有操作甚至更多。

它是 wp total hacks

https://wordpresstheme.cn/extend/plugins/wp-total-hacks/

piku2008

评论永久链接# 2011年7月3日

这个插件将帮助我完成所有未来的项目……

谢谢
Ablay

评论永久链接# 2012年1月25日

插件非常占用资源，而且会降低页面速度。

Michael Gunner

# 2011年6月10日

我更喜欢自己进行“黑客攻击”。我喜欢掌控一切。

Hassan

# 2011年7月7日

关于 change_wp_login_url 和 change_wp_login_title 函数，您应该返回数据而不是将其回显出来。因为回显会将其直接输出到浏览器，而返回数据则确保其他插件仍然可以连接到您的输出并修改结果。
使用过滤器挂钩时，您应该返回结果。

Rajesh Namase

# 2011年7月14日

很棒的技巧，非常有用。我正在我的博客中使用它。谢谢 :)

Unai

# 2012年4月10日

有人能告诉我如何对“退出登录”确认页面执行相同的操作吗？

谢谢（

Cam Collins

# 2012年6月24日

这篇文章非常有帮助，但是我需要使用自定义子主题更改我的登录徽标。我使用了 get_stylesheet_directory_uri，它返回子主题目录的网络地址（例如 style.css）


function my_login_head() {
	echo "
	<style>
	body.login #login h1 a {
		background: url('".get_stylesheet_directory_uri()."/images/your-logo.png') no-repeat scroll center top transparent;
		height: 70px;
		width: 285px;
	}
	</style>
	";
}
add_action('login_head', 'my_login_head');

Acedia

# 2012年8月15日

太棒了，我试试这个

Anthony

# 2012年10月15日

从 3.4 开始，您需要返回而不是回显。

function change_wp_login_url() {
  return get_home_url();
}

Wordpress Chef

# 2012年11月18日

另一种自定义 WP 登录页面的功能方法是使用自定义 CSS 文件。这可以通过以下代码实现。

function custom_login() {
  echo '<link rel="stylesheet" type="text/css" href="' . get_bloginfo('template_directory') . '/custom-login.css" />'; 
}

add_action('login_head', 'custom_login');

WPCookies

Alex

# 2013年6月29日

嘿，链接替换中有一个小错误，您应该使用 return get_bloginfo( 'url' ); 而不是 echo bloginfo('url');

alicia

# 2013年7月25日

您究竟是在 functions.php 文件中的哪个位置插入这段代码？我总是报错。

Mark

# 2013年12月24日

在按照 Alex 的建议操作之前，我一直无法更改链接。
return get_bloginfo( 'home_url' );

jasa pembuatan web

# 2014年4月30日

这是否仍然与最新的 wordpress 更新 (3.9) 相兼容？
因为我看到您的发布时间是 2013年
请回复
谢谢

Ryan

# 2014年7月26日

我可以做得更好，直接在主页上创建一个自定义登录表单，而无需触碰 wp-admin

$args = array(
    'redirect' => home_url(), // The link to redirect to after logging in, can also be admin_url().
    'form_id' => 'custom-login-form-id', // id of form
    'label_username' => __( 'Username' ), // Custom username text
    'label_password' => __( 'Password' ), // Custom password text
    'label_remember' => __( 'Remember Me' ), // Custom remember me text
    'label_log_in' => __( 'Log In' ), // Text for the login button
    'remember' => false 
);

wp_login_form( $args ); // Displays the login.

Avtar

# 2015年11月3日

嘿，我只是想更改 twenty fifteen 主题中的徽标。当我将代码放到 function.php 中时……WordPress 徽标消失了，但我的新徽标却没有出现……请帮帮我。

更改徽标

更改 URL

更改标题

评论

发表回复 取消回复

发表回复取消回复