Z-BlogPHP主题制作教程#15:评论框commentpost.php

评论框(commentpost.php)是浏览者发表评论的地方,他主要由多个输入框和“提交”按钮组成。Z-BlogPHP标准的输入框由评论者名称、邮箱地址、网址、评论正文和验证码(可开启/关闭)组成。

按照这样的图片,我们先把看到形状做成html:

<div>
<form id=”frmSumbit” target=”_self” method=”post” action=”{$article.CommentPostUrl}” >
<input type=”hidden” name=”inpId” id=”inpId” value=”{$article.ID}” />
<input type=”hidden” name=”inpRevID” id=”inpRevID” value=”0″ />
<!– 上两行为Z-BlogPHP必须 –>

<p><label for=”inpName”>评论者(*)</label>
<input type=”text” name=”inpName” id=”inpName” value=”{$user.Name}” /></p>
<p><label for=”inpEmail”>E-mail(*)</label>
<input type=”text” name=”inpEmail” id=”inpEmail” value=”{$user.Email}” /></p>
<p><label for=”inpHomePage”>博客地址</label>
<input type=”text” name=”inpHomePage” id=”inpHomePage” value=”{$user.HomePage}” /></p>

<p><label for=”txaArticle”>文章评论(*)</label>
<textarea name=”txaArticle” id=”txaArticle”></textarea></p>
<p>
<input name=”sumbit” type=”submit” value=”发表评论” οnclick=”return VerifyMessage()” />
</p>

</form>
</div>
这是最基础的代码,大家可以自行在各项里面增加class元素。最上面的两个<input>为Z-BlogPHP主题评论框必须,依次就是图上所示的结构。之前我们说了,有一个验证码我们没有体现出来,为了完善,我们可以在适当的地方加入这个模块。又因为它的可选择性的,所以我们给它一个if。

{if $option[‘ZC_COMMENT_VERIFY_ENABLE’]}
<p>
<label for=”inpVerify”>验证码(*)</label>
<input type=”text” name=”inpVerify” id=”inpVerify” class=”text” value=”” />
<img style=”width:{$option[‘ZC_VERIFYCODE_WIDTH’]}px;height:{$option[‘ZC_VERIFYCODE_HEIGHT’]}px;cursor:pointer;” src=”{$article.ValidCodeUrl}” alt=”” title=”” οnclick=”javascript:this.src='{$article.ValidCodeUrl}&amp;tm=’+Math.random();”/>
</p>
{/if}
有时候,了方便登录者评论,避免那些重复的输入,我们可以增加一个if判断:“当你是网站的用户时,则不需要输入了,直接评论即可。”

{if $user.ID>0}
<input type=”hidden” name=”inpName” id=”inpName” value=”{$user.Name}” />
<input type=”hidden” name=”inpEmail” id=”inpEmail” value=”{$user.Email}” />
<input type=”hidden” name=”inpHomePage” id=”inpHomePage” value=”{$user.HomePage}” />
{else}
……
{/if}
看明白了上面的三段代码,我们就可以开始糅合了。将这三段通过简单的逻辑拼合起来,再加上点修饰,就完成了最终的Z-BlogPHP评论框的模版。

<div>
<form id=”frmSumbit” target=”_self” method=”post” action=”{$article.CommentPostUrl}” >
<input type=”hidden” name=”inpId” id=”inpId” value=”{$article.ID}” />
<input type=”hidden” name=”inpRevID” id=”inpRevID” value=”0″ />
<!– 上两行为Z-BlogPHP必须 –>
{if $user.ID>0}
<input type=”hidden” name=”inpName” id=”inpName” value=”{$user.Name}” />
<input type=”hidden” name=”inpEmail” id=”inpEmail” value=”{$user.Email}” />
<input type=”hidden” name=”inpHomePage” id=”inpHomePage” value=”{$user.HomePage}” />
{else}
<p><label for=”inpName”>评论者(*)</label>
<input type=”text” name=”inpName” id=”inpName” value=”{$user.Name}” /></p>
<p><label for=”inpEmail”>E-mail(*)</label>
<input type=”text” name=”inpEmail” id=”inpEmail” value=”{$user.Email}” /></p>
<p><label for=”inpHomePage”>博客地址</label>
<input type=”text” name=”inpHomePage” id=”inpHomePage” value=”{$user.HomePage}” /></p>

<p><label for=”txaArticle”>文章评论(*)</label>
<textarea name=”txaArticle” id=”txaArticle”></textarea></p>

{if $option[‘ZC_COMMENT_VERIFY_ENABLE’]}
<p>
<label for=”inpVerify”>验证码(*)</label>
<input type=”text” name=”inpVerify” id=”inpVerify” class=”text” value=”” />
<img style=”width:{$option[‘ZC_VERIFYCODE_WIDTH’]}px;height:{$option[‘ZC_VERIFYCODE_HEIGHT’]}px;cursor:pointer;” src=”{$article.ValidCodeUrl}” alt=”” title=”” οnclick=”javascript:this.src='{$article.ValidCodeUrl}&amp;tm=’+Math.random();”/>
</p>
{/if}

{/if}
<p>
<input name=”sumbit” type=”submit” value=”发表评论” οnclick=”return VerifyMessage()” />
</p>

</form>
</div>