跳转到主要内容
唯一 提交于 5 June 2015

目的:做一个登录界面,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框对准图片的位置

Drupal 版本

这个方法可以自定义 node 层面的模板,如果需要定制 page 层面的模板,可以 hook preprocess_page:

<?php
function yourtheme_preprocess_page(&$variables, $hook)
{
  if (arg(0) === 'user' && arg(1) === null && !$GLOBALS['user']->uid) {
    // 给未登录的用户 /user 加上 user__login
    if (!in_array('page__user__login', $variables['theme_hook_suggestions'])) {
      $variables['theme_hook_suggestions'][] = 'page__user__login';
    }
  }
}
?>

显示登录界面有两个位置,一个是 /user(在未登录时显示登录框,已登录时候显示的是个人信息),另一个是 /user/login。/user/login 可以直接通过写 page__user__login.tpl.php 搞定,而以上代码则可以在未登录时,访问 /user 时也增加 page__user__login 模板。这样最后只需要写 page__user__login.tpl.php 即可覆盖登录 page。