セクションの設定 - ビルディング - Carrd ドキュメント

Last updated on 5/24/2025@mrbirddev
セクションの設定 - ビルディング - Carrd ドキュメント

セクションの作成

セクションの概念の中心にあるのは、セクションの開始終了を示し、どの要素がそれに属するかを決定する特別なコントロール要素であるセクションブレイクです。使用方法は以下の通りです:

  1. 要素を追加をクリック。

  2. コントロールをクリックして新しいコントロール要素を作成。

  3. タイプセクションブレイクに設定。

  4. 短くて説明的な名前を、小文字、数字、ハイフンのみで構成(例:work)。これによりセクションを一意に識別し、リンクすることができます(下記参照)。

  5. サイトを分割したい場所にセクションブレイクをドラッグし、クリックを離して配置します。それで完了です。ビルダーでは効果は見えませんが、サイトの公開バージョンでは以下のことが起こります:

  • 設定した名前(例:work)で新しいセクションを作成し、セクションブレイクのすべての要素を含めます(別のセクションブレイク、フッターマーカー、またはサイトの下部まで)。
  • セクションブレイクのすべての要素を(別のセクションブレイク、ヘッダーマーカー、またはサイトの上部まで)前のセクションに割り当てます。
  • ... そして前のセクションが存在しない場合は、自動的にhomeという名前で作成します。
  1. ボタンやリンク、URLを使用するほぼすべてのものにハッシュ#とセクションの名前を続けてリンクします(例:#work)。

  2. (オプション) サイトのページ要素を選択し、アニメーションタブをクリックして、サイトがセクションを変更する際に使用するセクション変更時の効果を選択。

  3. 完了です! セクションへのリンクをクリックすると、すぐに開いて内容が表示されます(セクション変更効果が選択されている場合はそれを使用)。各セクションは、サイトのURLにハッシュ付きの名前を追加するだけでディープリンクできます(例:foo.carrd.co/#work)。また、セクション間を移動するための特別なURLにリンクすることもできます。

URLDescription
section:next次のセクションを開く。
section:previous前のセクションを開く。
section:first最初のセクションを開く。
section:last最後のセクションを開く。

...それだけです!このプロセスを繰り返してセクションを増やすか、さらに一歩進めてヘッダーフッターを追加することもできます。


目次 - carrd docs

Last updated on 5/24/2025@mrbirddev
Loading...