エディタ
配置とページ(タブ)
ブロックの並べ方(縦並び / グリッド)と、ページ(タブ)・下バーのナビの作り方。
配置はプレビュー上部の切り替え、または「デザイン」タブの 配置 で変更します。
縦並び
すべてのブロックが 1 列に、上から順に並びます。もっとも読みやすく、スマートフォンでも同じ見た目になります。
グリッド(Bento 風)
2 列のグリッドにブロックを敷き詰めます。ブロックごとに 幅 と 高さ を決められます。
| 設定 | 選択肢 |
|---|---|
| 幅 | 半分(1 列)/ 全幅(2 列) |
| 高さ | 1 行 / 2 行 |
- 「半分」のブロックを 2 つ続けると横に並びます
- 「2 行」にすると、隣の 2 つのブロックと同じ高さになります(画像やリッチリンクを大きく見せたいときに)
- 幅が狭い画面(スマートフォン)では自動的に 1 列になります
並び替え
どちらの配置でも、プレビュー上のブロックをドラッグして順番を変えられます。スマートフォンではブロックをロングタップしてからドラッグします。 「ブロック」タブの一覧でも同じ順番で並んでいます。
全幅に置く
ホームは、左にプロフィールのカード、右にブロック、その下に全幅のブロックという 2 列の配置です。ブロックの設定の「全幅に置く」で、そのブロックを右の列に置くか下に全幅で置くかを選べます。何も指定しなければ表だけが全幅で、ほかは右の列です(例: 相互リンクを全幅にして、小さな表を右の列に)。
ページ(タブ)とナビ
ブロックを複数のページ(タブ)に分けて置き、下バー や 上のタブ で切り替えられます。 ナビにはページのほか、外部サイトへのリンクも並べられます(あわせて 8 個まで)。設定は「デザイン」タブの ページとナビ です。
| 設定 | 内容 |
|---|---|
| ナビの位置 | 下バー(画面の下のバー。あわせて上のバーと、広い画面では左メニューが出ます。下の「下バーの骨組み」)/ 上のタブ(プロフィールの下)/ 出さない(最初のページだけ) |
| プロフィールの見出し | 全ページに出す / 最初のページだけ |
| アイコンの下に名前を出す | オフにするとアイコンだけ |
| 項目 | ページ: 名前・アイコン・URL の #(半角英数字)。リンク: 名前・アイコン・リンク先・新しいタブで開くか |
- ページは「+ ページを追加」、リンクは「+ リンクを追加」で足し、← → で並べ替えます。「ブロック」タブのページの一覧でも、ブロックと同じく ⋮⋮ をドラッグして並べ替えられます
- 「ブロック」タブのページの一覧を右クリック(スマホは長押し)すると、名前を変更(その場で入力。Enter で決定)・アイコンを変更(Windows のエクスプローラーと同じ色付きのアイコンから選びます)・複製・公開範囲・削除ができます。ホームのページは外せません
- ページを外すと、そのページのブロックはホームに移ります
- 「ブロック」タブのページの一覧で、編集するページを選びます。ブロックを追加すると、選んでいるページに入ります(ブロックの 置くページ でも移せます)
- プレビューのナビを押しても切り替わります。ブロックをほかのページの一覧へドラッグしても移せます
- 公開ページでは
folita.me/@ID#ページの#で、そのページを直接開けます。ブラウザーの戻る / 進むにも対応しています - ページが 1 つだけのときは、ナビは出ません
下バーの骨組み
ナビの位置を 下バー にすると、アプリのような骨組みになります(テーマごとの見た目は デザイン のとおり)。
| 画面の幅 | 出るもの |
|---|---|
| 狭い(スマホ) | 上のバー(名前とアイコン)と下バー |
| 広い(769px 以上) | 左メニュー(アイコンと名前・ページの一覧・© とfolita の表記)と、本文の上にページの見出し。下バーは出ず、本体は左メニューの右側いっぱいに広がります |
- 上のバーや左メニューの アイコン を押すと、マテリアルでは Google アプリのアカウントメニュー、リキッドグラスでは iOS の設定のような面が右から出ます。見ている人のアカウント(ログイン中なら名前と ID、未ログインなら「ゲスト」)と、アカウントの管理・ログアウト / ログイン、あなた自身には「このページを編集」が並びます
- Windows では、アイコンを押すと「アカウント」のページ(
#account)が開きます。見ている人のアイコン・名前・ID と、アカウントの種類(自分のページなら「管理者」、ほかの人のページでは「最高管理者」「管理者」「コントリビューター」「標準ユーザー」のいずれか。未ログインは「ゲスト」)が出ます - マテリアルでは、プロフィール(アイコン・名前・自己紹介)とブロックがそれぞれ面のパネル(角丸 28px)に入り、広い画面では左にプロフィール、右にブロックが横に並びます(プロフィールはスクロールしても留まります)
- マテリアルでは、見ている人がページの持ち主(あなた)ならアイコンに紫と青のリングと「Admin」のバッジ、folita.me の運営がコントリビューターにしたアカウントなら青から緑のリングと「Contributor」のバッジ、ほかの folita.me アカウントでログインしていれば Google アプリと同じ 4 色のリングと「Standard」のバッジが付きます(運営本人は「Owner」)
カスタム CSS では .folita-nav .folita-nav--bottom .folita-nav--top .folita-nav__item(選択中は .is-active).folita-panel(data-page)で変えられます。