wordpress自带一个书签工具,Press This,能很方便的截取网页文字,发布为web clip。但其实不很完善。
Press This 只能从原网页截取文字,所有的格式全部会丢失,比如本来是个列表,现在就只剩了文字。虽然会弹出编辑框,但还是麻烦点。
所以稍微修改一下这个书签工具,使得能保留html标签。当然一些比如javascript的标签还是会删除,同时删除id,class和类似onclick之类的属性。效果图
代码
javascript:if(!window.location.origin){window.location.origin=window.location.protocol+'//'+window.location.hostname+(window.location.port?':'+window.location.port:'');}function getSelectionHtml(){var html='';if(typeof window.getSelection != 'undefined'){var sel=window.getSelection();if(sel.rangeCount){var container=document.createElement('div');for(var i=0,len=sel.rangeCount;i<len;++i){container.appendChild(sel.getRangeAt(i).cloneContents());}html=container.innerHTML;}}else if(typeof document.selection != 'undefined'){if(document.selection.type == 'Text'){html=document.selection.createRange().htmlText;}}function removeAttr(str){var s=['id','class','onclick','onload','onsubmit','onmouseout','onmouseover','onmousedown','onmouseup','jsaction'];for(var i=0;i<s.length;i++){str=str.replace(new RegExp('<([^>]* +)?'+s[i]+' *= *((%22[^%22]*%22)|(\'[^\']*\'))?( +[^>]*)?>','gi'),'<$1$5>');}return str;}return html?'Web Clip</p><div>'+removeAttr(html.replace(/<\/?(span|style|script|input|select|option|textarea)( +[^>]*)?>/gi,function (match,p1){var index={'span':'','style':'','script':'','input':'','select':'','option':'','textarea':''};return index[p1] != undefined?index[p1]:p1;})).replace(/<([^>]* +)?(href|src) *= *(%22|\')\//gi,'<$1$2=$3'+window.location.origin+'/').replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>').replace(/[\r\n]+/g,'')+'</div><p style=\'padding-top:1em;margin-top:1em;border-top:1px solid #ccc;\'>Origin:\r':'';};var d=document,w=window,s=getSelectionHtml(),f='修改为自己的wordpress域名/wp-admin/press-this.php',l=d.location,e=encodeURIComponent,u=f+'?u='+e(l.href)+'&t='+e(d.title)+'&s='+e(s)+'&v=4';a=function(){if(!w.open(u,'t','toolbar=0,resizable=1,scrollbars=1,status=1,width=720,height=570'))l.href=u;};if (/Firefox/.test(navigator.userAgent)) setTimeout(a, 0); else a();void(0)
有些缺点,因为wordpress会自动在最前和最后添加<p>
,所以只好在头尾添加一行文字,好在用来标注『截取』和『来源』也算合适。
另外wordpress只接受GET方式,所以截取内容太长就会出问题了。nginx下不能超过64KB。当然可以进一步改造成post方法,然后服务器上新建一个php,把post的数据改成get,再传给wordpress去处理。不过就不在我的考虑范围了。
同时如果来源网页中使用的是全局相对路径,会补完地址,但其他的相对路径还是需要人肉检查。
声明
需要特别提醒注意版权问题,请不要未经原作者许可摘抄分享,更不要去掉原文链接。全文摘录也是不提倡的,毕竟做笔记不是简单的抄录。
因为保留了html格式,所以原文中的图片等内容也会保留,如果原作者不允许分享,请手动删除。即使原作者许可,也希望手动保存原图片再上传到自己的服务器,避免盗链。