様々な要素を変換する方法

Webflowの要素変換機能を使用すると、ブロック要素、タイポグラフィ要素、インラインテキスト要素など、さまざまな要素タイプを最初から再構築することなくシームレスに変換することが可能です。

今回はそれぞれの要素を変換する方法をご紹介します。

‍

ブロック要素を変換する方法

divブロック、コンテナー、グリッド、フレックスボックスなどのブロック要素は、キャンバス上のメニューまたはQuick findを使用して他のブロック要素に簡単に変換できます。

1. キャンバス上で変換したいブロック要素を選択します
2. 要素を右クリック
3. Convert toにマウスを合わせる
4. 利用可能な変換リストから希望するブロック要素タイプを選択します

あるいは、Quick findを使用してブロック要素を変換することもできます。

1. Quick findを開くには、 Control + E (Windows) またはCommand + E (Mac)を押します。
2. 「Convert to」に続けて、希望するブロック要素タイプの名前を入力します（例：「グリッドに変換」）
3. Enterを押します

‍

タイポグラフィ要素を変換する方法

見出し、段落、ブロック引用などのタイポグラフィ要素は、既存のコンテンツとスタイルを維持しながら他のタイポグラフィ要素に変換できます。

1. キャンバス上で変換したいタイポグラフィ要素を選択します
2. 要素を右クリック
3. Convert toマウスを合わせる
4. 利用可能な変換のリストから希望するタイポグラフィ要素タイプを選択します

ブロック要素の変換と同じ手順に従って、クイック検索機能を使用してタイポグラフィ要素を変換することもできます。

‍

インラインテキスト要素を変換する方法

太字、斜体、スパンタグなどのインラインテキスト要素は、タイポグラフィ要素内の他のインラインテキスト要素に変換できます。

1. 変換したいインラインテキスト要素を含むタイポグラフィ要素をダブルクリックします
2. インラインテキスト要素を選択する
3. 選択したインラインテキスト要素を右クリック
4. Convert toにマウスを合わせる
5. 利用可能な変換のリストから、希望するインラインテキスト要素タイプを選択します。

インライン テキスト要素に使用できる変換は、選択したテキストの現在の書式設定によって異なります。

たとえば、テキストがすでに太字タグで囲まれている場合、キャンバス上のメニューに太字オプションは表示されません。

‍

デザインの一貫性を保ちながらワークフローを効率化しながら、Webflowで要素を変換するより簡単な方法でパフォーマンスを向上させましょう。

‍