mimi nari
    • Create new note
    • Create a note from template
      • Sharing URL Link copied
      • /edit
      • View mode
        • Edit mode
        • View mode
        • Book mode
        • Slide mode
        Edit mode View mode Book mode Slide mode
      • Customize slides
      • Note Permission
      • Read
        • Only me
        • Signed-in users
        • Everyone
        Only me Signed-in users Everyone
      • Write
        • Only me
        • Signed-in users
        • Everyone
        Only me Signed-in users Everyone
      • Engagement control Commenting, Suggest edit, Emoji Reply
      • Invitee
      • No invitee
    • Publish Note

      Publish Note

      Everyone on the web can find and read all notes of this public team.
      Once published, notes can be searched and viewed by anyone online.
      See published notes
      Please check the box to agree to the Community Guidelines.
    • Commenting
      Permission
      Disabled Forbidden Owners Signed-in users Everyone
    • Enable
    • Permission
      • Forbidden
      • Owners
      • Signed-in users
      • Everyone
    • Suggest edit
      Permission
      Disabled Forbidden Owners Signed-in users Everyone
    • Enable
    • Permission
      • Forbidden
      • Owners
      • Signed-in users
    • Emoji Reply
    • Enable
    • Versions and GitHub Sync
    • Note settings
    • Engagement control
    • Transfer ownership
    • Delete this note
    • Save as template
    • Insert from template
    • Import from
      • Dropbox
      • Google Drive
      • Gist
      • Clipboard
    • Export to
      • Dropbox
      • Google Drive
      • Gist
    • Download
      • Markdown
      • HTML
      • Raw HTML
Menu Note settings Sharing URL Create Help
Create Create new note Create a note from template
Menu
Options
Versions and GitHub Sync Engagement control Transfer ownership Delete this note
Import from
Dropbox Google Drive Gist Clipboard
Export to
Dropbox Google Drive Gist
Download
Markdown HTML Raw HTML
Back
Sharing URL Link copied
/edit
View mode
  • Edit mode
  • View mode
  • Book mode
  • Slide mode
Edit mode View mode Book mode Slide mode
Customize slides
Note Permission
Read
Only me
  • Only me
  • Signed-in users
  • Everyone
Only me Signed-in users Everyone
Write
Only me
  • Only me
  • Signed-in users
  • Everyone
Only me Signed-in users Everyone
Engagement control Commenting, Suggest edit, Emoji Reply
Invitee
No invitee
Publish Note

Publish Note

Everyone on the web can find and read all notes of this public team.
Once published, notes can be searched and viewed by anyone online.
See published notes
Please check the box to agree to the Community Guidelines.
Engagement control
Commenting
Permission
Disabled Forbidden Owners Signed-in users Everyone
Enable
Permission
  • Forbidden
  • Owners
  • Signed-in users
  • Everyone
Suggest edit
Permission
Disabled Forbidden Owners Signed-in users Everyone
Enable
Permission
  • Forbidden
  • Owners
  • Signed-in users
Emoji Reply
Enable
Import from Dropbox Google Drive Gist Clipboard
   owned this note    owned this note      
Published Linked with GitHub
Subscribed
  • Any changes
    Be notified of any changes
  • Mention me
    Be notified of mention me
  • Unsubscribe
