Washlora — マスターガイド

インストールとニッチのインポートから、編集、予約、サービスショップ、AI Studio、公開までを、手順に沿って解説する完全版のドキュメントです。

ドキュメントホーム › マスターガイド

動画で学びたい方へ。Washloraの全シリーズをYouTubeで公開しています(全11話)。YouTubeで再生リスト全体を開く

クイックスタート

ダウンロードから稼働するサイトまでの 6 つのステップです。各ステップの詳細は、以下で説明します。

  1. Washlora テーマ(washlora-theme.zip)をアップロードして有効化します。
  2. Washlora Core をインストールして有効化し、続いて無料の WordPress Importer をインストールします。
  3. 使用するエディター(Elementor、WPBakery、Classic Editor。Gutenberg は標準搭載です)に加え、WooCommerce と Contact Form 7 をインストールします。
  4. Appearance → Import a niche を開き、105 のニッチからひとつを選択します。
  5. Import selected niche をクリックし、Pages を開いて、ホームレイアウトとエディター版を選択します。
  6. サンプルコンテンツを置き換えます:Niche identity、メニュー、サービス、価格、予約、連絡先の詳細。
ステップ 1

ステージング環境とホスティングの準備

まずステージング環境で作業してください。Washlora には、WordPress 6.6 以降と PHP 8.0 以降が必要です。

  1. 復元可能なデータベースとファイルのバックアップを取得します。
  2. ホスティング会社に、256 MB 以上の PHP メモリと、インポート用に約 300 秒の実行時間を依頼してください。
  3. アップロード上限を、アップロードする ZIP ファイルのサイズより大きく設定します。
管理画面のパス: Tools → Site Health → Info

詳細:インストールと要件 · ホスティングとトラブルシューティング

ステップ 2

テーマとプラグインのインストール

インストール用のテーマ ZIP をアップロードし、続いて補助プラグインと、使用予定のエディターのみをインストールします。

  1. washlora-theme.zip(Washlora テーマ)をアップロードして有効化します。
  2. 必須の補助プラグインである Washlora Core をインストールして有効化します。
  3. 無料の WordPress Importer をインストールします。
  4. Elementor、WPBakery、Classic Editor(Gutenberg は標準搭載)をインストールします。必要に応じて、WooCommerce と Contact Form 7 もインストールします。
管理画面のパス: Appearance → Themes → Add New / Plugins → Add New

詳細:インストールと要件

EP 1 · Washlora: Laundry & Dry Cleaning WordPress Theme with WooCommerce (105 Demos) · 5:18 · YouTube

ステップ 3

ニッチのインポート

105 のニッチからひとつを選びます。それぞれに、3 種類のホームレイアウトが 4 つのエディター版で用意されています。

  1. Appearance → Import a niche を開き、ニッチを選択します。
  2. Download demo images はチェックしたままにするか、コンテンツのみをインポートする場合はチェックを外します。
  3. Import selected niche をクリックし、ログを確認します。
  4. Pages を開き、ホームとエディター版を選んで、Settings → Reading でフロントページを設定します。
管理画面のパス: Appearance → Import a niche

詳細:ニッチのインポート

105 ニッチのコレクション105 ニッチのコレクション
ライブの Demos ページで、ニッチ、ホームレイアウト、エディターの選択肢を閲覧できます。
ステップ 4

4 つのエディターのいずれかで編集

Gutenberg、Elementor、WPBakery、Classic Editor のいずれかを選び、そのページ版を使い続けます。各版は別々のページであり、変換されたものではありません。

  1. Gutenberg:Washlora Section ブロックを編集し、リストビューで並べ替えます。
  2. Elementor:キャンバスまたはナビゲーターで、Laundry セクションのウィジェットを編集します。
  3. WPBakery:行と列の中にある Washlora Section コンポーネントを編集します。
  4. Classic:エディターの下にあるセクションコントロールを使用し、[laundry_classic_sections] は残しておきます。
管理画面のパス: Pages → All Pages

詳細:4 つのページエディターでの編集

ホームレイアウトとエディターの切り替えホームレイアウトとエディターの切り替え
ネイティブデモページの各エディター版をプレビューします。
ステップ 5

ブランド、カラー、メニュー

まずアイデンティティ、次に見せ方、最後に全体のデザインの順に設定します。ネイティブのニッチページには、独自のアイデンティティとデザインの階層があります。

  1. Brand、Tagline、Phone、Email、Hours、Area、About とカラーを Niche identity で設定します。
  2. コンテンツ幅、角の丸み、セクション間隔を Niche design で調整します。
  3. 全体のヘッダー、フッター、レイアウト、メニューのオプションには、Design Studio と Washlora Options を使用します。
  4. メニューのラベルとリンク先を更新します。
