目的:做一个登录界面,Drupal的登录窗口要多难看有多难看,用户名和输入框不在一行,一点都不符合中国人的习惯。
Step1:template.php中增加user_login form重写 function zeropoint_theme() { return array( 'user_login_block' => array( 'render element' => 'form', 'path' => drupal_get_path('theme', 'zeropoint') . '/templates', 'template' => 'user_login', 'preprocess functions' => array( 'zeropoint_preprocess_user_login_block',//这里的函数名需要和下面的函数名一致 ), ), ); }
function zeropoint_preprocess_user_login_block(&$vars) { $vars['form']['name']['#title']='用户名:';//修改用记名 $vars['form']['pass']['#title']=' 密码:';//修改密码 $vars['form']['submit']['#value']='登录';//修改button值 //$vars['form']['links'] =' ';//去掉注册和忘记密码两个链接 } Step2:templates文件夹下增加user_login.tpl.php文件, <div id="user-login-name"> <?php print drupal_render($form['name']); ?> </div> <div id="user-login-pass"> <?php print drupal_render($form['pass']); ?> </div> <div id="user-login-submit"> <?php print drupal_render_children($form);?> </div>
Step3:网上找一个好看的登录界面,把图作为背景,增加如下CSS
#user-login-form { width: 1200px; height:675px; display:block; background:transparent url(../images/login.png) top center; } #block-user-login { width: 1200px; height: 675px; } #block-user-login .form-type-textfield label ,#block-user-login .form-type-password label ,#block-user-login h2 { display:none !important; } #user-login-form #user-login-name input { position: relative; top: 387px; left:352px; background:transparent; width:190px; } #user-login-form #user-login-pass input { position: relative; top: 347px; left:611px; background:transparent; width:190px; }
#user-login-form #user-login-submit .item-list { position: relative; top: 346px; left:701px; font-size: 16px }
#user-login-form #user-login-submit #edit-actions input { position: relative; top: 273px; left: 826px; font-size: 16px; width: 63px; height: 33px; padding:0; }
完毕,就这样,上面的CSS调了好久,主要思路就是用CSS把文字不可见,把input框对准图片的位置
page 模板
这个方法可以自定义 node 层面的模板,如果需要定制 page 层面的模板,可以 hook preprocess_page:
显示登录界面有两个位置,一个是 /user(在未登录时显示登录框,已登录时候显示的是个人信息),另一个是 /user/login。/user/login 可以直接通过写 page__user__login.tpl.php 搞定,而以上代码则可以在未登录时,访问 /user 时也增加 page__user__login 模板。这样最后只需要写 page__user__login.tpl.php 即可覆盖登录 page。