はじめに

ようこそペライチへ！

このスタートガイドは「商品やサービスをネットで売りたい」という方が、つまずかずに最短ルートでゴールへ到達できるよう設計しています。
PC 操作が得意でなくても、ガイドに沿って順番に進めれば 最短30分程度 で公開までたどり着けます。

あらかじめ用意しておくとスムーズに進められるもの

準備ができたら Step 1「ショップ・商品を登録しよう」 へ進みましょう。

Step 1 ショップ・商品を登録しよう

ネットショップの出発点となる「ショップ」と「商品」を登録しましょう。
内容は、あとからいつでも編集できます。
気負わずに、まずは試しに入力してみるところから始めてみましょう。

 

ショップの作成

ショップ作成では、初めにチュートリアルが表示され、画面の案内に沿って順にショップ名や基本情報を入力するだけで、スムーズにショップが自動作成されるためとても簡単です。
深く考えすぎず、わかる範囲で入力してみればOKです。
内容はあとからいつでも変更できます。

 詳しくはこちらをご覧ください。

商品の登録

商品の名前や価格なども、画面の流れにそって順番に入力していくだけで登録できます。
写真や説明文などはあとから追加・編集できるので、まずは必要最低限の情報からでOKです。

1. 商品を追加する をクリック
   
2. 商品の種類、名前、金額、消費税率の設定、商品の在庫数、などの項目を入力して、「保存して一覧に戻る」をクリックで、商品の登録は完了です。
   

商品の品目（SKU）設定方法

商品の品目（SKU）を設定することで、商品に色やサイズ、セット内容などのバリエーションを設定できます。
商品品目（SKU）の設定方法はこちら。

商品詳細ページについて

商品の詳細を確認するためのページを自動で作成することができます。
商品の品目（SKU）を設定している場合は必要になります。
商品詳細ページの設定方法はこちら。

商品一覧ブロックの設定

ページ作成時に「全商品一覧ブロック」を使用した際に、この商品を表示するかどうかを設定します。特定の人だけに見せたい商品（会員限定・URL限定など）の場合、あえて一覧に出さず、ピンポイントに紹介することで注目を集めたいとき、など商品を柔軟に見せ分けたり、販売戦略に応じてコントロールしたりできます。
商品一覧（決済）全商品一覧ブロック設定方法はこちら。

次はサイトのデザインを決める大事なステップです。
販売に合ったテンプレートを選ぶことで、サイトの雰囲気がぐっと決まります。
準備ができたら、Step 2「販売に合ったテンプレートを選ぼう」へ進んで、どんなデザインにするか決めましょう！

Step2　販売に合ったテンプレートを選ぼう

ショップの見た目を決めるテンプレートを選びましょう。「どれを選べばいいのか不安…」という方も大丈夫。あとから内容や見た目は自由に変更できます。
気になるデザインを見つけたら、まずは試してみることから始めましょう！

テンプレート一覧の使い方

テンプレート一覧では、用途や雰囲気に合ったデザインを選ぶことができます。
下の画像では、テンプレート検索や選び方のポイントを番号付きで紹介しています。
はじめに一通り目を通しておくと、スムーズに選べるようになります。

1. キーワード検索
   業種や機能、テンプレートに関するキーワードで検索できます。（例：美容、予約、決済など）
2. 絞り込み
   「用途・目的」「業種」「スタイル」のカテゴリでの絞り込みが可能です。たとえば、用途・目的「店舗・施設の紹介」、業種「カフェ・喫茶店」、スタイル「かわいい」など、組み合わせて検索することもでき、目的に合ったテンプレートを効率よく探せます。
   
3. ページテンプレート
   1枚もののページのテンプレートが表示されます。
4. サイトテンプレート
   複数のページを組み合わせたサイトのテンプレートが表示されます。
5. 白紙から作成する
   テンプレートを使用せずに白紙から作成したい方はこちらから。
   「すでにページ構成やデザインのイメージがある」「自分の手で１から作りたい」という方には、白紙からの作成がおすすめです。

テンプレート選択後に変えられる部分

テンプレートを選択後でも以下の部分が変更可能です。

 

