前阵子看到blinux的blog里,把已评论过的用户隐藏起用户名和电子邮件等框。虽然是细节,但看起来感觉就是不一样。谁会喜欢看到满眼的输入框呢!!
逞着今天有空,决定我也弄一下。 但是只是评论后隐藏好你没多大效果,对第一次评论的人还是很不友好的,所以决定打开Wordpress的匿名评论,只要在后台评论里去掉那个"评论时一定要邮箱和名字“的选项去掉就行了!
匿名是匿名了,但输入框还在,利用原来MG12的改善WordPress 访客评论时的用户体验一文的代码进行改进一下。
具体实现所的效果就如我blog的评论框一样!
先找到原来模板里的输入框代码!
<p><input type="text" name="author" id="author" value="<?php echo $comment_author; ?/>" size="22" tabindex="1" < ?php if ($req) echo "aria-required='true'"; ?> /> <label for="author"><small>Name < ?php if ($req) echo "(required)"; ?></small></label></p> <p><input type="text" name="email" id="email" value="<?php echo $comment_author_email; ?/>" size="22" tabindex="2" < ?php if ($req) echo "aria-required='true'"; ?> /> <label for="email"><small>Mail (will not be published) < ?php if ($req) echo "(required)"; ?></small></label></p> <p><input type="text" name="url" id="url" value="<?php echo $comment_author_url; ?/>" size="22" tabindex="3" /> <label for="url"><small>Website</small></label></p>
进行替换
<script type="text/javascript">function setStyleDisplay(id, status){document.getElementById(id).style.display = status;}</script><!-- 控制输入框的隐藏显示-->
<?php if ( $comment_author != "" ) : ?><!--已评论后的效果->
<div>
<?php printf(__('Welcome back <strong>%s</strong>.'), $comment_author) ?>
<span id="show_author_info"><a href="javascript:setStyleDisplay('author_info',''); setStyleDisplay('show_author_info','none');setStyleDisplay('hide_author_info','');"> 更改 »</a></span>
<span id="hide_author_info"><a href="javascript:setStyleDisplay('author_info','none'); setStyleDisplay('show_author_info','');setStyleDisplay('hide_author_info','none');"> 关闭 »</a></span>
</div>
<label>
<input name="anymous" type="checkbox" id="anymous" onclick="javascript: if(this.checked=='') {setStyleDisplay('author_info','');document.getElementById('author').value='<?php if ( $comment_author != '' ) {echo $comment_author;}else{echo '昵称';}?>';document.getElementById('email').value='<?php if ( $comment_author_email != '' ) {echo $comment_author_email;}else{echo '邮箱';}?>';document.getElementById('url').value='<?php if ( $comment_author_url != '' ) {echo $comment_author_url;}else{echo '网站';}?>';
} else {document.getElementById('author').value='';document.getElementById('email').value='';document.getElementById('url').value='';setStyleDisplay('author_info','none');}" />匿名(原来的记录会没掉!)
</label>
<? else: ?> <!--第一次评论的效果 -->
<label>
<input name="anymous" type="checkbox" id="anymous" checked="checked" onclick="javascript: if(this.checked=='') {setStyleDisplay('author_info','');document.getElementById('author').value='<?php if ( $comment_author != '' ) {echo $comment_author;}else{echo '昵称(必填)';}?>';document.getElementById('email').value='<?php if ( $comment_author_email != '' ) {echo $comment_author_email;}else{echo '邮箱(必填)';}?>';document.getElementById('url').value='<?php if ( $comment_author_url != '' ) {echo $comment_author_url;}else{echo '网站';}?>';
} else {document.getElementById('author').value='';document.getElementById('email').value='';document.getElementById('url').value='';setStyleDisplay('author_info','none');}" />匿名
</label>
<?php endif; ?>
<div id="author_info">
<div>
<input type="text" name="author" id="author" tabindex="1" onblur="if(this.value=='')this.value='昵称(必填)';this.style.color='#555';" onfocus="this.style.color='#000';if(this.value=='昵称(必 填)')this.value='';" />
</div>
<div>
<input type="text" name="email" id="email" tabindex="2" onblur="if(this.value=='')this.value='邮箱(必填)';this.style.color='#555';" onfocus="this.style.color='#000';if(this.value=='邮箱(必 填)')this.value='';" />
</div>
<div>
<input type="text" name="url" id="url" tabindex="3" onblur="if(this.value=='')this.value='网站';this.style.color='#555';" onfocus="this.style.color='#000';if(this.value=='网站')this.value='';" />
</div>
</div>
<script type="text/javascript"><!-- 检测及设定加载时是否匿名或已评论 -->
if(document.getElementById('anymous').checked==''){setStyleDisplay('author_info','');}else{setStyleDisplay('author_info','none');}
<?php if ( $comment_author != "" ) : ?>setStyleDisplay('hide_author_info','none');setStyleDisplay('author_info','none');<?php endif; ?>
</script>
很棒,但是如何让边栏的匿名评论显示IP的呢?
test匿名
博主有没发现MG12的改进是有动画效果的,就是下拉和收缩的动画~~
。。。没看到耶,其实我觉得这种东西还是不用动画的好
很不错
试试看,谢谢
呵呵,很不错啊,看看。
呵呵 不错
谢谢代码