Dropboxにアップロードした画像をHTML、Markdownに埋め込む方法

Dropbox

DropboxのPublicフォルダが使えなくても、個別にURLを発行することはできるので、それを活用して、画像をブログ等に埋め込めます。

まずDropboxフォルダへ

• まずパソコンのDropboxフォルダにコピーする
• もちろんブラウザでログインしてアップロードしてもOK

画像のURLを発行する

• 埋め込みたい画像のファイルを右クリックする。
• 「共有」をクリック。(Dropboxアイコンがついているほうの「共有」)

• リンクを作成
• リンクをコピー

URLを一部置換する

• 取得したリンクURLの一部を変更する。www.dropbox.comの部分を、dl.dropboxusercontent.com に置き換える。
• そのURLを使用すれば、画像をページに埋め込むことができる。

HTML

<img src="https://dl.dropboxusercontent.com/△△△/□□□/hogehoge.jpg?dl=0" width="400">

Markdown

![](https://dl.dropboxusercontent.com/△△△/□□□/hogehoge.jpg?dl=0)

Gyazoのようにスクリーンショットをすぐ反映するのも可能

• Dropboxアプリが入った状態でPrintScreen(PrtSc)ボタンを押すと、スクリーンショットの自動保存を有効にするかどうか尋ねられるので有効にする。
• するとDropbox内に新たに「スクリーンショット」というフォルダが作成され、そのなかにスクリーンショットが保存されるようになる。
• それを上記の手順でページに埋め込むことも可能。

wri.peを中心とした、平常時も便利、非常時にも安心な情報管理フロー

現在の私の情報管理フローをご紹介。32ビットのWindowsでも使える軽量なフリーソフトや無料サービスばかりで構築。

情報を引っ越したいときにも手間がかからず、さらにネットが使えなくなった時でも情報にアクセスできることも目指している。

フリーソフトや無料サービスの名前は、それぞれのウェブサイトへのリンクになっています。

基本

wri.peにMarkdownで書き込んで、閲覧はwri.peかEvernoteで行う。wri.peもMarkdownプレビューが右に表示されるので読みやすいレイアウトで読める。

wri.peにたくさん書き込んでも、画像などはほぼすべて外部リンクにするので、Evernoteの月間無料容量60MBを超えることはなさそう。

情報の入口

思いついたり、聞いたり、気づいたり、調べたりした情報をまず・・・

• Simplenoteへ
  • そこからiPad appのtextwellでwri.peへ
  • もしくは日記などは、iPad appのWorkflowでいったんDropboxの特定のファイルに追記して1ヶ月分たまったらwri.peへコピペ。
• もしくは、アウトライナーのWorkflowyへ
  • エクスポート(Plain Text)だとMarkdownのリスト書式なのでそれをwri.peにコピペ
• もしくは、Metamoji Noteへ
  • 画像化して、画像としてwri.peで管理する。画像の管理の仕方は下記参照。
• もしくは、紙に書いて撮影
  • 画像として管理することができるし、ノート1冊書いてDropboxアプリのスキャン機能で全ページを読み取り1つのPDFにすることも可能。（PDFの管理の仕方は下記参照）

画像の管理

• wri.peはMarkdown記法が使えるので、![](画像の置いてあるURL)という1行を書き込むだけでそのページに画像を表示できる。
  • 画像の表示サイズを指定したいときは<img src="画像の置いてあるURL" width="400">という感じでそこだけhtmlで書けば良い。その1行は単語登録しておいてすぐ呼び出せるようにする。
• Gyazoに上げて、wri.peのページに埋め込む（速い）
• Gyazoに上げたくない画像や削除するかもしれない画像はDropboxに置いて、公開URLを発行する
  • Dropboxに上げた画像を表示に埋め込みたい場合は、URLを一部置換する。www.dropbox.comの部分を、https://dl.dropboxusercontent.comに変更する。そうすると埋め込める。 参考ページ:https://blanche-toile.com/web/website-dropbox
  • リンクをクリックして見たいだけであれば、そのままのURLでよい

Dropboxにアップロードした画像をHTML、Markdownに埋め込む方法

PDFの管理

• Dropboxに置く
  • Dropbox上で公開URLを発行する。
  • そしてwri.peのノートに[表示名](リンク先URL)と記述。そうすればそこをクリックすれば目的のPDFファイルを表示できる。
• DropboxがもしいっぱいになったらGoogle Driveでもよさそう

全体をバックアップしてローカルで閲覧する方法

• wri.peで”Export”から、すべてのファイルをダウンロードをたまにやる
  • txtファイルとしてノートをダウンロードできる。
  • ノートの題名も含めてエクスポートしてくれるので便利。
• Nameryでファイルの拡張子をmdにリネーム
• 探三郎でフォルダ内全文検索
• mdファイルのデフォルトをMdcharmにしておくと非常にスムーズに見ることができる
• 複数の、もしくはすべてのmdファイルを結合してしまうと、さらに見たり検索しやすくなったりするかも。mdファイルはテキストだけなので、たくさん結合しても軽い。（やり方は下記参照）
• これで最悪wri.peやEvernoteのサービスが終わっても、特定のアプリに依存せずオフラインのローカルでも見れる。32ビットのWindowsで使えるフリーソフトばかりで。

複数の同じ拡張子のファイルを結合する方法

コマンドプロンプトでこのように打ち込むとできる。

cd c:\test
type *.md > c:\test\alldata.md

参考ページ:https://rakuzanet.jp/tsv-csv-txt-combine.html

ウェブクリップ

ウェブクリップはブラウザの拡張機能を使用して、直接Evernoteに流し込む形でおこなう。

他の人に情報を渡したい時

wri.peに書いてEvernoteに保存されたページの公開URLをコピーして渡す。これだと、wri.peで更新すれば常に反映されるので便利。

ブログに上げたい

wri.peはMarkdownで記述しているので、WordPressにJP Markdownプラグインを入れておけば、ただコピペするだけでもう記事がアップできる。

印刷したい

• オンラインならMD2PDFで、ローカルならTyporaでPDFに変換して印刷する。
• もしくは、Evernoteクライアントアプリで印刷する（最近はそちらもいったんPDF変換しているようだ）

もう見ないかもしれない情報置場

もう見ないかもしれないけれども、自分の血肉にするために書く、といった情報を書くときは、Scrapboxを活用。DraftPadからWorkflowを使ってiPadからも書き込める。

Scrapboxはエクスポートが弱そうなので、引っ越したくなった時のことを考えるとメインでは使えないかなと。

wri.peのすごさがわかってきた

Markdownメモアプリを求めて

wri.pe

Markdownメモアプリを求めていろいろさまよってみたら、以前から使っていたwri.peが、地味に見えてものすごい良いアプリなのだということを知った。

条件は、

• Markdownが書けて、プレビュー機能もそこそこよい。
• どのデバイスでも使える
• 画像もURLで表示できる
• 目的のノートを見つけやすい
• 一括ダウンロードができてすぐ引っ越しできる。
• 動きが遅かったりおかしな動きをしたりしない。
• 全文検索ができる
• バックアップが面倒でない

それぞれの要件をwri.peがどう満たしているか見てみよう。

Markdownが書けて、プレビュー機能もそこそこよい。

書いたらすぐにプレビューにちゃんと反映される。字がちょっと小さいが。画像も出るし、表組みもちゃんと出る。

どのデバイスでも使える

ブラウザが使えればどのデバイスでも使える（私の知る限り）。パソコンでもiPadでも。ほんとうはiPadのクライアントアプリがあってくれたらと思うがそれはぜいたくというものかな。

画像もURLで表示できる

画像が表示できるのはいい。もし画像の大きさを指定したければ、画像のところだけ<img />タグを使用して、width="400"などとすればよい。

目的のノートを見つけやすい

Searchボタンを押すと全文検索ができるし、さらに、Evernoteに自動同期できるので、Evernoteのほうでタグをつけておいたりすれば、大量のノートになっても、目的のノートを見つけやすくなる。

一括ダウンロードができてすぐ引っ越しできる

右上のメニューからExportを選び、Download zipped notes を選択するとローカルに、それぞれのノートがtxtファイルでダウンロードされる。すばらしい。これってなかなかないんじゃないか。

高機能すぎて動きが遅かったりおかしな動きをしたりしない。

機能がシンプルなので、変な動きをしない。おかしな動きをしたり固まったりすることはない。

Evernoteから全文検索ができる

• wri.peのSearchボタンを押しても全文検索ができる。だが、wri.peの全文検索の精度はいまいちなので、Evernoteのほうで全文検索したほうが早そう。

バックアップが面倒でない

なんといっても、保存したそばからEvernoteに同期されていく。あとは、ときどき、Download zipped notes をすればさらに完璧。

このようにwri.peはすごいのだ。これからも使っていこう。寄付したいくらい。寄付できるのかな。

Boostnoteとか、mimemoとか、hackMDとか試してみたんだけど、それぞれに良さはあるものの、いや、やっぱり今の所wri.pe最強なんじゃないかと思った。

wri.peの紹介

ちなみに今見られるバグ？(2018-03-29現在)

以下の通り、使っていてあれ？と思う程度で、大した影響は感じない範囲の不都合しかないのだ。

• ノートが消せない?SettingsにDelete this noteあるんだけど、押してもうまくいかない。
• Dropbox バックアップも、問題発生してしまってそこまでたどりつかない。
• 全文検索がいまいちうまくいかない。
• これはEvernote for Windowsのクライアントアプリの問題だと思うが、表組みが含まれるノートが表示されない。印刷プレビューはできるし、Web版で見るとちゃんと表示されるのだが。Markdownのテーブル（表）を含むノートがEvernoteのWindowsクライアントに表示されない問題は、Evernoteのアップデートリリースをインストールしたら直りました。やはりEvernote側の問題だったようです。

「ファイル名を指定して実行」からよく使うアプリを起動する

マウスを使わずに、よく使うプログラムを起動できます。

やりかた

マイPATHフォルダを作成する

• (例) C:\Command_tarou

sysdm.cpl を起動してマイPATHフォルダを登録する

• ファイル名を指定して実行に”sysdm.cpl”を入力して実行
• 「詳細設定」-「環境変数」-「PATH 編集」-「新規」
• ここにさきほど作成したフォルダを登録。フォルダ名の最後に￥マークがくるように。

マイPATHフォルダの中に実行ファイルを作る

• （起動コマンドとして使いたい名称).bat
• または、(起動コマンドとして使いたい名称).cmd
• 以上のどちらかのファイル名でファイルを作成する。

実行ファイルの中身を書く

• (例) “C:\Program Files\Simplenote\Simplenote.exe”
• 注意点として、Program Filesフォルダの中身のプログラムを起動する場合は、パス全体を”（ダブルクォーテーション)で囲むこと。”Program Files”の文字列の中に半角スペースがあるので。

実行のしかた

• 「ファイル名を指定して実行」のボックスを出す。
  • 「Windows」キー＋「R」キー
• 自分が作ったコマンドを打ち込んで実行
  • batやcmdなどの拡張子は打ち込まない
• これで目的のプログラムが起動すればOK

参考ページ

https://dstn.appresso.com/hc/ja/articles/115004928394–%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E5%90%8D%E3%82%92%E6%8C%87%E5%AE%9A%E3%81%97%E3%81%A6%E5%AE%9F%E8%A1%8C-%E3%81%8B%E3%82%89%E8%B5%B7%E5%8B%95%E3%81%99%E3%82%8B

Simplenote のいいところ

Simplenote 4.6.1
分類: Productivity
価格: ¥0 (Automattic)

Simplenoteは、シンプルだが高機能なオンラインメモアプリ。

なんといっても動作が軽い。余分な機能がついていなくて、動作が不安定になったり読み込みに時間がかかったりということを見たことがない。確実に同期される信頼感がある。

自分のWindowsパソコンで使うなら、毎回ブラウザを立ち上げたりログインしなくとも、いいクライアントアプリがある。公式アプリや、ResophNotesで書けば、自分のモバイルにすぐ同期される。

iPhone,iPadでも動作が軽い。そしてしあがったメモは、「送信」でいろいろなアプリにテキストを送れる。

借りたパソコンからもブラウザでログインすれば、テキストを打てて、自分のモバイルにすぐ同期される。

バックアップもすぐできる。ZIP形式でダウンロードして解凍すると、それぞれのノートが個別のtxtファイルにエクスポートされている。

2018-10-30追記、MarkdownのURLを使った画像埋め込み機能や、Markdownの表作成機能も、どうやら搭載されたようだ。これで本当に最強のノートアプリになったかもしれない。

Markdownプレビュー機能を使って閲覧モードにできる

• ノートごとにMarkdownのON/OFFができる。ONにするとプレビュー機能が使える。プレビュー時は編集できないので、誤って画面に触れて編集モードになってしまってキーボードが表示されてしまったりすることを避けたい時に使える。
• ただ、純粋なMarkdownプレビュー機能としてはいまいち。見出しのすぐ下にリストが来ると表示が乱れる、水平線が薄くて見えないなど。
• 使うかわからないが、htmlのコメントアウトもプレビューに反映され、囲われた部分は隠せる。