目的別おすすめテンプレート

決済機能をご利用いただいているペライチユーザーに人気の決済機能入りのテンプレートを紹介します。テンプレートが決まらない場合はこちらを選択しましょう。

 

セミナーや講座を販売する：自己啓発セミナー

習い事や教室のコースを販売する：ハンドメイド教室

物販を行う：オンラインショップ

イベントのチケットを販売する：美術館_イベント

テンプレートが決まったら、いよいよ中身を作っていきます。
準備ができたら、Step 3「ページ構成を考えよう」へ進みましょう。

Step 3　ページ構成を考えよう

どんな内容を、どんな順番で見せるかでホームページの伝わり方が変わってきます。
よく使われる構成をチェックしながら、自分に合ったページの流れをざっくりイメージしてみましょう。

ショップによくあるページ項目

商品販売用ページにおける「よく使われるページの項目」は以下のような構成が多いです。
目的や業種によって異なるので、ご自身に希望に合わせてカスタマイズしてください。

 

複数ページ（サイト）の作り方

サイト管理の作成方法についてはこちら。

構成が固まってきましたね。
どんな流れで伝えるかを整理できたら、いよいよ中身を入れていくステップです。
Step4「コンテンツを入力しよう／画像を差し替えよう」に進みましょう。

Step 4　コンテンツを入力しよう／画像を差し替えよう

ここからは、実際に文章を入れたり画像を変えたりしていく作業です。難しいことはないので、まずは触ってみながら、少しずつページを自分の形にしていきましょう！

ページ編集画面の使い方

1. マイページへ戻る
   クリックするとペライチのマイページに移動します。
2. メニューを折りたたむ
   クリックすると左メニューが折りたたまれます。
3. 保存する
   クリックすると作成中のページが保存されます。 
4. 公開する／非公開にする
   クリックするとページの状態（公開／非公開)を切り替えられます。 
5. ページ情報編集
   クリックするとページ情報編集の画面が表示されます。
   ページ情報編集画面の詳細はこちら
6. プレビュー
   クリックするとプレビューの画面が表示されます。
   各デバイス（PC、タブレット、スマホ）でどのように表示されるかを確認できます。
   ページを閲覧するデバイスによって実際の見え方が異なる場合がございます。  
   こちらの動画(各デバイスサイズでの確認)で詳しく説明しています。
7. テーマ変更・テーマCSS変更
   クリックすると右側にテーマが表示されます。
   テーマ変更の詳細はこちら
8. テーマカラー変更
   クリックすると右側にテーマカラー変更の画面が表示されます。
   テーマカラーの詳細はこちら
9. フォント変更
   クリックすると右側にフォント変更の画面が表示されます。
   フォントの変更方法の詳細はこちら
10. アニメーション
    スクロール時のブロック表示にアニメーション効果を設定できます。
    アニメーションの詳細はこちら
11. 操作を1つ戻す／操作を1つ進める
    編集の画面で行った操作を一つ前に戻したり、進めることができます。
    「操作を1つ戻す」をクリックすると1回分の操作が取り消されます。
    「操作を1つ進める」をクリックすると戻した操作を1つ進めます。 
    こちらの動画(操作のやり直し機能)で詳しく説明しています。
    ※この機能はブロックの操作のみ適用されます（ブロックの追加・削除、テキストや画像の変更など）。左側サイドバーの機能には適用されません。
    なお、一度編集画面を離れてしまった場合、こちらのボタンは無効になり、ご利用いただけません。
12. デバイスアイコン
    各デバイス（PC、タブレット、スマホ）の表示に切り替えできます。
    各アイコンをクリックすると、それぞれのデバイスで表示させた状態を確認しつつ編集できます。
    ページを閲覧するデバイスによって実際の見え方が異なる場合があります。 
    こちらの動画(各デバイスサイズでの確認)で詳しく説明しています。
13. 公開ページを見る
    公開ページを見ることができます。別タブで開きます。
14. マイページへ戻る
    クリックするとペライチのマイページに移動します。
15. ページ名
    設定したページ名が表示されます。
16. URL
    URLが表示されます。公開中の場合は、「公開中」という表記になります。
    
