【phpcms v9】新闻心情（系统自带文章点赞功能）

位置：【后台】-【模块】-【新闻心情】

本次只使用一个文章点赞效果，效果如下：

使用方法：

1、【后台】-【模块】-【新闻心情】--->心情配置 ，不需要的不用勾选，本次只填写一个，名称改成 “点赞” ，图片路径填写/mood/图片名 （上传图片的路径是 /statics/images/mood/图片名  ）提交保存，

2、修改新闻心情的模板文件

/phpcms/templates/default/mood/index.html 

原来的代码（大约第12行起）可以用，但是效果不好看
<ul>
{loop $setting $k $v}
<li><span>{$data[$v['fields']]}</span><div class="pillar{if isset($key) && $key==$k} pass{/if}" style="height:{$v[per]}px;"></div>{if $v[pic]}<img src="{IMG_PATH}{$v[pic]}">{/if}<br /><label for="n{$k}">{$v[name]}<br /><input type="radio" id="n{$k}" name="n" onclick="vote({$k})" {if isset($key) && $key==$k} checked{/if}></label></li>{/loop}
</ul>

可以修改成下面的代码及样式，点赞的img图片自己上传到步骤1中说的 /statics/images/mood/下

<ul id="likeit">
    {loop $setting $k $v}
    <li>
        <label for="n{$k}">
<i class="iconfont" id="n{$k}" name="n" onclick="vote({$k})" {if isset($key) && $key==$k} checked{/if}><img src="{IMG_PATH}{$v[pic]}">点赞({$data[$v['fields']]})</i>       
        </label>
    </li>
    {/loop}
</ul>


<style>
#likeit label{ display: table; height: 40px; line-height: 40px; margin: 0 auto;  background: #E2523A;color: #fff; box-shadow: 1px 2px 6px 0px rgba(0,0,0,0.2);border-radius: 3px; text-align: center; padding: 0 40px; }
#likeit label i{ display: block; font-style: normal;}
#likeit label i img{display: block; width: auto; height:22px; margin:8px 8px 0 0; float: left;}
</style>

3、前台文章模板内的调用，找到自己想要的位置就完成了。

 {if module_exists('mood')}<script type="text/javascript" src="{APP_PATH}index.php?m=mood&c=index&a=init&id={id_encode($catid,$id,$siteid)}"></script>{/if}

4、点赞过后数字会自动累计，这个功能就要保留模板文件下的js,以及注意 js里的 id="mood"，对应模板上面html中的<div id="mood">

5、文章点赞多次时会有弹窗提示，弹窗文字修改位置：phpcms\languages\zh-cn\mood.lang.php

例如