评论组件畅言主题样式修改

随着多说、网易云跟帖的停止服务，要找一个合适的博客评论系统还真不容易，目前稍微好点的可能就畅言和友言了，实话说这两个的体验真不是很满意，所以就有了这篇文章，看看能不能想办法去自定义样式。

畅言官方提供了一些样式定制 http://changyan.sohu.com/help/a-custom-css-setting.html 不是太好改，整体上还是感觉不好，特别是侧边栏天天弹广告。

在浏览畅言官网的时候发现官网用的评论框和我们的不太一样，官网的效果明显更清新简洁 , 但是后台并没有提供配置这个主题的方法啊！！

# 官网样式:

# 目前样式:

经过一番分析发现初始化的 JS 代码是一样的，但是加载的样式结构和代码都完全不一样

# 官网结构:

# 目前结构:

经过分析，一个获取配置的接口引起了我的注意:

https://changyan.sohu.com/api/2/config/get/cyqARl5Jo?callback=changyan523657214

返回的内容如下：

changyan523657214({"data":{"isv":{"id":"889","auditMode":"1","isvLogoUrl":"http://0d077ef9e74d8.cdn.sohucs.com/d92768c2d35701f36e2a0853e6773dc2_1463120884232_cyqARl5Jo","status":"1","name":"畅言博客","url":"http://changyan.kuaizhan.com/static/help/"},"main":{"mobile_login_external_platform":"2,3,13,15","domain_whitelist":"itc.cn,kuaizhan.com,sohu.com","extensions":"extensions","comment_url_regular_to":"","code_version":"v4","topic_day_limit":"0","mobile_ad_ico":"false","sso_loginstyle_open_only":"false","mobile_allow_upload_img":"0","mobile_code_version":"v3","copyright":"0","audit_type_before_closed":"0","comment_url_regular":"0","mobile_trigger_animate_face":"undefined","user_portrait":"0","title_pattern":"","custom_css_type":"11","comment_remind_mail":"","allow_show_level":"1","language":"Chinese","cyan_title":"评论","origin_cmt_person_num":"1","comment_page_num":"30","forum_redirect_layer":"2","comment_share":"{user_comment} -- 评论{page_title} {short_link}","simple_cbox":"0","wap_collection_open":"false","flood_num":"1","cyan_skin":"0","comment_less_show":"暂无评论","style_list_width_value":"0","mobile_extensions_key":"wap-prop","comment_operation_ding":"顶","myusq":"true","comment_operation":"2","custom_css_url":"http://changyan.sohu.com/static/css/2014-11-04/889/1c839083-f47d-452a-9dd7-4d7be7593e75.css","comment_url_parameter":"qq-pf-to","style_list_width":"0","mobile_hot_news_topic":"false","hot_topic_mode":"text","mobile_allow_barrage":"undefined","isv_scale":"mini","comment_user_emoji_wap":"0","union_num":"1","comment_recom_image":"0","auto_sourceid":"false","force_promotion":"0","comment_operation_cai":"踩","login_external_platform":"2,3,13","comment_allow_share":"1","sso":"false","comment_allow_like":"1","origin_cmt_num":"1","show_participation":"true","mobile_latest_page_num":"30","weibo_since_id":"3684790672395888","disable_user_photo":"false","sso_type":"2","trigger_animate_face":"true","footer_fix_cbox_width":"1000","cmt_total":"1","v3_hack":"true","order_by":"time_desc","mobile_float_bar":"false","mobile_isv_type":"beta","mobile_use_default_accesstoken":"false","allow_phoneuser":"1","comment_url_regular_from":"","allow_upload_img":"0","pc_float_style":"null","isv_type":"stable","comment_notice":"有疑问加群:410131466，欢迎测试","extensions_key":"prop-v3.2","hot_topic_wicket":"0","comment_remind_type":"never","mobile_hot_page_num":"5","hot_topic_list":"1","anonymous_comment_support":"1","is_iframe":"true","portrait_types":"1,2,3","comment_reply_show":"2","quality_exchange":"false","is_new_cdn":"false","footer_fix_cbox":"1","scs_iframe":"1","user_portrait_url":"http://assets.changyan.sohu.com/upload/asset/scs/images/pic/pic42_null.gif","plan_a":"false","use_user_level":"true","hot_topic_position":"off","latest_page_num":"30","pc_collection_open":"false","comment_user_emoji":"0","hot_page_num":"5","gold_coin_cbox":"0","display_location":"1","indent_style":"false","only_app":"false","allow_unlogin":"0","forum_redirect_open":"0"}}});

对比下两个版本，发现有个code_version字段是不一样的，官网返回的是v4，正常使用返回的v3,原来官网已经用上了新版本

想尝鲜的话怎么办呢？很简单啊，把服务器返回的code_version 改成 v4就好了。我做了一个配置的版本，只要替换一个 JS 文件就可以达到上面的目的了。

<script charset="utf-8" type="text/javascript" src="http://tools.apkfuns.com/changyan/changyan.js"></script>  
    <script type="text/javascript">
        window.changyan.api.config({
            appid: '####',
            conf: '####'
        });
    </script>

把官方提供的 js 从https://changyan.sohu.com/upload/changyan.js 改成 http://tools.apkfuns.com/changyan/changyan.js 就好了。

V4版本变化还是挺大的，首先去掉了右下角的各种弹窗，评论的样式也更好看了。
想换又不想折腾的同学可以再观望下，我想官方应该不久后就会发布 V4版本了。

WordPress插件修改

修改插件的Handler.php文件, 将所有https://changyan.sohu.com/upload/changyan.js改成http://tools.apkfuns.com/changyan/changyan.js

如果这是第一次使用插件是没有问题的，因为插件把注入的js写入到数据库里面了。

在wp_options表里面有个changyan_script字段，把里面的https://changyan.sohu.com/upload/changyan.js 改成 http://tools.apkfuns.com/changyan/changyan.js 刷新页面就能看到效果了

<div id="SOHUCS" sid=""></div>  
<script charset="utf-8" type="text/javascript" src="http://tools.apkfuns.com/changyan/changyan.js" ></script>  
<script type="text/javascript">  
    window.changyan.api.config({
    appid: 'xxx',
    conf: 'xxxx'
    });
</script>

舞影凌风

评论组件畅言主题样式修改

WordPress插件修改

重温那些不常用的运算符

华为 P9/P9 Plus 获取root权限