17. ブロック挿入ボタン
    新しいブロックが挿入されます。詳細はこちらをご確認ください。
18. 背景設定ボタン
    背景の設定ができます。詳細はこちらをご確認ください。
19. ブロックの設定
    ブロックの表示切り替えや表示位置の設定ができます。
20. 質問する
    クリックするとお問い合わせなどのサポートが表示されます。

テキストの編集方法

1. 編集したいテキストにカーソルを合わせると「編集」ボタンが表示されるのでクリック。
   
   
2. ブロックの中の文字列をクリックし、文字の編集画面で設定する。
   
   

 詳しくはこちらをご覧ください。

画像の差し替え方（背景画像）

1. 変更したい画像の「背景設定」をクリック。
   
   
   
2. 背景画像の設定画面が開きます。
   
   

PCとスマートフォンで表示する画像を分ける場合は、それぞれの画像変更をクリック。
PCもスマートフォンも同じ背景画像を表示する場合は、「画像をまとめて変更」をクリックします。

詳しくはこちらをご覧ください。

画像の差し替え方（背景画像以外）

1. 変更したい画像の「編集」をクリック。
   
2. マイライブラリをクリック。
3. 「画像を選択してアップロード」ボタンをクリック。
   
4. アップロードしたいファイルを指定し「開く」ボタンをクリック。
5. 画像がマイライブラリに入ったことを確認する。
6. 該当の画像をクリックして「保存 」で画像が反映される。

詳しくはこちらをご覧ください。

テキストや画像が入ってページの全体像が見えてきたと思います。 次はデザインを整えて、見やすく印象的なページに仕上げていきましょう。 Step 4「デザインを整えよう」へ進んでください。

Step 5　商品とページをつなげよう

商品ページを作成したら、決済ブロックを使って商品とページをつなげます。
「全商品」「単品」「ピックアップ商品」など、簡単に選んで配置できるので、あまり難しく考えずにチャレンジしてみてください。 これで、商品ページと購入の流れがしっかりつながりますよ！

決済ブロックの種類と使い方

ペライチには、商品の見せ方や販売方法に合わせて使える「決済ブロック」がいくつか用意されています。「どれを使えばいいか分からない…」という方もご安心を。
ここでは、それぞれのブロックの特徴と使い方をわかりやすく紹介します。

1. マイページから、ショップとして使用するページの「ページ編集」をクリックし、編集画面を開く。この時、「ショップ設定中」と表示されていることも確認する。
   
2. 「購入ボタン」のブロックを追加したい場所で「ブロックを挿入」ボタンをクリックする。
   
3. ブロックの追加画面の左側で「商品一覧（決済）」、もしくは「商品・パーツ（決済）の項目から、お好きなブロックを追加する。
   ▼商品一覧（決済）
   
   ▼商品・パーツ（決済）
   

詳しくははこちらをご覧ください。

「商品一覧（決済）」：全商品一覧ブロック の使い方

商品一覧（決済）全商品一覧ブロックを設定した場合、作成済みの商品全てを自動で反映、
もしくは、条件に合った商品を自動で反映できます。
※作成済みの商品全てをページに反映させる場合、商品の設定は不要です。

詳しくこちらをご覧ください。

「商品・パーツ（決済）」ブロックの使い方

商品・パーツ（決済）ブロックの購入ボタンに選択した商品の紐づけができます。

詳しくはこちらをご覧ください。

「商品一覧（決済）」：ピックアップ商品一覧ブロックの使い方

商品一覧（決済）ピックアップ商品一覧ブロックを設定した場合、作成済み商品の中から選択した商品のみ、ページに反映されます。

詳しくはこちらをご覧ください。

商品とページの紐付けまでが完了しました。ここまでくると、完成がぐっと近づいてきますね。
Step 6「デザインを整えよう」へ進みます。

Step 6　デザインを整えよう

次は見た目の仕上げ。配色やフォントを整えるだけで、ページ全体の雰囲気がぐっと良くなります。
まずは気になるところから少しずつ変えてみましょう！

左メニューの使い方

