2022年7月以降、完全なベータ版は動作しなくなりました。
Windows: トリアル版をインストールし、ドキュメントを開かない状態で、必要なだけ空のウィンドウを作成してください。最初のファイルを開くと、新しいドキュメントを開くことができなくなります。そのため、起動直後に Ctrl+Shift+N で空のウィンドウを作成し、その後「ライセンス情報」ウィンドウを閉じてください。このウィンドウは再利用できないため、最初に複数の空のウィンドウを一度に作成するのが最善です。
Linux: Ctrl+o で新しいウィンドウを作成し、その中にドキュメントを開く機能は正常に動作します
。事前に空のウィンドウを大量に用意する必要はありません。
はじめに
Typora - 最高のエディタ:
- Markdownソースコードの編集に最適
- PDFへのエクスポート(以下設定参照)
利用可能なメリット:
- 画像(オフライン保存可能)、構文ハイライト付きコード、表を挿入してラフなメモとして使用可能
- フォーマット調整に最小限の手間
- ドキュメント内でのコンテンツ挿入と相互参照リンクが便利
- ドキュメントをウェブページのように扱える(挿入した画像を編集するとドキュメント内に反映)
- 1つの画像を複数のドキュメントから参照可能
- Typora、Gitlab、GitHub、YouTrack、ProxmoxのNotes記述で互換性があり、形式が汎用的で逆互換性も保証
- Gitlab、GitHubのマークダウン記法(readme.mdで自動開く)ほぼ完全互換
- オンラインドキュメントプラットフォーム(例:Docsify)との最大互換性
インストール
https://typora.io から手動でダウンロード、またはChocolatey経由でインストール:
choco install typora --ignore-checksums --execution-timeout=300 --limit-output --no-progress --yes
Vue.jsテーマ
このテーマはDocsifyと非常に相性が良いです。ドキュメントの見た目、Docsifyでの表示、およびPDF出力の見た目が完全に一致します!
~/.config/Typora/themes/このフォルダに以下のファイルを配置してください:
vue (フォルダ) vue.css vue_dark.cssテーマの全アーカイブはこちら:
typora_themes.zip (3.1 MB)
インデントの設定
インデントはコンテンツのレイアウトに影響します。一度設定したインデントサイズは変更しないでください。ページの区切りを崩す原因になります。
ドキュメント作成に適した値は: 上部10、下部5、左側10、右側5 です。このレイアウトでは、すべてのプリンタがページ番号を印刷できない可能性があります。
ページ区切り挿入(PDF)
ページ区切りを強制的に挿入するには、ヘッダーの前に次のコードを挿入してください。
これにより、印刷用に最適化されたPDFを生成でき、文章が論理的にページに分割されます(表は自動的に分割されます)。
<div style="page-break-after: always;"> </div>:person_tipping_手: 以前の設定と上書きでドキュメントを定期的にエクスポートし、ページ分割が適切なPDFを得るためには:

