Markdown Reader 插件改造


Markdown Reader 是一款比較好用的瀏覽markdown文件的chrome插件
插件地址:https://chrome.google.com/webstore/detail/markdown-reader/gpoigdifkoadgajcincpilkjmejcaanc

准備工作

  1. 從應用商店安裝擴展
  2. 打開chrome插件管理(chrome://extensions)找到插件對應的ID
  3. %USERPROFILE%\AppData\Local\Google\Chrome\User Data\Default\Extensions 找到對應的目錄
  4. 將插件主體復制出來,刪除其中的 _metadata 目錄
  5. 修改 manifest.json 文件,刪除 update_url 項,修改 web_accessible_resources 項的內容為: [ "*.*" ]
  6. 選擇chrome插件管理的 開發者模式 ,並 加載已解壓的擴展程序...
  7. 勾選 允許訪問文件網址

改造一 :鏈接新標簽頁(窗口)打開

修改 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;
	}
} 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM