Markdown Reader 插件改造
Markdown Reader 是一款比较好用的浏览markdown文件的chrome插件
插件地址:https://chrome.google.com/webstore/detail/markdown-reader/gpoigdifkoadgajcincpilkjmejcaanc
准备工作
- 从应用商店安装扩展
- 打开chrome插件管理(
chrome://extensions
)找到插件对应的ID - 从
%USERPROFILE%\AppData\Local\Google\Chrome\User Data\Default\Extensions
找到对应的目录 - 将插件主体复制出来,删除其中的
_metadata
目录 - 修改
manifest.json
文件,删除update_url
项,修改web_accessible_resources
项的内容为:[ "*.*" ]
- 选择chrome插件管理的
开发者模式
,并加载已解压的扩展程序...
- 勾选
允许访问文件网址
改造一 :链接新标签页(窗口)打开
修改 markdownreader.js
文件,在对应的样式加载代码后面,添加如下代码:
var baseTarget = document.createElement('base');
baseTarget.target = '_blank';
document.head.appendChild(baseTarget);
改造二 :添加 font awesome 图标支持
下载最新的 Font Awesome 源码包 ,解压缩后将文件放入工作目录。
修改 markdownreader.js
文件,在对应的样式加载代码后面,添加如下代码:
link = document.createElement('link');
link.rel = 'stylesheet';
link.href = chrome.extension.getURL('font-awesome-4.6.3/css/font-awesome.min.css');
document.head.appendChild(link);
改造三 :修改打印样式
修改 markdownreader.css
文件,在最后面,添加如下代码:
@media print {
body{width: 21cm;margin:0;padding:0;}
.content{
width: 88%;
background-color: #F8F8F8;
border:1px solid #ccc;
box-shadow:0 0 10px #999;
line-height:1.4em;
font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft Yahei", helvetica, arial, freesans, clean, sans-serif;
font-size:13.34px;
color:black;
}
#markdown-outline, #markdown-backTop, #markdown-outline ul, #markdown-outline ul:first-child, #markdown-outline li{
display: none;
padding: 0;
margin: 0;
width:0;
}
}
Markdown Reader 插件改造的更多相关文章
- JS检测浏览器Adobe Reader插件
Web应用中当我们希望向用户显示pdf文档时候,如果用户安装了Adobe Reader之类的pdf阅读器,就可以直接打开文档在浏览器中显示, 但是,当用户没有安装这类软件的时候,自然是打不开的,为了系 ...
- 异常强大的Markdown编辑插件-Markdown Preview Enhanced
最近使用Markdown写作,了解到以下这些Markdown写作工具 MaHua 在线markdown编辑器 百度搜索Markdown时,它排在非常靠前的位置 马克飞象- 专为印象笔记打造的Markd ...
- 苹果下如果安装nginx,给nginx安装markdown第三方插件
用brew install nginx 这样安装的是最新版的nginx, 但是在有些情况下,安装第三方插件需要特定的版本,更高一级的版本可能装不上. 它的原理是下载安装包进行自动安装,建立软链,这样就 ...
- markdown绘图插件----mermaid简介
作者:黄永刚 mermaid简介 当撰写文档的时候,对于流程图的生成大多使用Visio等繁重的工具,没有一种轻便的工具能够画图从而简化文档的编写,就像markdown那样. mermaid解决这个痛点 ...
- sublime text 3插件改造之添加从模版新增文件到指定目录
简介:以前使用ST2里面的Sublime NFFT插件比较顺手,最近安装了ST3,但是Sublime NFFT插件不支持ST3,就下载了SublimeTmpl从模版新建文件插件.在使用时,习惯在侧边栏 ...
- Windows Live Writer 代码插件改造
源码和插件都在后面,如果不想看我神神叨叨的可以直接到文章后面下载 一 .找插件 在使用Windows Live Writer 经常要用到插入代码的功能,根据博客园中教程,分别使用了: WindowsL ...
- 【转】Windows Live Writer 代码插件改造
源码和插件都在后面,如果不想看我神神叨叨的可以直接到文章后面下载 一 .找插件 在使用Windows Live Writer 经常要用到插入代码的功能,根据博客园中教程,分别使用了: WindowsL ...
- [软件]在浏览器里添加MarkDown Here(插件)
1. 先来说说这个插件的作用是什么: 用于在网页一些编辑文本的地方, 使用MacDown编辑文本 支持大部分浏览器, https://github.com/adam-p/markdown-here ...
- select2插件改造之设置自定义选项 源码
改造特性: 适应业务需要,选项里面包含“其他”其它”,可以点击填写并设置自定义选项 效果图: 具体代码不做阐述,如有类似需求,请私信.主要源码: /* Copyright 2012 Igor Vayn ...
随机推荐
- npm 安装包无法继续下载? 卡住
一般是由于package.json配置的项目名不对
- Java如何Attachment源码
该文章教你如何在Eclipse中Attachment源码,学到了不少东西. http://jingyan.baidu.com/article/1709ad80b107f64635c4f040.html ...
- vs升级c++项目遇到的一些问题
1.error C1189: #error : This file requires _WIN32_WINNT to be #defined at least to 0x0403. Value 0x ...
- Google架构学习
http://hideto.iteye.com/blog/130815 原文:Google Architecture Google是伸缩性的王者.Google一直的目标就是构建高性能高伸缩性的基础组织 ...
- Spring学习之事务注解@Transactional
今天学习spring中的事务注解,在学习Spring注解事务之前需要明白一些事务的基本概念: 事务:并发控制的单位,是用户定义的一个操作序列.这些操作要么都做,要么都不做,是一个不可分割的工作单位.通 ...
- D3.js 制作中国地图 .net 公共基础类
D3.js 制作中国地图 from: http://d3.decembercafe.org/pages/map/index.html GeoJSON is a format for encoding ...
- sublime 汇总
此文内容有原创,还有各种其他博客抄来的经验,技巧,纯属个人使用心得. http://www.cnblogs.com/figure9/p/sublime-text-complete-guide.html ...
- Laravel 5.4建站06--API 认证系统 Passport
介绍 在 Laravel 中,实现基于传统表单的登陆和授权已经非常简单,但是如何满足 API 场景下的授权需求呢?在 API 场景里通常通过令牌来实现用户授权,而非维护请求之间的 Session 状态 ...
- HDU 5145 NPY and girls (莫队分块离线)
题目地址:HDU 5145 莫队真的好奇妙.. 这种复杂度竟然仅仅有n*sqrt(n)... 裸的莫队分块,先离线.然后按左端点分块,按块数作为第一关键字排序.然后按r值作为第二关键字进行排序. 都是 ...
- 图像处理之滤波---滤波在游戏中的应用boxfilter
http://www.yxkfw.com/?p=7810 很有意思的全方位滤波应用 https://developer.nvidia.com/sites/default/files/akamai/ga ...