必要に応じて、上記で指定したセパレータを使ってページの区切りを調整してください。
画像挿入の設定
「画像をユーザーのフォルダにコピーする」オプションを有効にしてください:
画像をユーザーのフォルダにコピー = ./images/${filename}
これにより、画像がローカルの関連フォルダにコピーされます。一時フォルダから永続フォルダへ画像を移動するには、画像の右クリックコンテキストメニューから「コピー先 \u003cフォルダ\u003e…」を選択してください。ここで「フォルダ」はドキュメント名と一致するフォルダ名(最初の保存時に自動作成)です。
スペースと特殊文字に注意してください!
Typora はこのようなパスで画像を正しく表示しますが、GitLab などでは表示されません。その場合は、Urlencoder を使って特殊文字を置換してください:
- %20
! - %21
@ - %40
# - %23
$ - %24
% - %25
^ - %5E
\u0026 - %26
* - %2A
( - %28
) - %29
\u003c - %3C
\u003e - %3E
拡張フォーマットのサポート
拡張フォーマットのサポートを有効にしてください:
コードブロックの行番号
最新のバージョンでは、設定に「すべてのコードブロックに行番号を付ける」チェックボックスが追加されました。
特定のケースでのみ行番号が必要な場合は、次の構文を使用してハイライト設定を指定してください:
{.language-name .numberLines}
または
# 特定の行番号から開始する場合
{.language-name .numberLines startFrom="start-value"}
ヘッダー間のページ区切りを削除
Typora 0.11.7 以降では、「 上部ヘッダー間のページ区切り」の設定が追加されました。この設定は常に無効にしてください。
ページ番号(フッター)の表示を推奨します:
${pageNo} / ${totalPages}
\"0.11.7以前のバージョンの場合\"
旧バージョンでは:
Typora の PDFエクスポート時にヘッダー間でページ区切り(page-break)が自動追加され、PDFのページが破壊されることがあります。これを修正するには:
\u003ckbd\u003eメニュー\u003c/kbd\u003e–\u003ckbd\u003eファイル\u003c/kbd\u003e–\u003ckbd\u003e設定\u003c/kbd\u003e–\u003ckbd\u003eフォーマット\u003c/kbd\u003e–\u003ckbd\u003eテーマのフォルダを開く\u003c/kbd\u003e
C:\\Users\\xx\\AppData\\Roaming\\Typora\\themes
github.css ファイルを開き、@media_print ブロックをコメントアウトしてください。CSSのコメント記号 /* と */ を追加してください:
/*@media print {
html {
font-size: 13px;
}
table,
pre {
page-break-inside: avoid;
}
pre {
word-wrap: break-word;
}
}*/
Typora を再起動してください。
表のページにまたがる挙動の変更
PDFエクスポート時に表が常に新しいページから始まる場合があります。この挙動を変更するには、テーマファイル C:\\Users\\...\\AppData\\Roaming\\Typora\\themes\\github.css を開き、「avoid」を「auto」に変更してください:
\u003ckbd\u003eメニュー\u003c/kbd\u003e–\u003ckbd\u003eファイル\u003c/kbd\u003e–\u003ckbd\u003e設定\u003c/kbd\u003e–\u003ckbd\u003eフォーマット\u003c/kbd\u003e–\u003ckbd\u003eテーマのフォルダを開く\u003c/kbd\u003e
pre {
page-break-inside: auto;
}
### ドキュメント
部分的に翻訳されたドキュメント: https://way23.ru/typora-%D1%80%D0%B0%D0%B7%D1%80%D1%8B%D0%B2%D1%8B-%D1%81%D1%82%D1%80%D0%B0%D0%BD%D0%B8%D1%86/
### エモジの挿入
https://github.com/ikatyang/emoji-cheat-sheet
### マークダウンのラッピング
[Markdown-Reference.pdf|attachment](upload://bJJtcLkXrjMiDU9xA38FqzPSZJd.pdf) (334.3 KB)
### 図表
https://support.typora.io/Draw-Diagrams-With-Markdown
https://mermaid.js.org/syntax/gantt.html
[typora_diagrams.md|attachment](upload://t9Q87PYdpkvGHOIrRP5wvRWvtWe.md) (12.8 KB)
```mermaid
stateDiagram-v2
State1: The state with a note
note right of State1
Important information! You can write
notes.
end note
State1 -- State2
note left of State2 : This is the note to the left.
%%{init: {
"theme": "base",
"themeVariables": {
"pie1": "#8BC34A", "pie2": "#f3d69c", "pie3": "#FF5722",
"pie4": "#009688", "pie5": "#5C6BC0", "pie6": "#03A9F4",
"pie7": "#EF4444", "pie8": "#ec070c", "pie9": "#FFC107",
"pie10": "#ca936d","pie11": "#c9edfa","pie12": "#E91E63"
}
} }%%
pie title
"CI/CD, SETUP, RND (HA/LB)" : 37.3
"Other (DB, BACKUP, etc.)" : 15.94
"CONSULT + サポート" : 13.3
"PM, process" : 10.45
"PERIODIC / SETUP (VM)" : 7.4
"DOCS" : 5.31
"PRESALE" : 4.6
"MONITORING" : 3.85
"ONBOARD / PREPARE" : 1.82
"手動 / FIX" : 0.18
"RND (アーキテクチャ)" : 0.05
ボタン
画像の赤いボタンに白い文字で「確認が必要です」と表示されています。(AIによる画像のキャプション)
ドキュメントの先頭に README.md に以下のようなコードを追加してください:
<style>
.markdown-section .mybutton, .markdown-section .mybutton:hover {
cursor: pointer;
color: #CC0000;
height: auto;
display: inline-block;
border: 2px solid #CC0000;
border-radius: 4rem;
margin: 2px 0px 2px 0px;
padding: 8px 18px 8px 18px;
line-height: 1.2rem;
background-color: white;
font-family: -apple-system, "Segoe UI", "Helvetica Neue", sans-serif;
font-weight: bold;
text-decoration: none;
}
</style>
ボタンを挿入するには、クラス指定のコードを使用してください:
[確認が必要です](URL ':class=mybutton')
PDFではボタンは通常のリンクとして表示されます