Subscribe
# 翻訳用原稿:FSE Program Testing Call #8: Thrive with Theme.json <!-- [FSE Program Testing Call #8: Thrive with Theme.json]--> [FSE プログラムのテスト募集 #8: theme.json の活用](https://make.wordpress.org/test/2021/06/24/call-for-testing-thrive-with-theme-json/) ========================================================================================================================================== 以下は、[annezazu](https://profiles.wordpress.org/annezazu/) が書いた Make WordPress.org Test チームブログの記事「[FSE Program Testing Call #8: Thrive with Theme.json](https://make.wordpress.org/test/2021/06/24/call-for-testing-thrive-with-theme-json/)」を訳したものです。 誤字脱字誤訳などありましたら[フォーラムまでお知らせください](https://ja.wordpress.org/support/forum/alphabeta/)。 -- <!-- _Props to [@daisyo](https://profiles.wordpress.org/daisyo/) and [@jffng](https://profiles.wordpress.org/jffng/) for the massive amount of help in writing and perfecting this call for testing._ --> _このテスト募集記事の作成と完成に多大な貢献をした [@daisyo](https://profiles.wordpress.org/daisyo/) と [@jffng](https://profiles.wordpress.org/jffng/) に感謝します。_ <!-- **Important note:** Compared to previous calls for testing for the FSE Outreach program, this is intentionally targeting a more developer-centric audience compared to site builders or end users in order to bring high impact feedback for theme.json, a new tool for extenders. You can read more about what to expect with [upcoming efforts here](https://make.wordpress.org/test/2021/06/09/upcoming-fse-outreach-program-schedule-june-july/). --> **重要なお知らせ**: これまでの FSE アウトリーチプログラムのテストではサイトの制作者やエンドユーザーを対象としてきましたが、今回のテストは意図的に開発者をメインの対象としています。これは、新しい拡張用のツールである「theme.json」に対してインパクトのあるフィードバックを行うためです。今後の取り組みについては、[こちら](https://make.wordpress.org/test/2021/06/09/upcoming-fse-outreach-program-schedule-june-july/)をご覧ください。 <!-- Feature Overview --> 機能の概要 ---------------- <!-- At the highest level, theme.json is a configuration file used to enable or disable features and set default styles for both a website and blocks. Rather than dealing with a ton of theme support flags or alternative methods, theme.json provides a consolidated and canonical way to manage it all. These settings include options like: --> theme.json はウェブサイトやブロックの機能を有効または無効にしたり、デフォルトのスタイルを設定するために使用される最高レベルの設定ファイルです。大量のテーマサポートフラグや代替手段を扱うのではなく、theme.json はすべてを管理するための統合された標準的な方法を提供します。これらの設定には、次のようなオプションが含まれます。 <!-- * What customization options should be made available or hidden from the user. * What are the default colors, font sizes, etc available to the user. * Defines the default layout of the editor (widths and available alignments). --> * どのようなカスタマイズオプションをユーザーに提供するか、あるいは隠すか。 * ユーザーが利用できるデフォルトの色やフォントサイズなどはどのようになっているか。 * エディタのデフォルトのレイアウト (幅や使用可能な位置) の定義 <!-- This configuration file is a big part of what makes block themes so powerful as it allows for finer-grained control, and introduces the first step in “managing styles” for future WordPress releases. Here are a few of the top benefits of using this new mechanism:  --> この設定ファイルは、ブロックテーマをより細かく制御できるようにし、今後リリースされる WordPress の「スタイル管理」の第一歩となるもので、ブロックテーマを強力にサポートします。ここでは、この新しい仕組みを使うことで得られる主なメリットをご紹介します。 <!-- * It allows themes to provide settings per block which wasn’t possible before since add\_theme\_support targets settings for the entire editor.  * Themes using theme.json will automatically get classes and CSS Custom Properties enqueued for the presets they declare instead of needing to handle this themselves. Plus, this means translations of preset names are also managed for them! * Theme.json will coordinate core, theme, and user styles in a way that reduces the amount of CSS that needs to ship as well as help resolve specificity problems. --> * テーマはブロックごとの設定を提供できるようになります。これまでは、add\_theme\_support がエディタ全体の設定を対象としていたため、不可能でした。  * theme.json を使用しているテーマは、宣言したプリセットのクラスや CSS カスタムプロパティが自動的に確保されるため、自分で処理する必要はありません。さらに、プリセット名の翻訳も管理されます。 * theme.json は、コア、テーマ、ユーザーのスタイルを調整することで、出力する必要のある CSS の量を減らし、特異性の問題を解決するのに役立ちます。 <!-- While block themes won’t work with WordPress 5.8 without the Gutenberg plugin due to some theme blocks being left out of the release that weren’t quite ready to ship, it’s still an important feature coming to 5.8 that needs testing and exploration. If you’ve been curious about the world of block themes or have started building your own, this call for testing is for you and should help you to continue to explore what’s possible with theme.json while giving you a chance to share what else you’d like to see. --> ブロックテーマは、Gutenberg プラグインがなければ WordPress 5.8で動作しません。これはリリース時にいくつかのテーマブロックがまだ出荷できる状態にないためです。それでもブロックテーマは、5.8に搭載される重要な機能であるため、テストや調査が必要です。ブロックテーマの世界に興味をお持ちの方、ご自身でブロックテーマを作り始めた方は、今回のテストを参考にしていただき、今後も theme.json で何ができるかを探っていただきたいと思います。 <!-- _You can read more about_ [_this feature in the documentation here_](https://developer.wordpress.org/block-editor/how-to-guides/themes/theme-json/)_._ --> theme.json の機能については、ドキュメント「[グローバル設定とスタイル (theme.json)](https://ja.wordpress.org/team/handbook/block-editor/how-to-guides/themes/theme-json/)」で詳しく説明されています。 <!-- Beginner Testing Steps --> 初心者向けのテスト方法 ---------------------- <!-- _This section is for those wanting to get a sense of what theme.json can control and what the output will look like._ --> _このセクションは theme.json で何をコントロールでき、どんなアウトプットを得られるのかを知りたい方向けのセクションです。_ <!-- 1. Head to [https://gutenberg-theme.xyz/](https://gutenberg-theme.xyz/). This is a tool that can help generate the settings section of the theme.json file.  2. From there, try toggling on and off various theme supports. This will help you explore just a few settings that are possible to control with theme.json. For example, you can toggle on and off Custom Colors or Custom Link controls. Notice that the output in the browser changes based on your selection. 3. Use the + button next to Palette, Gradients, or Font Sizes to explore adding customizations. Keep in mind that you can edit both the slug and specific variables, like color name or font size.  4. Add a few customizations and review the output! If you want to go a step further and use what you’ve created, check out the intermediate steps.  --> 1. [https://gutenberg-theme.xyz/](https://gutenberg-theme.xyz/) にアクセスしてください。このツールは、theme.json ファイルの settings セクションの生成を支援します。 2. テーマがサポートする様々な機能をオン、オフしてみてください。theme.json でコントロール可能な設定の中から一部を選択して試すことができます。例えば、カスタムカラーやカスタムリンクの設定をオン、オフしてみてください。選択した内容に応じて、ブラウザの出力が変化することに注目してください。 3. パレット、グラデーション、フォントサイズの隣にある「+」ボタンを使って、追加のカスタマイズを探索してみてください。色の名前やフォントサイズなど、スラッグと特定の変数の両方を編集できる点に注意してください。 4. いくつかのカスタマイズを行い、出力をレビューしましょう ! 更に深く知るには、また、作成した theme.json を動かすには次の中級者向けのステップに進んでください。 <!-- Intermediate Testing Steps --> 中級者向けのテスト方法 -------------------------- <!-- _This section is for those wanting to dig deeper into theme.json by writing their own file and exploring the various settings it can control._ --> _このセクションは、theme.json についてもっと深く知りたいと思う方向けのセクションです。自身の theme.json ファイルを書き、theme.json がコントロールする様々な設定を探ります。_ <!-- Note: this mainly focuses on just theme supports and presets for blocks in the settings section of theme.json rather than Global Styles.  --> 注意: ここでは、全体のスタイルではなく、主に theme.json の settings セクションにある、ブロックのテーマサポートとプリセットに焦点を当てています。 <!-- **Set up your testing environment** --> **テスト環境の設定** <!-- * Create a Fresh WordPress Install. * Install and Activate Gutenberg Plugin while using the latest version ([10.9.0 as of writing this](https://github.com/WordPress/gutenberg/releases/tag/v10.9.0)). * Download and Install [TT1 Blocks from the Theme Directory](https://wordpress.org/themes/tt1-blocks/).  * Navigate to the TT1 Blocks Theme directory and open the theme.json file in a text editor or IDE --> * WordPress を新規にインストールします。 * 最新 ([本稿執筆時点では10.9.0](https://github.com/WordPress/gutenberg/releases/tag/v10.9.0))の Gutenberg プラグインをインストールして、有効化します。 * [TT1 Blocks](https://wordpress.org/themes/tt1-blocks/) をテーマディレクトリからダウンロードして、インストールします。 * TT1 Blocks テーマのディレクトリに移動し、テキストエディタや IDE で theme.json ファイルを開いてください。 <!-- Generally speaking, please use the latest versions of each part of the setup and keep in mind that versions might have changed since this post was shared. --> セットアップのそれぞれのステップにおいて、最新のバージョンを使用してください。この投稿がシェアされてから、バージョンが更新された可能性も念頭に置いてください。 <!-- **Layout** --> **レイアウト** <!-- 1. Create a new post. 2. Add a cover block with a solid colored background and several lines of content in an inner paragraph block to the post. 3. Add another cover block with a solid colored background and several lines of content in an inner paragraph block. Set this block to “Wide Width”. 4. Add a third cover block with a solid colored background and several lines of content to the post and set the block to “Full Width”. 5. Publish Post. 6. Load the post on the front end and note the width of the cover blocks. 7. Change the `contentSize` value to a different pixel value in the layout section of theme.json. 8. Change `wideSize` value to a different pixel value in the Layout section of theme.json. 9. Load the edit view of the previously created post and confirm that new widths are reflected in the editor 10. Load the post on the front end and confirm that the new widths are reflected on the front end of the site 11. **Extra Credit:** Try setting the width values to something other than “px” such as “em”, “rem”, “vh”, “vw”, or “%” --> 1. 新しい投稿を作成してください。 2. 無地の背景を持つカバーブロックを投稿に追加し、内側の段落ブロックに数行のコンテンツを入れます。 3. 別の無地の背景を持つカバーブロックを投稿に追加し、内側の段落ブロックに数行のコンテンツを入れます。このブロックを「幅広」に設定します。 4. 3つの無地の背景を持つカバーブロックを投稿に追加し、内側の段落ブロックに数行のコンテンツを入れ、このブロックを「全幅」に設定します。 5. 投稿を公開します。 6. フロントエンドで投稿を表示し、これらのカバーブロックの幅を記録しておきます。 7. theme.json の layout セクションで、`contentSize` の値を、違うピクセル値に変更します。 8. theme.json の layout セクションで、`wideSize` の値を、違うピクセル値に変更します。 9. 先に作成した投稿の編集画面を開き、新しい幅が編集画面で反映されていることを確認します。 10. ブラウザで投稿を表示し、新しい幅がフロントエンドでも反映されていることを確認します。 11. **ボーナス手順** 幅の値を「px」以外の、「em」、「rem」、「vh」、「vw」、「%」などで設定する事を試してみましょう。 <!-- **Typography** --> **タイポグラフィ** <!-- 1. Set the following typography settings to `true` in `theme.json`:  * customFontWeight (Heading Block) * customFontSize (Paragraph Block) * customLineHeight (Paragraph Block) * dropCap (Paragraph Block) 2. Test visibility of typography settings in a paragraph block (font size, font weight, line height and drop cap) 3. Test visibility of typography settings in a Heading block (font size, font weight, line Height) 4. Test that each of settings apply to the block on the front end 5. Change the typography settings to false in theme.json 6. Confirm that each of the custom typography settings in the paragraph block are no longer present in the block editor (Note the typography settings applied previously may still apply to existing blocks) 7. **Extra credit:** Add one or more font families and font sizes to the typography section of the theme.json file. Test your custom font families and sizes using a Button block. --> 1. `theme.json` で以下の typography 設定を `true` に設定してください。  * customFontWeight (見出しブロック) * customFontSize (段落ブロック) * customLineHeight (段落ブロック) * dropCap (段落ブロック) 2. 段落ブロック内のタイポグラフィ設定、フォントサイズ、フォントウェイト、行の高さ、ドロップキャップの見え方を確認してください。 3. 見出しブロックのタイポグラフィ設定、フォントサイズ、フォントウェイト、行の高さの見え方を確認してください。 4. フロントエンドのブロックに各設定が適用されていることを確認してください。 5. theme.json の typography 設定を false に変更してください。 6. 段落ブロックの各カスタムタイポグラフィ設定が、ブロックエディターに表示されないことを確認します。ただし、以前に適用したタイポグラフィ設定が既存のブロックに適用されている場合があります。 7. **追加クレジット** theme.jsonファイルのtypographyセクションに、1つまたは複数のフォントファミリーとフォントサイズを追加します。 ボタンブロックを使用して、カスタムフォントファミリーとサイズをテストします。 <!-- **Border** --> **枠** <!-- 1. Set the following border settings to `true` in `theme.json`: * `"customColor": true` * `"customRadius": true` * `"customStyle": true` * `"customWidth": true` 2. Create a group block with an inner paragraph block with several lines of text. 3. Test visibility of border settings in a group block (Style, Width, Radius, Custom Color). 4. Test that settings apply to the block on the front end. 5. Change the border settings to False in theme.json. 6. Confirm that border settings in group block are no longer present in the block editor. --> 1. `theme.json` で以下の border 設定を `true` に設定してください。 * `"customColor": true` * `"customRadius": true` * `"customStyle": true` * `"customWidth": true` 2. 数行のテキストを含む内部段落ブロックを持つグループブロックを作成します。 3. グループブロックの枠設定、スタイル、幅、角丸、カスタムカラーの見え方を確認します。 4. フロントエンドのブロックに設定が適用されていることを確認してください。 5. theme.json の border 設定を false に変更してください。 6. グループブロックの枠設定が、ブロックエディターに表示されないことを確認します。 **色** 1. `theme.json` で、custom と customGradient の以下の色設定を`true` に設定してください。 * `"custom": true` * `"customGradient": true` * `"link": true` 2. カスタムグラデーションの背景を持つカバーブロックと、内側の段落ブロックに数行のコンテンツを追加します。 3. 段落ブロックにリンクを追加し、リンクの色をカスタムカラーに設定します。 4. 画像を背景にした別のカバーブロックと、内側の段落ブロックにある数行のコンテンツを記事に追加します。表紙の背景には、デュオトーンのプリセットを使用するように設定します。 5. 背景画像のデュオトーンカラーを変更し、デュオトーンのシャドウとハイライトの設定にカスタムカラーを使用する。 6. **追加クレジット:** パレットとデュオトーンまたはグラデーションのプリセットに1つまたは複数の追加カラーを追加します。CSS グラデーションの詳細については、[CSS Tricks](https://css-tricks.com/css3-gradients/) と [CSS Gradient](https://cssgradient.io/) のリソースをご確認ください。 参考までに、[@daisyo](https://profiles.wordpress.org/daisyo/) の[例](https://gist.github.com/DaisyOlsen/3a3d2c56e5fd502db9591e4e9c7067aa)で、最終的にどのような出力が得られるかを示しています。 <!-- (Very) Advanced Testing Steps --> (超) 上級者向けのテスト方法 ----------------------------- <!-- _This section is for those looking to create a more robust block theme using theme.json and who are experienced theme developers. This isn’t for everyone!_ --> _このセクションは、theme.json を使用してより強固なブロックテーマを作成したいと考えている人や、テーマ開発経験者向けのセクションです。一般ユーザー向けではありません。_ <!-- If you feel more comfortable with block themes and have ample time to dig into theme.json, try replicating a classic theme. Here are two options that should be fun to dig into but keep in mind any default theme should work well: --> ブロックテーマに慣れ、theme.json を調べる時間も十分にある場合は、クラシックテーマの再現はいかがでしょう。ここでは2つのオプションを紹介しますが、デフォルトテーマでも問題ありません。 * [Twenty Twenty](https://ja.wordpress.org/themes/twentytwenty/) * [Storefront](https://ja.wordpress.org/themes/storefront/) <!-- As you try to do this, write down what gaps remain, what proves to be the most difficult to do, and what feels surprisingly easy! Share in the comments below so we can learn from your experience. This is intentionally extremely open ended and advanced so don’t worry if you don’t feel up for the challenge. If you want to follow along while someone else explores doing this, check out [@mkaz](https://profiles.wordpress.org/mkaz/)‘s exploration video on [learning to create a block theme](https://www.youtube.com/watch?v=ClvB5wzyFzo&t=210s). --> 実際に試してみて、どんなギャップがあったか、何が一番難しかったか、何が意外と簡単だったかをメモしておき、以下のコメント欄で共有してください。あなたの経験から学べることが多くあります。なお、この手順は、意図的に非常に自由で高度なテストに設定していますので、試す気にならなくても安心してください。誰か他の人がテストしているのを見ながらテストしたい場合は、[@mkaz](https://profiles.wordpress.org/mkaz/)の動画「[ブロックテーマ作成を学ぶ](https://www.youtube.com/watch?v=ClvB5wzyFzo&t=210s)」をチェックしてみてください。 注目すること: --------------- これらの質問は、中級編と上級編に特化したものです。  * theme.json ファイルに追加された色は、各種ブロックのカラーパレットにカーソルを置いたときに、割り当てられた名前で表示されますか ? * theme.json ファイルに追加されたフォントサイズは、ブロックのフォントサイズのドロップダウンに割り当てられた名前とサイズで表示されますか ? * エディターでブロックを使用したときに、色やフォントサイズが正しく表示されますか ? * フロントエンドでブロックを使用したときに、色やフォントサイズが正しく表示されますか ? * 今回の体験で、特に戸惑いや不満を感じたことは何ですか ? * 特に楽しかったこと、感謝したことは何ですか ? <!-- Leave Feedback by July 14th --> フィードバックをお願いします(2021年7月14日まで) --------------------------- <!-- Please leave feedback (questions, comments, concerns) in the comments of this post and be sure to note which section you followed. If you’d prefer, you’re always welcome to create issues [in this GitHub repo directly for Gutenberg](https://github.com/WordPress/gutenberg/issues) but, for this test, it’s unlikely you’ll need to. However, if you do leave feedback in GitHub, please comment below with the link. --> この記事のコメント欄に質問、コメント、懸念事項などのフィードバックをお願いします。その際、必ずどのセクションの手順に従ったかを明記してください。必要であれば、[GutenbergのGitHubリポジトリ](https://github.com/WordPress/gutenberg/issues) に直接 issue を作成いただいても構いませんが、このテストに関しては恐らくその必要はないでしょう。ただ、もしも GitHub にフィードバックを残す場合は、以下のコメント欄にリンクを貼ってください。 <!-- **Join a hallway hangout for theme.json testing on July 7th** --> **7月7日開催予定の theme.jsonテストのハングアウトに参加しましょう。** <!-- To help those who might want to explore this test and theme.json in a group, [@daisyolsen](https://profiles.wordpress.org/daisyolsen/) will be hosting a hallway hangout specifically for this exercise. If you have never attended a hallway hangout, [you can read more about them here](https://make.wordpress.org/community/handbook/virtual-events/online-meetup-guidelines/overview-of-casual-online-gatherings/). Ultimately, they are meant to be casual and collaborative sessions to bring like minds together. --> FSE のテストや theme.json を誰か他の人と一緒に検討したいという方のために、[@daisyolsen](https://profiles.wordpress.org/daisyolsen/)が、今回のシナリオをメインとするハングアウトを開催します。ハングアウトに参加したことがない方は、[こちら](https://make.wordpress.org/community/handbook/virtual-events/online-meetup-guidelines/overview-of-casual-online-gatherings/) で詳細を確認できます。同じ考え方を持つメンバーによる、カジュアルで協力的なセッションを意味します。  <!-- * Time: 5pm UTC * Date: July 7th * [Zoom link can be found here](https://us02web.zoom.us/j/88136786501?pwd=a21zL2Y2TjZqMkNYUHl6c2pjSjBtUT09) with the meeting ID of 881 3678 6501 and password 600875.  * This will be announced and wrangled further in the [#fse-outreach-experiment](https://make.wordpress.org/test/tag/fse-outreach-experiment/) channel. --> * 日時: 7月7日 午後5時 UTC / 日本時間 7月8日 午前2時 * [Zoom リンク](https://us02web.zoom.us/j/88136786501?pwd=a21zL2Y2TjZqMkNYUHl6c2pjSjBtUT09) meeting ID 881 3678 6501 / password 600875  * 追加情報は [#fse-outreach-experiment](https://make.wordpress.org/test/tag/fse-outreach-experiment/) チャンネルで発表されます。 <!-- Hope to see you there.  --> ハングアウトでお会いしましょう ! [#fse-outreach-program](https://make.wordpress.org/test/tag/fse-outreach-program/), [#fse-testing-call](https://make.wordpress.org/test/tag/fse-testing-call/), [#full-site-editing](https://make.wordpress.org/test/tag/full-site-editing/) -- この記事は mimi, umikoh, nao, atachibana で翻訳しました。

