注册 登录  
 加关注
查看详情
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

勇气

终生读书

 
 
 

日志

 
 

【转】Discuz!x1.5头部登录框、注册部分移动到页面顶端的方法  

2011-12-20 10:29:00|  分类: 默认分类 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |

把登陆和注册移到顶部,经过百度、google后未果,于是静下心来经过一个上午的研究解决了这个问题,在此同大家进行分享,相信对不少人有帮助吧!好了,闲话不多说了上效果。

未登录的效果:【转】Discuz!x1.5头部登录框、注册部分移动到页面顶端的方法 - 勇气 - 勇气



登录成功后:【转】Discuz!x1.5头部登录框、注册部分移动到页面顶端的方法 - 勇气 - 勇气




下面讲解实现步骤:【转】Discuz!x1.5头部登录框、注册部分移动到页面顶端的方法 - 勇气 - 勇气写的不够明了,希望您仔细阅读核对,您一定能实现最终效果,蓝色字为描述。

一、根据代码的顺序我们首先实现的是登陆成功后的效果。
①用编辑器(Dreamweaver、记事本等等)打开文件template\default\common\header.htm,会看到如下代码

  1. <!--{subtemplate common/header_common}-->
  2. <!--{if defined('CURMODULE') && ($_G['basescript'] == 'forum' || $_G['basescript'] == 'group') && (CURMODULE == 'index' || CURMODULE == 'forumdisplay' || CURMODULE == 'group')}-->$rsshead<!--{/if}-->
  3. <!--{if $_G['basescript'] == 'forum' || $_G['forum']['status'] == 3}-->
    .
  4. ..
  5. .


③找到以下的代码(下划线蓝色)
第一段代码

  1. <h2><a href="./" title="$_G['setting']['bbname']">{BOARDLOGO}</a></h2>
复制代码

这段代码显示logo,logo可以通过编辑你的默认模板进行修改,具体位置在后台-界面-风格管理。根据默认头部的结构这里不能保留这段代码,如果需要logo,可以把这段代码移到第一步中第二段代码的下面(格式为<div>这里放logo代码</div>)logo默认出现在最左边,在这个<div></div>之间可以再加入一个Flash广告什么的,这里需要一点html+css知识

第二段代码

  1. <div class="avt y"><a href="home.php?mod=space&uid=$_G[uid]" c="34"><!--{avatar($_G[uid],small)}--></a></div>
复制代码

这段代码控制登陆后显示出的头像

第三段代码

  1. <p>
  2. <!--{eval $upgradecredit = $_G['uid'] && $_G['group']['grouptype'] == 'member' && $_G['group']['groupcreditslower'] != 999999999 ? $_G['group']['groupcreditslower'] - $_G['member']['credits'] : false;}-->
  3. {lang credits}: <a href="home.php?mod=spacecp&ac=credit">$_G[member][credits]</a><!--{loop $_G['setting']['extcredits'] $extcreditid $extcredit}--> , {$extcredit[img]}$extcredit[title]: <a href="home.php?mod=spacecp&ac=credit" id="hcredit_$extcreditid"><!--{echo getuserprofile('extcredits'.$extcreditid);}--></a> {$extcredit[unit]}<!--{/loop}--> , {lang usergroup}: <a href="home.php?mod=spacecp&ac=usergroup"{if $upgradecredit !== 'false'} id="g_upmine" class="xi2" onmouseover="showMenu({'ctrlid':this.id, 'pos':'21'});"{/if}>$_G[group][grouptitle]</a>
  4. </p>
复制代码

这段代码显示积分以及用户组信息

将以上3段代码删除,删除之后可以看到如下效果。看不到效果的更新缓存,在后台-工具里面。

2010-10-19 19:26:12 上传下载附件 (21.51 KB)




④看到上面的效果之后,接下来要做的就很明确了,页面没有置顶,要把整个页面往上提。

  1. <div class="hdc cl">              //我是下划线红色
复制代码

