ポストエディターの使い方
Boutletでは、通常のポストも参加投稿も同じエディターで作成します。短い感想から、体験や資料をまとめた長文まで、必要な要素を追加しながら書いてみましょう。
エディターは、Notionに似たブロック形式の編集に対応しています。段落、見出し、リスト、画像などがそれぞれ一つのブロックになり、追加や並べ替えによって文章を組み立てられます。
このページの表示例には、実際のポスト本文と同じレンダラーを使っています。Markdown表示では、同じ例をポストと同じ方法でMarkdownに変換して表示します。文字の色や配置、一部のメディアの表示方法は、閲覧方法によって異なります。
/でブロックを探して追加する
- 空の行で
/を入力します。 - ブロック名や検索語を入力します。
- メニューの項目をクリックするか、上下の矢印キーで選んでEnterを押します。
/ の後に入力する文字は、ブロックを探すための検索語です。コマンドを丸ごと覚えなくても、メニューで目的の項目を選べます。
| 追加するブロック | 検索例 |
|---|---|
| 標準テキスト | /標準テキスト、/paragraph |
| 見出し1〜6 | /h1、/h2、/h3、/h4、/h5、/h6 |
| 箇条書き・番号付きリスト | /箇条書き、/リスト、/ul、/ol |
| チェックリスト | /チェック、/check |
| 引用 | /引用、/bq |
| コードブロック・表 | /code、/表 |
| 画像・動画 | /画像、/video |
| 画像スライダー | /gallery、/slider |
| 区切り線 | /divider |
ブロック横の + ボタンからも追加メニューを開けます。見出しやメディアは、エディター上部のツールバーからも追加できます。
テキストと見出し
段落と見出し
そのまま入力すると通常の段落になります。Enterで次のブロックを作成し、同じ段落の中で改行したいときはShift+Enterを使います。
見出しは1〜6のレベルを選べます。/h2 などで検索するか、上部の見出しメニューから選んでください。文章の中を区切る小見出しには、見出し2や見出し3が便利です。
行の先頭で # に続けてスペースを入力すると見出し1に、## に続けてスペースを入力すると見出し2に切り替わります。
文字の装飾
文字を選択すると書式ツールバーが表示されます。太字、斜体、下線、取り消し線、インラインコードのほか、文字色や背景色、対応するブロックの文字揃えを変更できます。
リンクを付けるには、文字を選択してリンクツールにURLを入力します。短いコマンドや名前は、インラインコードにすると本文と区別しやすくなります。
引用
資料の一節や、本文から区別して見せたい文章には引用ブロックを使えます。/引用 を選んで内容を入力してください。出典のある文章には、参照先のリンクも添えましょう。
引用ブロックは本文内の表示形式です。別のBoutletのポストを参照して新しいポストを書く「引用」機能とは、それぞれ別に使えます。
リスト
関連する項目には箇条書き、手順には番号付きリスト、確認することにはチェックリストを使うと整理しやすくなります。
| リスト | 追加方法 |
|---|---|
| 箇条書き | /ul を選ぶか、行の先頭で - に続けてスペースを入力 |
| 番号付きリスト | /ol を選ぶか、行の先頭で 1. に続けてスペースを入力 |
| チェックリスト | /チェック を選ぶか、行の先頭で [ ] に続けてスペースを入力 |
Enterで次の項目を追加します。空の項目でもう一度Enterを押すと、通常の段落に戻ります。入れ子の項目は同じ種類のリストでまとめてください。番号付きリストは1から始まります。
チェックの状態は作成・編集画面で変更します。公開後のポストには、作成者が保存した状態が表示されます。
コード・表・区切り線
コードブロック
複数行のコードやコマンドを共有するときは、/code でコードブロックを追加します。ブロックの言語メニューで使用する言語を選ぶと、構文の色分けが適用されます。標準テキストとして表示することもできます。
コードブロックはコードを表示するためのもので、実行はしません。
表
/表 で表を追加し、各セルに入力します。行と列のハンドルメニューから、行や列を追加・削除できます。
複数の項目を比較するときに便利です。最初の行に項目名を入れ、狭い画面でも読みやすいように、列数とセルの内容を簡潔にまとめましょう。
区切り線
話題が切り替わる場所には、/divider で区切り線を追加できます。
画像と動画
画像
/画像 または上部の画像ボタンを選び、端末からファイルをアップロードします。画像ファイルをエディターへドラッグしたり、クリップボードの画像を貼り付けたりすることもできます。
画像が何を示しているのか本文に添えると、体験や結果が伝わりやすくなります。公開できる画像を使い、スクリーンショットに個人情報が含まれていないかも確認してください。
画像スライダー・ギャラリー
複数の画像を一つにまとめるには、/gallery または /slider で画像スライダーを追加します。上部のギャラリーボタンからも複数の画像を選択できます。
スライダーの編集画面で画像を追加し、順番を整えられます。画像ブロックのハンドルメニューにはスライダーとして表示、スライダーのメニューには個別の画像として表示する機能があり、文章に合う形に切り替えられます。
動画
/video または上部の動画ボタンを選び、ファイルをアップロードします。アップロードと動画の処理が完了すると公開できます。
動画ファイルのアップロードと外部動画の埋め込みでは、追加方法が異なります。YouTubeの動画は、次のURL貼り付けの方法で追加してください。
リンクと外部ウィジェット
リンクのプレビュー
空の段落にWebページのURLだけを貼り付けると、対応するアドレスをリンクのプレビューや外部ウィジェットに変換できます。
一般的なWebページは、タイトル・説明・画像の付いたリンクカードとして表示される場合があります。元のサイトが情報を提供していない場合やページにアクセスできない場合は、表示内容が限られることがあります。
文中の文字にリンクを付けたい場合は、文字を選択してリンクツールを使ってください。
対応する外部コンテンツ
ウィジェットは / メニューから選ぶのではなく、対応するURLを空の段落に貼り付けて追加します。
| サービス | 追加できるコンテンツ |
|---|---|
| YouTube | 動画 |
| X・Threads・Instagram | 対応する公開投稿 |
| Notion | 公開またはWeb公開したページ |
| Google Workspace | ドキュメント・スプレッドシート・スライド・フォーム・カレンダー・Driveの対応する共有コンテンツ |
元のサービスの共有設定を確認してください。自分のアカウントで開けても、ほかの人には閲覧権限がない場合があります。Boutletに追加しても、元のコンテンツの閲覧権限は変わりません。
外部コンテンツの表示には、そのサービスへの接続が発生します。再生や追加の読み込みは、各サービスの提供状況と表示される案内に従って利用できます。
ブロックの整理と保存
並べ替えと削除
ブロック横のハンドルをドラッグすると、好きな位置へ移動できます。ハンドルをクリックするとメニューが開き、不要なブロックを削除できます。
段落を見出しやリストに変えるときは、文字を選択して書式ツールバーのブロック種類メニューを使います。誤って変更した場合は、元に戻す操作で取り消せます。
下書きと公開済みポストの保存
| 作業の種類 | 保存方法 |
|---|---|
| 新しいポスト・引用ポスト・参加投稿の作成 | 下書きが自動保存されます。画面を離れる前に、上部の保存状態を確認してください。 |
| 公開済みポスト・参加投稿の編集 | 編集後に変更を保存して反映します。 |
下書きを保存しただけでは公開されません。ファイルのアップロードと処理が終わったことを確認してから、公開ボタンを選んでください。
参加投稿にも同じブロックと書式ツールが使えます。作成画面の上部にある参加先と報酬案内を確認し、無料で一般公開できる内容を作成してください。公開後の編集を評価用の提出内容にも反映したい場合は、再提出できるか確認が必要です。参加の手順は参加投稿の作成と提出で確認できます。