ページのデザインを編集したい場合は、左メニューから可能です。

①テーマの変更方法

1. ページ編集画面の、サイドバーから「テーマ変更」をクリック。
   
2. 好みのテーマを選択する。
   
   

詳しくはこちらをご覧ください。

②カラーの変更方法

1. ページ編集画面の、サイドバーから「テーマカラー」をクリック。
2. 変更したい色をクリック。
   

詳しくはこちらをご覧ください。

③フォントの変更方法

1. ページ編集画面の、サイドバーから「フォント変更」ボタンをクリック。
   
2. 任意のフォントを選択してクリック。
3. フォント変更が適用されているか確認する。
4. 編集の画面左上の「保存する」ボタンをクリック。

詳しくはこちらをご覧ください。

④アニメーションの追加方法

1. ページの編集画面の、サイドバーから「アニメーション」をクリック。
   
   
2. 詳細設定スライドが表示される。
   
   
3. お好みのアニメーションを選択して「設定する」をクリックすると、設定が完了。
   
   

詳しくはこちらをご覧ください。
デザインの調整まで完了しました。
ここまでくると、完成がぐっと近づいてきますね。
公開前に一度、全体を見直しておきましょう。
Step 7「公開前にチェックしよう」へ進みます。

Step 7　公開前にチェックしよう

公開前に確認しておくべきポイントがあります。
以下を参考にサクッと確認してみましょう！

プレビューの使い方（PC・スマホ両方）

1. 編集画面の左側メニュー一覧の中にある「プレビュー」をクリック。
   
   
2. 上部のPC、タブレット、スマホの各アイコンをクリックしてそれぞれのデバイスの表示を確認する。
   

詳しくはこちらをご覧ください。

誤字脱字やリンク切れがないか確認

よくあるリンクの間違い
・ボタンを設置してるのにリンクが設置されていない
・リンク先のURLが間違っている

SNSシェア画像（OGP）の設定

SNSでシェアされたときに表示される画像やタイトルは、第一印象を大きく左右します。
OGP（Open Graph Protocol）設定を活用して、目に留まる見た目に整えておきましょう。
設定はかんたん。ブランドや内容が伝わるように、適した画像を用意しておくのがおすすめです。

1. ページの編集画面の「ページ情報編集」をクリック。
   
2. ページ情報編集画面の「OGP(SNSシェア設定)」のタブを選択。
   
3. 各項目を設定する。

詳しくはこちらをご覧ください。

ファビコンの設定

ファビコンは、ブラウザのタブやブックマークに表示される小さなアイコンです。細かい部分ですが、ブランドやお店の印象をよりしっかりと伝えることができます。専用の画像を用意して、細部までこだわったページに仕上げましょう。

詳しくはこちらをご覧ください。

最終チェックも終われば、いよいよ公開の準備が整いました。
仕上がったページを、世界に向けて届けましょう。
Step 6「ホームページを公開しよう」に進んでください。

Step 8　ページを公開しよう

「公開」ボタンを押す前に必要な設定

いよいよページの公開目前です！
「公開」ボタンを押す前に行っておきたい基本的な設定を再度確認しておきましょう。
ここを押さえておくことで、見てもらいたい人にしっかり届くページになります。
基本設定についてはこちらをご覧ください。

独自ドメインの設定方法

より本格的に運用したい方や、信頼感のあるURLにしたい方は、独自ドメインの設定がおすすめです。
ペライチでは、外部のドメインサービスを使わずに、取得したいドメインを検索して選択するだけで、ペライチ用のドメインの設定が完了した状態でドメインを取得できます（ドメイン取得には別途費用がかかります）。
設定手順はシンプルなので、ガイドに沿って進めてみましょう。
詳しくはこちらをご覧ください。

ここまで出来ればホームページはしっかりと形になります。
ご自身のペースで、公開まで楽しみながら取り組んでみてくださいね！

公開後にやっておきたいこと集

アクセス解析の設定

詳しくはこちらをご覧ください。

基本的なSEO設定（タイトル・ディスクリプション）

詳しくはこちらをご覧ください。

サーチコンソール連携

詳しくはこちらをご覧ください。