WordPress主題製作(5)-定製WordPress登陸註冊頁面

方法概述

  1. 通過鉤子在登陸/註冊頁面引入自定義樣式表,修改基本信息,這些在主題的functions.php中完成。

  2. 在自定義樣式表中寫樣式覆蓋默認的樣式,達到更改界面的目的。

編輯主題的functions.php

1. 增加自定義樣式表

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

在主題目錄下創建一個目錄叫custom-login,在該目錄下創建一個名爲custom-login.css的文件,創建一個images文件夾存放圖片。

2.更改logo的url,默認指向wordpress.org

function custom_headerurl( $url ) {
    return get_bloginfo( 'url' );
}
add_filter( 'login_headerurl', 'custom_headerurl' );

3.更改logo的title,默認是“Powered by WordPress”(基於WordPress)

function custom_headertitle ( $title ) {
    return __( '歡迎來到Sola的博客' );
}
add_filter('login_headertitle','custom_headertitle');

4.在登陸表單中添加信息.

function custom_login_message() {
    echo '<p style="text-align:center">' . __('歡迎來到Sola的博客,請登錄後下載本站資源');
}
add_action('login_form', 'custom_login_message');

5.添加自定義HTML,例如增加版權信息

function custom_html() {
    echo '<p class="copyright">&copy; ' . get_bloginfo(url);
}
add_action('login_footer', 'custom_html');

6. 編輯custom-login.css

例如更改背景圖片,在custom-login.css中添加如下內容

body.login{
     background:url(images/bg.png) 0 0 no-repeat;
}

.login h1 a {
    background:url(images/logo-login.png) no-repeat;
}
/* 使用文字背景 */    
.login h1 a {
   background:none;
   text-indent:inherit;
   display:inline;
}
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章