管理画面のパス: Appearance → Niche identity / Niche design · Washlora AI Studio → Design Studio

詳細:ブランディング、デザイン、コンテンツ

ステップ 6

サービス、価格、画像

サンプルのサービス、価格、写真を、実際の事業情報に置き換えます。

  1. エディターで Services ページを編集し、service コンテンツタイプでサービスレコードを管理します。
  2. オンライン販売をする場合は、WooCommerce の実際の価格、税金、在庫状況を設定します。
  3. サンプルの写真を置き換え、わかりやすい代替テキストを追加します。
管理画面のパス: Pages → Services · Products → All Products

詳細:ブランディング、デザイン、コンテンツ

Service ledger セクションService ledger セクション
Tent & Awning Care デモの service-ledger セクションです。

EP 6 · Every Page Included: Services, Pricing, About & Contact · 4:36 · YouTube

ステップ 7

予約、集荷、配達

予約ページはリクエストを受け付けます。リクエストは、支払い済みまたは確定済みの注文ではありません。

  1. 予約ページには、予約機能のセクションを残しておきます。
  2. サンプルのサービスエリアと営業時間を置き換えます。
  3. Submit a test request on staging and confirm that the request record is stored.
  4. ワークフローに合わせて、Pickup Slots、Garment Items、Delivery Routes を確認します。
管理画面のパス: Pages → Booking

詳細:予約、集荷、オペレーション

集荷・配達リクエストフォーム集荷・配達リクエストフォーム
実際のリクエストフォームです。お客様のデータは送信していません。

EP 7 · Laundry Pickup & Delivery Booking Form in WordPress (Built-in) · 4:15 · YouTube

ステップ 8

ショップと決済

Commerce Studio は、WooCommerce ネイティブの上にランドリーサービスストアを追加します。

  1. Products でサービスを編集します。自社で提供できるサービスの詳細のみを入力してください。
  2. 必要に応じて、ショップのショートコード [laundryes_commerce_store] または [laundryes_woocommerce_store niche="laundromat"] を使用します。
  3. ご自身の決済プロバイダーを設定します。ニッチをインポートしても、ゲートウェイは有効になりません。
  4. 公開前に、テスト注文を完了します。
管理画面のパス: Products · WooCommerce → Settings → Payments · WooCommerce → Settings → Products → Washlora shopping

詳細:Commerce Studio とショップ

EP 8 · WooCommerce Laundry Shop: Search, Filters, Quick View & Compare · 4:15 · YouTube

その他の動画チュートリアル

ステップ 9

AI Studio:ジェネレーターとアシスタント

インストール済みのテンプレートから、編集可能なページの下書きを作成します。外部の AI API キーは不要です。

  1. 管理者として AI Website Generator を開き、事業名、ニッチ、エディター、ホームレイアウトを入力します。
  2. ウェブサイトのプランをプレビューし、警告を確認します。
  3. 下書きを作成し、ひとつずつ確認して、確認後にのみ公開します。
  4. ホームページとメニューは、ご自身で割り当ててください。生成されたメニューは自動では割り当てられません。
管理画面のパス: Washlora AI Studio → AI Website Generator / AI Theme Assistant

詳細:AI Studio

ジェネレーターのプランニングデモジェネレーターのプランニングデモ
公開プランニングデモです。下書きを作成するのは管理者のワークフローです。

EP 10 · Laundry Checkout with Pickup Fields, Website Generator & Docs · 4:26 · YouTube

その他の動画チュートリアル

ステップ 10

スライダー、言語、品質チェック

公開前に、ヒーローセクション、オプションのスライダー、翻訳、右から左のレイアウト、アクセシビリティを確認します。

  1. ネイティブのヒーローセクションはページエディターで編集します。ページに実際にスライダーが埋め込まれている場合にのみ、スライダープラグインを使用してください。
  2. サイトの言語を選択し、翻訳したコンテンツを用意します。
  3. RTL、小さいスマートフォン、キーボードフォーカス、フォームのラベルをテストします。
管理画面のパス: Settings → General

詳細:言語、RTL、アクセシビリティ

ステップ 11

公開と運用の維持

サンプルの値をすべて削除し、実際の業務ルールをテストして、バックアップを取ってから公開します。

  1. サンプルの名前、例の住所、電話番号、価格、ポリシーを置き換えます。
  2. 予約、お問い合わせ、カート、チェックアウトを、デスクトップとモバイルでテストします。
  3. キャッシュをクリアし、ログアウトした状態で公開サイトを確認します。
  4. カスタムコードは子テーマに保存し、アップデートはステージング環境でテストします。

詳細:公開、アップデート、サポート