テーマエディタの更新

Shopifyのテーマエディタは、よりスピーディ、パワフルで、より使いやすくなるように再構築されました。

新しいテーマエディタを利用するために何らかの操作を行う必要はありません。ストアで新しいテーマエディタにアクセスできるようになると、最新のテーマエディタ機能を自動的に取得できます。

この更新により、以下に概説する機能へのアクセスが可能になります。これにはUniteで発表されたOnline Store 2.0の他の機能は含まれていません。それらの機能は、数か月後にリリースされるOnline Store 2.0のテーマにて公開されます。

サイドバーの機能拡張

新しいテーマエディタでは、サイドバーのデザインが一新されました。

新しいエディタでは、現在サイドバーに表示されているテンプレートのすべてのコンテンツが、ツリービューで表示されるようになりました。セクションをクリックしてブロックや設定にアクセスする代わりに、展開アイコンを使用してセクションノードを展開しブロックを表示したり、折りたたみアイコンを使用してセクションノードを折りたたみブロックを非表示にしたりすることができます。任意のセクションやブロックをクリックすると、その設定が表示されます。

セクションを展開したり折りたたんだりしてブロックを表示する

サイドバーモード

新しいエディタには、画面をフルに活用できる2つのモードが用意されています。

ダブルサイドバーモードは、幅の広いブラウザーのウィンドウと大画面用で、シングルサイドバーモードは、幅の狭いブラウザーのウィンドウと小画面用です。サイドバーモードによって、エディタ内の設定パネルの表示位置が決まります。

ダブルサイドバーモード

幅が1600ピクセル以上の画面で、ブラウザーのウィンドウが完全に展開されている場合、またはブラウザーのウィンドウが少なくとも幅1600ピクセルまで展開されている場合、2つのサイドバーが表示されます。左側のサイドバーにはメニューパネル、右側のサイドバーには設定パネルが表示されます。

ダブルサイドバーモードでは、設定パネルが画面の右側に表示されます

ヒント: 大きな画面上で、シングルサイドバーモードでテーマエディタを表示するには、設定パネルがメニューサイドバーの上部に移動するか、消えるまで、ブラウザーのウィンドウを狭くしてください。

シングルサイドバーモード

幅の狭いブラウザーでは、テーマプレビューのスペースを確保するために、サイドバーを1つしか表示できません。セクションやブロックを編集するためにクリックすると、サイドバーのメニューパネル上部で設定パネルが開きます。

シングルサイドバーモードでは、設定パネルがメニューパネルのオーバーレイとして表示されます

セクションとブロック

セクションとブロックのリストでは、同一ページ上でセクションのすべてのブロックを確認できるようにデフォルト設定されました。以前のテーマエディタでは、ブロックを表示するためにはセクションを選択する必要がありました。

ヘッダーやフッターを構成するセクションは、デフォルトでは折りたたまれていますが、セクション名の横にある展開アイコンをクリックすると、それらのセクションを表示できます。

ヒント: セクションの設定が見当たらない場合は、そのセクションのブロックを確認してみてください。

セクションを削除する

各項目の設定画面で、テンプレートからセクションまたはブロックを削除できるようになりました。[セクションを削除] ボタンはセクション設定の下部に表示されます。

[セクションを削除] ボタンを使用してセクションを削除する

手順:

  1. テーマエディタのサイドバーで、削除するセクションまたはブロックをクリックします。
  2. [セクションを削除] または [ブロックを削除] をクリックします。
  3. [保存] をクリックします。公開済みのテーマを編集している場合、[公開] をクリックして変更を保存し、ストアで公開します。

ブロックを非表示にする

目のアイコンを使用して、セクションやブロックを非表示にできるようになりました。

[セクションを削除] ボタンを使用してセクションを削除する

テンプレート

テーマエディタのトップバーにあるページセレクターから、すべてのテーマのテンプレートにアクセスできるようになりました。

また、Online Store 2.0のテーマを使用している場合、[新しいテンプレート] オプションをクリックして、ページセレクターから直接新しいテンプレートを作成できるようになりました。

特定のリソースでテンプレートをプレビューする

テンプレートを表示しているときは、ストア内の互換性のあるリソースでテンプレートがどのように表示されるかを確認できます。たとえば、商品テンプレートを表示している場合、ストア内のどの商品でもテストすることができます。

ヒント: ページセレクターの [検索] バーを使用して、テンプレートとリソースを検索することもできます。

手順:

  1. テーマエディタのページセレクターから、プレビューするテンプレートを選択します。
  2. メニューパネルの [プレビュー] セクションで、[変更] をクリックします。
  3. [選択] メニューから、プレビューするリソースを選択します。

操作を元に戻す、やり直す

[元に戻す] ボタンと [やり直す] ボタンは、テーマエディタの右上に移動しました。

テーマエディタのトップバーにある [元に戻す] ボタンと [やり直す] ボタン

ドキュメントを表示する、サポートを受ける、テーマバージョンを確認する

テーマのドキュメントとサポート情報へのリンクは、メニューバーの [詳細] メニューに移動されました。このメニューでは、テーマバージョンと作成者情報を確認することもできます。

以前、この情報には、[テーマアクション] メニューからアクセスできました。

[詳細] ボタンを使用して、テーマ情報にアクセスします。

Shopifyで販売を開始する準備はできていますか?

無料体験を試す