テンプレート編集のコツ
テンプレートは柔軟に編集できるよう設計されていますが、出品者様が制作しているため、テンプレートごとに使用されている機能や作り込み方が異なります。ここでは、編集をスムーズに進めるために使えるツールと編集のコツをご紹介します。
テンプレートごとに構造が変わるため、個別のテンプレートに関する疑問などは、テンプレートデザイナー詳細ページの「メールボタン」から出品者へ直接ご相談ください。
Tips：テンプレートとは
テンプレートとは、あらかじめデザイン制作されたひな形です。厳正な審査を通過したハイクオリティなテンプレートであるため、テキストや画像を変えるだけでスピーディーにクオリティの高いWebサイトを公開することができます。
テンプレートの選び方と購入方法については、テンプレートではじめるノーコードWeb制作。利用方法とよくある質問 | Studio Blogで詳しく解説しています。
便利ツール1：ボックスが選択しやすいダイレクト選択
画像やテキストを変更したい時にうまく選択できないことがあります。そんな時は、ダイレクト選択（Mac: ⌘キー、Windows: Ctrlキーを押しながらカーソルをボックスに乗せる）を使うと目的のボックスを直接選択することができます。
便利ツール2：ボックスの詳細がわかるレイヤーパネル
レイヤーパネル（Mac: ⌘ + 2、Windows: Ctrl + 2）を開くと、ボックスがレイヤーとして一覧表示されています。ボックスの種類によって編集方法が変わるため、レイヤーパネルで事前にどんなボックスなのか判断しておくと編集がスムーズになります。
レイヤーには名称が設定されているため、レイヤーからどんな役割のボックスなのか判断することができます。
【基本編】テンプレートを編集してみよう
無料テンプレートの「TUNE | オウンドメディア」を使って編集してみましょう。
無料テンプレートでプロジェクトをはじめる
プロジェクト一覧から[新しいプロジェクト]を選択します。
テンプレートを探すから、[ブログ&メディア]を選択します。
「TUNE | オウンドメディア」の、[このテンプレートではじめる]をクリックします。
プロジェクト名を入力し、「作成」をクリックします。
テキストや画像を差し替える
Webサイト内のテキストや画像をお好みのものに変更します。
テキストや画像の変更手順
編集したいボックスを選択します。
ダブルクリックで直接編集するか、ボックス設定パネルで編集します。
Tips：選択したボックスの周りに薄い青や紫の色が付いている場合は、リストやコンポーネントなので編集方法が異なります。この後のセクションで編集方法をご紹介します。
紫色が表示される場合（コンポーネント）
選択時に紫色が表示されるボックスはコンポーネントです。
コンポーネントの編集手順
紫色のボックスを選択します。
ダブルクリックまたはレイヤーパネルの[コンポーネント編集]をクリックして、編集モードに切り替えて編集します。
注意：
1つのコンポーネントを編集すると、配置されたすべてのコンポーネントに変更が自動で反映されます。
テキストや画像がプロパティとして登録されている場合は、コンポーネントごとに表示に変化をつけることができます。コンポーネントについて詳しくは、コンポーネントをご覧ください。
薄い青が表示される場合（リスト）
薄い青色が表示される場合、そのボックスはリストです。リストは3種類あり、それぞれ編集方法が異なります。表示されるアイコンとレイヤーパネルの内容からどの種類か判断して編集を行いましょう。
カルーセルアイコン（リストのカルーセル/CMSカルーセル）
カルーセルアイコンがある場合は、リストかCMSのカルーセルです。レイヤーパネルを開き詳細を確認します。
レイヤーパネル上にリストデータがある場合
レイヤーパネルにデータがある場合、レイヤー上でタイトルや画像の編集が可能です。
リストカルーセルの編集手順
リストを選択します。
レイヤーパネルを開き、編集します。
レイヤーパネルにデータがない場合
レイヤーパネルにデータがない場合、CMSカルーセルであると判断できます。この場合、CMSダッシュボードに移動してタイトルや画像を編集します。CMSアイテムについては、アイテムをご覧ください。
CMSカルーセルの編集手順
リストに紐づくモデル名を確認します。
CMSダッシュボードを開きます。
モデルを選択し、その中のアイテムを編集します。
リストアイコン（静的リスト）
リストアイコンが表示されている場合、静的リストであると判断できます。この場合、レイヤー上でタイトルや画像の編集が可能です。リストについては、リストの作成と管理方法をご覧ください。
静的リストの編集手順
リストを選択します。
レイヤーパネルを開き、編集します。
リストアイコン+チップの表示（CMSリスト）
リストアイコンとチップが表示されている場合、CMSリストであると判断できます。この場合、タイトルや画像の編集はCMSダッシュボードで行います。CMSアイテムについては、アイテムをご覧ください。
CMSリストの編集手順
リストに紐づくモデル名を確認します。
CMSダッシュボードを開きます。
モデルを選択し、その中のアイテムを編集します。
デザインを変更したい場合
通常のボックスと同様に色やサイズなどのデザインを編集することができます。コンポーネントやリストの場合は、色のついた枠部分をダブルクリックするか、選択した状態でEnterを押すと編集できる状態になります。
以上がテンプレート編集のコツとテキストや画像の編集方法です。次の記事では、リンクやマップの変更やリストへのアイテム追加方法などをご紹介します。
次の記事：【応用編】テンプレートの編集方法
コレクション目次