自作ツール&スクリプト

【MDWiki】2つのファイルの置くだけ!Markdown記法で書けるMDwikiの導入方法について

mdwiki-settings

たった2つのファイルの置くだけ!Markdown記法で書けるMDwikiの導入方法について

MDwikiとは

MarkDownテキストを書くだけで簡単にWiki化できるMDWikiを導入してみました。

参考
http://dynalon.github.io/mdwiki-examples/cafe/#!index.md

qiita.com

導入方法

  • まずはここからMDwikiをダウンロード

http://dynalon.github.io/mdwiki/#!download.md

GitHub での導入方法

  • GitHubのアカウントを取得して、アカウント名.github.io というリポジトリを作成

min0124.github.io
  • フォルダ内に index.mdindex.htmlをアップロード
  • URLをhttps://アカウント名.github.io/#!index.mdにしてアクセス

https://min0124.github.io/#!index.md

参考

【GitHubPages】GitHub.ioで自己紹介ページを作りました – Qiita

Drop Boxでの導入方法

2017年9月1日よりPublic フォルダもといHTML コンテンツのレンダリングが無効になり、Public フォルダとその共有機能も使用できなくなります。

Google Driveでの導入方法

追記:2016/8/31で機能が廃止されました。(Google Drive、静的URLによるWebホスティング機能を廃止)

http://dynalon.github.io/mdwiki/#!tutorials/drive.md

  1. データのダウンロード
    http://dynalon.github.io/mdwiki/#!download.md
  2. GoogleDriveにフォルダ(Wikiと命名)を作って、その中にダウンロードした「mdwiki.html」とテスト表示用のMarkDown「index.md」を入れる
  3. mdwiki.htmlの名前をindex.htmlに変更
  4. 「Wiki」フォルダを共有化する
    ※詳細設定でウェブ上で一般公開に(リンクを知っている全員でも可能ですが、パスが非常に長くなります)
  5. Wikiフォルダにアクセスして、URLをコピー https://drive.google.com/drive/folders/???????
  6. https://drive.google.com/drive/folders/の部分を www.googledrive.com/host/ に置き換えて、/#!index.mdをお尻に付け加えてアクセスする
  7. アクセスすると、そのWikiの表示が確認でき、またURLが確定します。https://?????-www.googledrive.com/host/?????/#!index.md

ローカルでアクセスする方法

ローカルファイルへのAjaxリクエスト許可するために以下を実行すること。

  1. Google Chormeのショートカットを作成し、リンク先に –allow-file-access-from-filesを追加する
    ※頭は半角スペースを入れること
  2. 立ち上げているGoogle Chormeをすべて閉じ、ショートカットからブラウザを立ち上げる
    ※初回起動時のみ機能が有効になる

    “`
    "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" –allow-file-access-from-files</li>
    </ol>

    <pre><code>3. あとはローカルファイルのパスを入力するだけ

    “`
    file:///D:/index.html#!index.md

    うまく表示されない時

    • まずChromeでchrome://version/とURLを入力してアクセス
    • コマンドラインの記述を確認
    "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --allow-file-access-from-files --flag-switches-begin --flag-switches-end
    

    " --allow-file-access-from-files
    

    の記述があればOK

    なければ拡張機能が邪魔をしている可能性があるので、一度全てOFFにして確認する

    Tips

    http://dynalon.github.io/mdwiki/#!quickstart.md

    カスタマイズ

    文字サイズ

    見出しを小さく、本文を大きくしました。

    .h2{font-size:30px}
    

    .h2{font-size:24px}
    
    font-size:14px;
    

    font-size:16px;
    

    日本語サイトに

    <meta http-equiv="content-language" content="ja">