わたしの活用法

• 最強のドラフトエディタとして、かつ閲覧モード付きエディタとして、使っている。
• パソコンで書いていて、iPadに入っている情報を加えたくなったとき、同じノートをiPadのSimplenote アプリで編集する。すぐ同期されるのでスムーズ。
• いきなりEvernoteなどの最終保管場所に書かずにSimplenoteにまず書く。起動を待つ時間が少ないのですぐにかきはじめられる。
• タグ機能はあまり使っていない。
• Scrapboxにテキストを流し込むこともできる。参考: http://d.hatena.ne.jp/wineroses/20180317/p1
  ←このサイトの例ではDraftpadから流し込んでいるが、同じWorkflowレシピでSimplenoteからも流し込める。
• Draftpadの保管庫としてSimplenoteを使うこともできる。

Resophnoteアプリについての参考サイト

Resophnote は、Simplenoteに同期させることができるメモアプリ。軽快なのだが、現時点では、日本語入力の変換ボックスが表示される場所が、今書いている部分にかぶってしまうので、わたしはあまり使っていない。

• http://wasure.net/resophnotes/
• http://wasure.net/resoph-drop/

電気図面を書きたい。そんなに複雑な回路じゃなくて、かんたんな設計図を書ければいいんだ。
そのためにCADを覚えるほどでもないし、高価なCADソフトは買えない。

だからといってやっぱり手書きメモ的な電気回路図しか書けないのは嫌だ。

そんなあなたに・・・いいフリーソフトあります。(Windows用)

電気図面を書けるソフト「BSch3v」です。水魚堂さんのソフト。

http://www.suigyodo.com/online/schsoft.htm

これはなかなかいいです。

ランタイムライブラリ付きの最新版をダウンロード・解凍します。

ソフトそのものはインストールしないで使うタイプのようですが、最初に一度だけやるべきことがあります。

“Runtime”フォルダに入っているランタイムライブラリをインストールします。

インストールは数分で終わります。わたしがインストールしたときは、インストールの際に画面の動きが止まって見えるので、フリーズしたかと心配になりましたが、数分ほうっておいたらちゃんと終わりました。

これで準備完了。
フォルダ内の”bsch3v.exe”で起動します。