Import from clipboard

Advanced permission required

Your current role can only read. Ask the system administrator to acquire write and comment permission.

This team is disabled

Sorry, this team is disabled. You can't edit this note.

This note is locked

Sorry, only owner can edit this note.

Reach the limit

Sorry, you've reached the max length this note can be.
Please reduce the content or divide it to more notes, thank you!

Import from Gist

Import from Snippet

or

Export to Snippet

Are you sure?

Do you really want to delete this note?
All users will lose their connection.

Create a note from template

Create a note from template

Oops...
This template is not available.
Upgrade
All
  • All
  • Team
No template found.

Create custom template

Upgrade

Delete template

Do you really want to delete this template?
Turn this template into a regular note and keep its content, versions, and comments.

This page need refresh

You have an incompatible client version.
Refresh to update.
New version available!
See releases notes here
Refresh to enjoy new features.
Your user state has changed.
Refresh to load new user state.

Sign in

Forgot password

or

By clicking below, you agree to our terms of service.

Sign in via Facebook Sign in via Twitter Sign in via GitHub Sign in via Dropbox Sign in with Wallet
Wallet ( )
Connect another wallet

New to HackMD? Sign up

Help

  • English
  • 中文
  • Français
  • Deutsch
  • 日本語
  • Español
  • Català
  • Ελληνικά
  • Português
  • italiano
  • Türkçe
  • Русский
  • Nederlands
  • hrvatski jezik
  • język polski
  • Українська
  • हिन्दी
  • svenska
  • Esperanto
  • dansk