的后面加上代码style="margin-top:-40px;"(我的头部用-40px比较合适,具体数值可以根据需要而定。
完整代码如下:

  1. <div class="hdc cl" style="margin-top:-40px;">
复制代码

到这里登陆成功的效果就实现了。加背景的方法:

  1. <div class="hdc cl" style="margin-top:-40px;background-color:颜色自定;background:uri(图片路径,注:这里要用ps切出的一小段图片)  repeat-x ; "
复制代码

repeat-x的意思是水平填充。


二、下面开始修改未登录的效果。
①找到代码

  1. <!--{template member/login_simple}->          //我是有下划线的那个
复制代码

代码的意思是导入template/member/login_simple.htm,这个页面就是未登录时的效果,用编辑器打开它,代码如下

  1. <!--{if CURSCRIPT != 'member'}-->
  2. <form method="post" autocomplete="off" id="lsform" action="member.php?mod=logging&action=login&loginsubmit=yes&infloat=yes" onsubmit="return lsSubmit()">
  3. <div class="fastlg cl">
  4. <span id="return_ls" style="display:none"></span>
  5. <div class="y">
  6. <p><a href="member.php?mod=logging&action=login&viewlostpw" onclick="showWindow('login', this.href)" class="xi2">{lang getpassword}</a></p>
  7. <p><a href="member.php?mod={$_G[setting][regname]}" onclick="showWindow('register', this.href)" class="reglk xi2">$_G['setting']['reglinkname']</a></p>
  8. </div>
  9. <div class="fastlg_fm y pns">
  10. <p>
  11. <!--{if !$_G['setting']['autoidselect']}-->
  12. <span class="ftid">
  13. <select name="fastloginfield" id="ls_fastloginfield" width="45" tabindex="900">
  14. <option value="username">{lang username}</option>
  15. <option value="uid">{lang uid}</option>
  16. <option value="email">{lang email}</option>
  17. </select>
  18. </span>
  19. <script type="text/javascript">simulateSelect('ls_fastloginfield')</script>
  20. <input type="text" name="username" id="ls_username" autocomplete="off" class="px vm" tabindex="901" />
  21. <!--{else}-->
  22. <label for="ls_username">{lang account}</label> <input type="text" name="username" id="ls_username" class="px vm" {if $_G['setting']['autoidselect']} value="UID/{lang username}/Email" onfocus="if(this.value == 'UID/{lang username}/Email') this.value = '';" onblur="if(this.value == '') this.value = 'UID/{lang username}/Email';"{/if} tabindex="901" />
  23. <!--{/if}-->
  24. <input type="checkbox" name="cookietime" id="ls_cookietime" class="pc" value="2592000" tabindex="903" /> <label for="ls_cookietime">{lang save_password}</label>
  25. </p>
  26. <p>
  27. <label for="ls_password"{if !$_G['setting']['autoidselect']} class="z psw_w"{/if}>{lang password}</label> <input type="password" name="password" id="ls_password" class="px vm" autocomplete="off" tabindex="902" onfocus="lsShowmore()" />
  28. <button type="submit" class="pn vm"><em>{lang login}</em></button>
  29. </p>
  30. <input type="hidden" name="quickforward" value="yes" />
  31. <input type="hidden" name="handlekey" value="ls" />
  32. </div>
  33. </div>
  34. <div id="ls_more" style="display:none">
  35. <h3>
  36. <em class="y"><a title="{lang close}" onclick="display('ls_more')" class="flbc" href="javascript:;">{lang close}</a></em>
  37. {lang safety_verification}
  38. </h3>
  39. <span class="z"><script type="text/javascript">var ls_sechash = '';</script></span>
  40. <!--{if $_G['setting']['seccodestatus'] & 2}-->
  41. {eval
  42. $seccodechecktmp = !empty($seccodecheck) ? $seccodecheck : false;
  43. $secqaachecktmp = !empty($secqaacheck) ? $secqaacheck : false;
  44. $seccodecheck = $_G['setting']['seccodestatus'] & 2;
  45. $secqaacheck = false;
  46. $secshow = 0;
  47. $sectabindex = 904;
  48. }
  49. <!--{if $seccodecheck}-->
  50. <!--{block sectpl}--><div class="mtm mbn c"><em style="display:none"><sec></em><sec></div><div class="pbm bbda xg1 d"><sec></div><!--{/block}-->
  51. <!--{subtemplate common/seccheck}-->
  52. <script type="text/javascript">ls_sechash = '$sechash';</script>
  53. <!--{/if}-->
  54. <!--{eval $seccodecheck = $seccodechecktmp;$secqaacheck = $secqaachecktmp;}-->
  55. <!--{/if}-->
  56. <div class="ftid mtm mbn">
  57. <select id="ls_questionid" width="131" name="questionid" autocomplete="off" tabindex="905" change="if($('ls_questionid').value > 0) {$('ls_answer').style.display='';$('ls_answer').focus();} else {$('ls_answer').style.display='none';}">
  58. <option value="0">{lang security_question}</option>
  59. <option value="1">{lang security_question_1}</option>
  60. <option value="2">{lang security_question_2}</option>
  61. <option value="3">{lang security_question_3}</option>
  62. <option value="4">{lang security_question_4}</option>
  63. <option value="5">{lang security_question_5}</option>
  64. <option value="6">{lang security_question_6}</option>
  65. <option value="7">{lang security_question_7}</option>
  66. </select>
  67. <input type="text" name="answer" id="ls_answer" style="display:none" autocomplete="off" size="36" class="px mtn" tabindex="906" />
  68. </div>
  69. <script type="text/javascript">simulateSelect('ls_questionid')</script>
  70. </div>
  71. </form>
  72. <!--{/if}-->
复制代码

这个要改动的部分稍微多一些,但也很简单
我们需要修改的代码为以下部分,同样其他代码果断无视

  1. <!--{if CURSCRIPT != 'member'}-->
  2. <form method="post" autocomplete="off" id="lsform" action="member.php?mod=logging&action=login&loginsubmit=yes&infloat=yes" onsubmit="return lsSubmit()">
  3. <div class="fastlg cl">
  4. <span id="return_ls" style="display:none"></span>
  5. <div class="y">
  6. <p><a href="member.php?mod=logging&action=login&viewlostpw" onclick="showWindow('login', this.href)" class="xi2">{lang getpassword}</a></p>
  7. <p><a href="member.php?mod={$_G[setting][regname]}" onclick="showWindow('register', this.href)" class="reglk xi2">$_G['setting']['reglinkname']</a></p>
  8. </div>
  9. <div class="fastlg_fm y pns">
  10. <p>
  11. <!--{if !$_G['setting']['autoidselect']}-->
  12. <span class="ftid">
  13. <select name="fastloginfield" id="ls_fastloginfield" width="45" tabindex="900">
  14. <option value="username">{lang username}</option>
  15. <option value="uid">{lang uid}</option>
  16. <option value="email">{lang email}</option>
  17. </select>
  18. </span>
  19. <script type="text/javascript">simulateSelect('ls_fastloginfield')</script>
  20. <input type="text" name="username" id="ls_username" autocomplete="off" class="px vm" tabindex="901" />
  21. <!--{else}-->
  22. <label for="ls_username">{lang account}</label> <input type="text" name="username" id="ls_username" class="px vm" {if $_G['setting']['autoidselect']} value="UID/{lang username}/Email" onfocus="if(this.value == 'UID/{lang username}/Email') this.value = '';" onblur="if(this.value == '') this.value = 'UID/{lang username}/Email';"{/if} tabindex="901" />
  23. <!--{/if}-->
  24. <input type="checkbox" name="cookietime" id="ls_cookietime" class="pc" value="2592000" tabindex="903" /> <label for="ls_cookietime">{lang save_password}</label>
  25. </p>
  26. <p>
  27. <label for="ls_password"{if !$_G['setting']['autoidselect']} class="z psw_w" {/if}>{lang password}</label> <input type="password" name="password" id="ls_password" class="px vm" autocomplete="off" tabindex="902" onfocus="lsShowmore()" />
  28. <button type="submit" class="pn vm"><em>{lang login}</em></button>
  29. </p>
  30. <input type="hidden" name="quickforward" value="yes" />
  31. <input type="hidden" name="handlekey" value="ls" />
  32. </div>
  33. </div>
复制代码


②将上面代码中的<p>替换成<span>,</p>替换成</span>。(这样是为了让登录等信息水平显示)
接着删除以下代码中的红色部分(都是按钮和文本框的样式,我们不需要)
由于代码里不能改颜色所以写出来
1.reglk
2.class="px vm"    (只要是这个都删,button标签里那个pn vm的不要删)
3.class="pc"
4.class="z psw_w"


  1. <!--{if CURSCRIPT != 'member'}-->
  2. <form method="post" autocomplete="off" id="lsform" action="member.php?mod=logging&action=login&loginsubmit=yes&infloat=yes" onsubmit="return lsSubmit()">
  3. <div class="fastlg cl">
  4. <span id="return_ls" style="display:none"></span>
  5. <div class="y">
  6. <p><a href="member.php?mod=logging&action=login&viewlostpw" onclick="showWindow('login', this.href)" class="xi2">{lang getpassword}</a></p>
  7. <p><a href="member.php?mod={$_G[setting][regname]}" onclick="showWindow('register', this.href)" class="reglk xi2">$_G['setting']['reglinkname']</a></p>
  8. </div>
  9. <div class="fastlg_fm y pns">
  10. <p>
  11. <!--{if !$_G['setting']['autoidselect']}-->
  12. <span class="ftid">
  13. <select name="fastloginfield" id="ls_fastloginfield" width="45" tabindex="900">
  14. <option value="username">{lang username}</option>
  15. <option value="uid">{lang uid}</option>
  16. <option value="email">{lang email}</option>
  17. </select>
  18. </span>
  19. <script type="text/javascript">simulateSelect('ls_fastloginfield')</script>
  20. <input type="text" name="username" id="ls_username" autocomplete="off" class="px vm" tabindex="901" />
  21. <!--{else}-->
  22. <label for="ls_username">{lang account}</label> <input type="text" name="username" id="ls_username" class="px vm" {if $_G['setting']['autoidselect']} value="UID/{lang username}/Email" onfocus="if(this.value == 'UID/{lang username}/Email') this.value = '';" onblur="if(this.value == '') this.value = 'UID/{lang username}/Email';"{/if} tabindex="901" />
  23. <!--{/if}-->
  24. <input type="checkbox" name="cookietime" id="ls_cookietime" class="pc" value="2592000" tabindex="903" /> <label for="ls_cookietime">{lang save_password}</label>
  25. </p>
  26. <p>
  27. <label for="ls_password"{if !$_G['setting']['autoidselect']} class="z psw_w" /if}>{lang password}</label> <input type="password" name="password" id="ls_password" class="px vm" autocomplete="off" tabindex="902" onfocus="lsShowmore()" />
  28. <button type="submit" class="pn vm"><em>{lang login}</em></button>
  29. </p>
  30. <input type="hidden" name="quickforward" value="yes" />
  31. <input type="hidden" name="handlekey" value="ls" />
  32. </div>
  33. </div>
复制代码


删除之后将上面代码中下划线部分改为

  1. <div class="fastlg cl" style="width:670px;margin-top:44px;margin-left:240px;">
复制代码


三、您是否还沉溺在修改代码的欣喜之中?非常抱歉整个效果已经修改完成。

2010-10-19 19:26:12 上传下载附件 (22.97 KB)



另附:记住密码放到登录按钮前面的办法,把代码<input type="checkbox" name="cookietime" id="ls_cookietime" class="pc" value="2592000" tabindex="903" /> <label for="ls_cookietime">{lang save_password}</label>放到代码
<button type="submit" class="pn vm"><em>{lang login}</em></button>前面即可,2段代码中间可以加点间隔,加个

  评论这张
 
阅读(849)| 评论(1)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2018