使い方は、フォルダに説明書が同梱されています。基本的にはパーツを並べてつないでいきます。文字を入れることもできます。（私が使った感じ、文字は8pt以下だと、pngに出力した時につぶれてしまうようなので、9pt以上に設定したほうが良さそうです)

パーツを自作するツールもあります。これも使いやすい。

png,bmp,emfなどのエクスポートにも対応しているので、できあがった図面を画像として取り出すこともできます。

これで、あなたのWindowsパソコンでも気軽に、電気図面を書けますね。

いいフリーソフトを作ってくれた方に感謝でいっぱいです。

Notepad++ プラグイン Nppftp はいい

サーバ上のテキストファイルを編集するには、FTPアプリでダウンロードして、編集して、またアップロードして、という面倒な作業が必要だったりするのですが、FTPサーバ上のファイルを直接編集できる方法があります。

Notepad++に、プラグイン Nppftp を組み込めばいいのです。

Notepad++は、フリーの高機能なエディタ。これだけでも使いやすいですが、FTPサーバ上のテキストファイルを直接編集するには、プラグインを入れてやる必要があります。

やり方は簡単。メニューの「プラグイン」ー「Plugin Manager」から、Nppftpを追加するだけ。

Nppftpは、FTPサーバ上のファイルを直接編集できるプラグインです。

プラグインが入ったら、サーバを登録すればOK。
あとはどんどんファイルを作成、更新、削除できます。
FTPアプリの出番がぐっと減ります。(画像のアップロードなどは、FTPアプリでやることになりますね)。

フォルダやファイルを右クリックしてみて

フォルダやファイルを右クリックすれば、”create new file”などのメニューが出現し、作成、更新、名前の変更、削除など、基本的なファイル操作、フォルダ操作ができます。

plugin managerがはいっていないとき(64bit版でよくあるみたい)

下記のサイトで最新版DL(UNIが32bit,x64が64bit)

https://github.com/bruderstein/nppPluginManager/releases

https://beelabo.com/web/856 説明

c:\program files\notepad++のなかにある、「plugin」「updater」を上書きする。

Nppftpの紹介

http://yukaribike.com/626.html

データが保存される場所

C:\Users(ユーザ名)\AppData\Roaming\Notepad++\plugins\config\NppFTP\Cache\

薬をなるべく減らしましよう、をどのくらい実践するか

どんな医学も、東洋医学も西洋医学も、基本的には人間が自分の体を自分で直す力を活用して健康をめざすというものであろう。

薬をなるべく減らしましょう、という医学がある。薬は、人間が自分の体を自分で直す力を弱めてしまうと。

気づくか気づかいないかにかかわりなく、どんな薬にも副作用はあるのだろう。

個人的にも、なるべく薬は使いたくない。

でもその一方で、発作とか大怪我といった緊急事態になれば、西洋医学に頼らなければならないのも現実だ。

薬を積極的に使う医学と、なるべく使わない医学、どう活用していくか、ちょうどいいバランスを見つけたい。

Markdownで作ったドキュメントを他の人に渡す時、PDFに変換すると便利である機会が多いのではないでしょうか。

Typoraなど、Windowsで動作するアプリでもできますが、やがて、改ページ位置を指定したくてもできないという壁にぶつかります。

そんなとき便利なのが、このオンラインアプリ、MD2PDF。インストール不要。

http://md2pdf.higty.xyz/

MD2PDFにおける改ページ位置の指定の仕方

なんと、下記のコードを挿入することで、改ページ位置を指定もできる。

<div style="page-break-before:always"></div> 

Windowsを普通に使っていてMarkdownからPDFに変換するときに改ページ位置を指定できる方法を他に私は知らない。markdown-pdfというのもあるらしいが、なんだか難しそうで手が出ない。

サイトの雰囲気も変わった

以前も便利に使っていて、久しぶりに訪れたら、プレビュー機能がついていました。

以前のサイト

新サイト