“最难不过坚持”
本人承接扒站仿站,php网站维护,病毒查杀,网站编辑,网站改版,html制作
有需要网站维护,改版,病毒查杀,网站编辑,网站备案,html制作等相关的工作可以联系我。
本人有多年相关工作经验,也可提供免费咨询,交个朋友。
有需要探讨问题的朋友,也可以加我微信,共同探讨!
微信:15011482830 QQ:408917339
- https://jueru.net/
-
- :weixiao:
-
- :shuijiao: :weiqu: :zhenbang: :leng:
-
- :yiwen: :yiwen: :yiwen: :yiwen:
-
- 这个业务逻辑多少都有点奇怪了,阅读浏览次数增值在新闻详情页的控制器方法里setInc,这怎么还写进模型事件里了。如果非要用onAfterRead也可以,把新闻文章的内容单独分出来一个news_content表,然后把它和news做关联,然后给news_content表的onAfterRead事件做增值处理,这样点进新闻页内查询到文章内容时才会触发它。
-
blockquote标签应该对于很多人来说是一个很常用的功能,用起来也是比较方便的。废话不多说了,下面开始改造之旅。
kindeditor添加自定义插件,添加“blockquote”插件
1、添加plugins/bockquote/bockquote.js文件。
代码如下
KindEditor.plugin('bockquote', function(K) { var self = this, name = 'bockquote'; self.clickToolbar(name, function() { var lang = self.lang(name + '.'), html = ['<div style="padding:10px 20px;">', '<textarea class="ke-textarea" style="width:408px;height:260px;"></textarea>', '</div>'].join(''), dialog = self.createDialog({ name : name, width : 450, title : self.lang(name), body : html, yesBtn : { name : self.lang('yes'), click : function(e) { var type = textarea.val(); html = '<blockquote>' + K.escape(type) + '</blockquote>'; self.insertHtml(html).hideDialog().focus(); } } }), textarea = K('textarea', dialog.div); textarea[0].focus(); }); });2、定义语言,修改lang/zh_CN.js文件。添加以下代码。
bockquote:'插入引用',
3、修改themes/default/default.png图片和default.css文件
这个图片我已经修改好了,会的人可以自己用photoshop修改,是图片的最后一个图标。
default.css文件添加如下代码
代码如下
.ke-icon-bockquote { background-position: 0px -1248px; width: 16px; height: 16px; }4、添加调用编辑器时items数组里添加bockquote插件
代码如下
items : ['bockquote']
5,最后的效果图如下
6,前端页面引用标签的css举例如下:
blockquote{ font: 14px/22px normal helvetica, sans-serif; margin-top: 10px; margin-bottom: 10px; margin-left: 0px; padding-left: 15px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; border-left: 3px solid #ccc; background-color:#f1f1f1 }效果:
这里是引用标签效果
这里是引用标签效果
20190109
使用的过程中,想到如果能选择引用框的样式比较好,所以就改了下,实现了这个功能,(稍微改了下code/code.js代码,借用过来)
1,改之后的plugins/bockquote/bockquote.js文件代码
KindEditor.plugin('bockquote', function(K) { var self = this, name = 'bockquote'; self.clickToolbar(name, function() { var lang = self.lang(name + '.'), html = ['<div style="padding:10px 20px;">', '<div class="ke-dialog-row">', '<select class="ke-code-type">', '<option value="blue">蓝色</option>', '<option value="red">红色</option>', '</select>', '</div>', '<textarea class="ke-textarea" style="width:408px;height:260px;"></textarea>', '</div>'].join(''), dialog = self.createDialog({ name : name, width : 450, title : self.lang(name), body : html, yesBtn : { name : self.lang('yes'), click : function(e) { var type = K('.ke-code-type', dialog.div).val(), code = textarea.val(), cls = type === '' ? '' : type, html = '<blockquote class="' + cls + '">\n' + K.escape(code) + '</blockquote> '; if (K.trim(code) === '') { alert(lang.pleaseInput); textarea[0].focus(); return; } self.insertHtml(html).hideDialog().focus(); } } }), textarea = K('textarea', dialog.div); textarea[0].focus(); }); });
2,改之后前台css样式
blockquote,blockquote.blue{ font: 14px/22px normal helvetica, sans-serif; margin-top: 10px; margin-bottom: 10px; margin-left: 0px; padding-left: 15px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; border-left: 3px solid #5bc0de; background-color:#f4f8fa; color:#27b0d9; } blockquote.red{ font: 14px/22px normal helvetica, sans-serif; margin-top: 10px; margin-bottom: 10px; margin-left: 0px; padding-left: 15px; padding-top: 10px; padding-right: 10px; padding-bottom: 10px; border-left: 3px solid #d9534f; background-color:#fdf7f7; color:#d9534f; }3,改之后效果
这里是蓝色样式效果
这里是蓝色样式效果
这里是红色样式效果
这里是红色样式效果
20190327
在使用引用功能时,前台不能识别回车换行,导致文字都堆到一行去了。
本来想修改23行
code = textarea.val(),
为
code = textarea.val().replace('\n','<br/>'),
把\n替换成<br/>,但是发现不行。
所以就修改了25行
html = '<blockquote class="' + cls + '">\n' + K.escape(code) + '</blockquote> ';
为
html = '<blockquote class="' + cls + '"><pre>\n' + K.escape(code) + '</pre></blockquote> ';
在blockquote标签中加上pre标签,成功解决问题