👋🏼Welcome to my WP-Host blog where I am excited to share my knowledge and expertise on WordPress hosting and website construction tutorials with you. Let’s connect and learn from each other! You can reach me at info@yrshare.com.
(如果你会中文，可以点击微信图标与我联系。)
注：因个人英文水平有限，所以暂时只能为懂中文的朋友提供wordpress建站服务
微信：18200592859 或 yrwordpress
Modify the WordPress default login page (modify the login page LOGO and background image): Do you think the default login page of wordpress is too simple? Do you want to modify the default LOGO on the WordPress login page and change it to your own website LOGO? Do you want to add a beautiful background image to the login page? You may say that it can be modified using wordpress plugins, but today I will share the method without using plugins.
【WP-Host/悦然wordpress建站】
Continue to share the wordpress tutorials. The content shared today is to teach you to modify the default login page of wordpress, modify the LOGO picture, LOGO link, LOGO title, and background image on the login page. Here I use code to achieve it, but it is not complicated.
, you only need to add some simple code snippets in the wordpress theme Functions.php file to achieve these effects.
If you have installed Code Snippets or other similar code management plug-ins, you can also add the following code to the plug-in, which will be simple and convenient.
You can add the following code to the theme Functions.php file or the Code Snippets plug-in, and then upload a picture named [login_logo.png] in the [images] directory under the current theme directory of the website. This picture can be yours Website LOGO or other pictures.
If there is no [images] directory in your theme, you can create one manually.
//Modify the landing page LOGO
function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_loginlogo');By default, the logo on the landing page is linked to wordpress.org, so you can use the following code to modify the link, and the link address can be filled in freely.
//Modify the logo link on the landing page
function custom_loginlogo_url($url) {
return'https://yrshare.com/'; //Enter the URL address you need to link to here
}
add_filter( 'login_headerurl', 'custom_loginlogo_url');
function custom_register_url($url) {
return'https://yrshare.com/'; //Enter the URL address you need to link to here
}
add_filter( 'login_registerurl', 'custom_register_url');The default LOGO title is official wordpress, you can modify it through the following code, for example, I changed it to [WP-host] here, you can modify it to the title you want, such as your website name, company name.
//Modify the logo title of the landing page
function custom_headertitle ( $title ) {
return __( 'WP-host' );
}
add_filter('login_headertitle','custom_headertitle');
The default wordpress login page is gray, if you don’t think it looks good, you can add a beautiful picture background to it through the following code.
You can make a picture called [bg2.webp] and add it to the [images] directory of the current wordpress theme.
//Modify the background image of the landing page (method 1)
function custom_login_head(){
echo '<style type="text/css">
body{background-image: url('.get_bloginfo('template_directory').'/images/bg2.webp) !important; }
</style>';
}
add_action('login_head', 'custom_login_head');
If you think the fixed picture background is not good-looking, then you can use the following code to use the BING daily picture as the background of your wordpress landing page. This picture will change every day, and it will automatically read the BING picture.
//Call the bing image as the background image of the login page (changes every day)
function custom_login_head(){
$str=file_get_contents('http://cn.bing.com/HPImageArchive.aspx?format=js&idx=0&n=1');
if (preg_match("/\/(.+?).jpg/", $str, $matches)) {
$imgurl='http://s.cn.bing.net'.$matches[0];
}
echo'<style type="text/css">body{background: url('.$imgurl.');background-image:url('.$imgurl.');-moz-border-image: url('.$imgurl.');}</style>';
}
add_action('login_head', 'custom_login_head');继续分享wordpress建站教程，今天分享的内容是教大家修改wordpress默认的登陆页面，修改登陆页面的LOGO图片、LOGO链接、LOGO标题、背景图片，这里我是使用代码来实现的，不过这并不复杂，只需要在wordpress主题Functions.php文件中添加一些简单的代码片断就可以实现这些效果。如果你安装了Code Snippets或其它类似的代码管理插件，也可以把下面的代码添加到插件中，这样会简单方便。
你可以把下面的代码添加到主题Functions.php文件中或Code Snippets插件中，然后在网站当前主题目录下的【images】目录中上传名为【login_logo.png】的图片，这个图片可以是你的网站LOGO或其它图片。如果你的主题中没有【images】目录，可以手动创建一个。
//修改登陆页LOGO
function custom_loginlogo() {
echo '<style type="text/css">
h1 a {background-image: url('.get_bloginfo('template_directory').'/images/login_logo.png) !important; }
</style>';
}
add_action('login_head', 'custom_loginlogo');默认情况下登陆页的LOGO是链接到wordpress.org的，所以你可以使用下面的代码来修改这个链接，链接地址可以任意填写。
//修改登陆页LOGO链接
function custom_loginlogo_url($url) {
return'https://yrshare.com/'; //在此输入你需要链接到的URL地址
}
add_filter( 'login_headerurl', 'custom_loginlogo_url');
function custom_register_url($url) {
return'https://yrshare.com/'; //在此输入你需要链接到的URL地址
}
add_filter( 'login_registerurl', 'custom_register_url');默认的LOGO标题是wordpress官方的，你可以通过下面的代码来修改它，比如我这里修改成了【WP-host】，你可以修改为自己想要的标题，比如你的网站名、公司名。
//修改登陆页LOGO标题
function custom_headertitle ( $title ) {
return __( 'WP-host' );
}
add_filter('login_headertitle','custom_headertitle');默认的wordpress登陆页面是一个灰色，如果你觉得不好看，可以通过下面的代码来给它添加一个漂亮的图片背景。你可以制作一张名为【bg2.webp】的图片，然后把它添加到当前wordpress主题的【images】目录中。
//修改登录页背景图
function custom_login_head(){
echo '<style type="text/css">
body{background-image: url('.get_bloginfo('template_directory').'/images/bg2.webp) !important; }
</style>';
}
add_action('login_head', 'custom_login_head');如果你觉得固定的图片背景不好看，那么你可以通过下面的代码把BING每日图片作为你的wordpress登陆页面背景，这个图片每天都会变化，它会自动读取BING图片。
//调用bing图片作为登录页背景图（每天都会变化）
function custom_login_head(){
$str=file_get_contents('http://cn.bing.com/HPImageArchive.aspx?format=js&idx=0&n=1');
if (preg_match("/\/(.+?).jpg/", $str, $matches)) {
$imgurl='http://s.cn.bing.net'.$matches[0];
}
echo'<style type="text/css">body{background: url('.$imgurl.');background-image:url('.$imgurl.');-moz-border-image: url('.$imgurl.');}</style>';
}
add_action('login_head', 'custom_login_head');
