Drupal 7 开发内部培训资料, 分头诗人

怎么重新定制登录和注册窗口并请求接口?

赞成!
0
否决!

现在需要按设计定制首页的登录和注册的样式,在首页中将新的样式和js写到了theme中,现在如何利用新的登录框实现登录的请求功能?

2 个回答

赞成!
1
否决!

是类似Drupalla.com 的登录方式吗?可以通过添加外来JS lightbox 来实现。

drupal 的实现方式:

1,http://www.open-open.com/ajax/Lightbox.htm 中找到 lightbox_me , 下载并解压 jquery.lightbox_me.js 到sites/all/themes/yourtheme/js下面

2,yourtheme.info 增加下面代码:

1
scripts[] = js/jquery.lightbox_me.js

3, 新建block,内容如下(切记要调整html 过滤模式,设置为不过滤):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<script type="text/javascript" charset="utf-8">
        jQuery(function() {
            function launch() {
                 jQuery('#sign_up').lightbox_me({centered: true, onLoad: function() 
                 { jQuery('#sign_up').find('input:first').focus()}});
            }
           
            jQuery('#sign-up').click(function(e) {
                jQuery("#sign_up").lightbox_me({centered: true, onLoad: function() {
     jQuery("#sign_up").find("input:first").focus();
    }});
   
                e.preventDefault();
            });
           
           
            jQuery('table tr:nth-child(even)').addClass('stripe');
        });
    </script>
<ul id="sign-up-menu" class="links inline clearfix">
<li><a class="sign_up" href="/user/register">注册</a></li>
<li><a class="sign_up" href="#" id="sign-up">登陆</a></li>
</ul>
<div id="sign_up" style="display:none;" class="clearfix">
<h2>登陆</h2>
  <div style="float:left; width:350px; border-right: solid 1px #ccc;">
<form action="/user?destination=node" id="user-login-form" method="post">
  <div class="form-item">
   <label for="edit-name">用户名</label>
      <input class="form-text required" id="edit-name" maxlength="60" name="name" 
onblur="if(this.value=='')this.value=this.defaultValue" onfocus="if(this.value==this.defaultValue)
{this.value='';}else{this.select();}" size="20" tabindex="1" type="text" value="用户名" />
      <label for="edit-pass">密码</label><input class="form-text required" id="edit-pass" name="pass" 
onblur="if(this.value=='')this.value=this.defaultValue" onfocus="if(this.value==this.defaultValue)
{this.value='';}else{this.select();}" size="20" tabindex="2" type="password" value="******" />
      <div style="height:10px;"></div>
      <input class="form-submit" id="edit-submit" name="op" tabindex="3" type="submit" value="登陆" />
<span class="field-suffix">&nbsp;&nbsp;&nbsp;&nbsp;<a href="/user/register">注册</a></span></div>
   <input id="edit-user-login" name="form_id" type="hidden" value="user_login" /></form>
  </div>
  <div style="float:left;width:300px; padding-left:20px;">还没有注册帐号?
   <a href="reg">马上注册</a><p>或者通过合作网站直接登录蛋窝</p>
   <p><a href="/weibo/redirect?token=login" class="sina">用新浪微博登陆</a></p>
   <p><a href="connect/qt" class="qt">用腾讯微博登陆</a></p>
   <p><a href="connect/douban" class="douban">用豆瓣登陆</a></p>
   <p><a href="/qq/login" class="qq">用QQ账号登陆</a></p>
  </div>
</div>

4,page.tpl.php 相应位置加入下面代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php if ($user->uid) : ?>
        <ul id="user_info">
        <li class="t-sub">
        <a href="/user" charset="has-sub"><?php print $user->name; ?><span class="W_arr_d">
<em class="b1"></em><em class="b2"></em><em class="b3"></em></span></a>
    <?php print theme('links__system_secondary_menu', array(
        'links' => $secondary_menu,
        'attributes' => array(
        'id' => 'secondary-menu',
        'class' => array('links', 'inline', 'clearfix'),
        ),
        )); ?>
       </li>
        </ul>
        <?php else : ?>
        <div class="user_info">
        <?php
     $block = block_load('block', '1'); //1 为步骤2 里面建的block 的id
     $signup = drupal_render(_block_get_renderable_array(_block_render_blocks(array($block))));
     print $signup;
    ?>
        </div>
        <?php endif; ?>

 

赞成!
0
否决!

这样还是有个缺陷,那个form是提前生成了的, 最好是form是动态 ajax生成更好