Documents

Help & Tutorial

How to use Book mode

How to use Slide mode

API Docs

Edit in VSCode

Install browser extension

Get in Touch

Feedback

Discord

Send us email

Resources

Releases

Pricing

Blog

Policy

Terms

Privacy

Cheatsheet

Syntax Example Reference
# Header Header 基本排版
- Unordered List
  • Unordered List
1. Ordered List
  1. Ordered List
- [ ] Todo List
  • Todo List
> Blockquote
Blockquote
**Bold font** Bold font
*Italics font* Italics font
~~Strikethrough~~ Strikethrough
19^th^ 19th
H~2~O H2O
++Inserted text++ Inserted text
==Marked text== Marked text
[link text](https:// "title") Link
![image alt](https:// "title") Image
`Code` Code 在筆記中貼入程式碼
```javascript
var i = 0;
```
var i = 0;
:smile: :smile: Emoji list
{%youtube youtube_id %} Externals
$L^aT_eX$ LaTeX
:::info
This is a alert area.
:::

This is a alert area.

Versions and GitHub Sync
Upgrade to Prime Plan

  • Edit version name
  • Delete

revision author avatar     named on  

More Less

No updates to save
Compare
    Choose a version
    No search result
    Version not found
Sign in to link this note to GitHub
Learn more
This note is not linked with GitHub
 

Feedback

Submission failed, please try again

Thanks for your support.

On a scale of 0-10, how likely is it that you would recommend HackMD to your friends, family or business associates?

Please give us some advice and help us improve HackMD.

 

Thanks for your feedback

Remove version name

Do you want to remove this version name and description?

Transfer ownership

Transfer to
    Warning: is a public team. If you transfer note to this team, everyone on the web can find and read this note.

      Link with GitHub

      Please authorize HackMD on GitHub
      • Please sign in to GitHub and install the HackMD app on your GitHub repo.
      • HackMD links with GitHub through a GitHub App. You can choose which repo to install our App.
      Learn more  Sign in to GitHub

      Push the note to GitHub Push to GitHub Pull a file from GitHub

        Authorize again
       

      Choose which file to push to

      Select repo
      Refresh Authorize more repos
      Select branch
      Select file
      Select branch
      Choose version(s) to push
      • Save a new version and push
      • Choose from existing versions
      Include title and tags
      Available push count

      Upgrade

      Pull from GitHub

       
      File from GitHub
      File from HackMD

      GitHub Link Settings

      File linked

      Linked by
      File path
      Last synced branch
      Available push count

      Upgrade

      Danger Zone

      Unlink
      You will no longer receive notification when GitHub file changes after unlink.

      Syncing

      Push failed

      Push successfully