① 「評価」を追加する

1. 編集したいページを「Elementorで編集」で開きます。
2. 左上の「＋」（要素を追加）を押し、「評価」で検索します。
3. 該当するウィジェットをページの入れたい場所へドラッグします。配置済みなら、その部品をクリックします。

② 満点と評価値を入力する

1234

1. 「評価尺度」に満点を入力します。5段階なら「5」です。
2. 「評価」に表示する点数を入力します。
3. 必要に応じて「アイコン」を変更します。
4. 配置を選び、星の数と点数の関係を確認します。

ここを確認：満点と評価値が意図どおりになっている。

③ 見た目と表示を確認する

12

1. 「スタイル」→「アイコン」でサイズと間隔を整えます。
2. 「色」で評価済みの部分、「マークのない色」で残りの部分を設定します。
3. 何を評価した数字か、近くに文章で説明を添えます。

④ スマホで確認して保存する

上部のスマートフォンのアイコンで表示を確認します。「公開」または「更新」で保存し、プレビューや実際のページで動作を確認します。作成途中の場合は下書き保存を使います。

スマホ表示の調整方法 ／ 保存・公開の手順

① 「アラート」を追加する

1. 編集したいページを「Elementorで編集」で開きます。
2. 左上の「＋」（要素を追加）を押し、「アラート」で検索します。
3. 該当するウィジェットをページの入れたい場所へドラッグします。配置済みなら、その部品をクリックします。

② お知らせの内容を入力する

1234

1. 「タイプ」で情報・成功・警告・危険から内容に合うものを選びます。
2. 「タイトル」に短い見出しを入力します。
3. 「コンテンツ」に日付や具体的な案内を入力します。
4. 利用者が消せる案内にするなら「閉じるアイコン」を表示にします。

ここを確認：日時や対象が具体的に書かれている。

③ 見た目と表示を確認する

12

1. 「スタイル」→「アラート」で背景色とサイドボーダーを調整します。
2. 「タイトル」「説明」の色と文字サイズを読みやすくします。
3. 重要な案内は色だけに頼らず、文章でも内容を明示します。

④ スマホで確認して保存する

上部のスマートフォンのアイコンで表示を確認します。「公開」または「更新」で保存し、プレビューや実際のページで動作を確認します。作成途中の場合は下書き保存を使います。

スマホ表示の調整方法 ／ 保存・公開の手順

① 「推薦文」を追加する

1. 編集したいページを「Elementorで編集」で開きます。
2. 左上の「＋」（要素を追加）を押し、「推薦文」で検索します。
3. 該当するウィジェットをページの入れたい場所へドラッグします。配置済みなら、その部品をクリックします。

② 声と紹介情報を入力する

1234

1. 「コンテンツ」に推薦文や感想を入力します。
2. 「画像の選択」で、掲載する写真を選びます。
3. 「名前」に表示名、「タイトル」に肩書きや会社名などを入力します。
4. 必要ならリンクを設定し、画像の位置と配置を決めます。

ここを確認：掲載してよい文章・写真・表示名になっている。

③ 見た目と表示を確認する

123

1. 「スタイル」→「コンテンツ」で文章の色や文字サイズを整えます。
2. 「画像」で写真の大きさを調整します。
3. 「名前」「タイトル」の文字を、本文と区別できるようにします。

④ スマホで確認して保存する

上部のスマートフォンのアイコンで表示を確認します。「公開」または「更新」で保存し、プレビューや実際のページで動作を確認します。作成途中の場合は下書き保存を使います。

スマホ表示の調整方法 ／ 保存・公開の手順

① 「進行状況バー」を追加する

1. 編集したいページを「Elementorで編集」で開きます。
2. 左上の「＋」（要素を追加）を押し、「進行状況バー」で検索します。
3. 該当するウィジェットをページの入れたい場所へドラッグします。配置済みなら、その部品をクリックします。

② 割合と説明を設定する

1234

1. 「タイトル」に「準備の進み具合」などと入力します。
2. 「パーセント」に0〜100の値を入力します。
3. 数値を見せる場合は「パーセント表示」を表示にします。
4. 「内部テキスト」にバーの中へ載せる短い説明を入力します。

ここを確認：数値とバーの長さが一致している。

③ 見た目と表示を確認する

123

1. 「スタイル」でタイトルの文字色を整えます。
2. 「パーセント」の色・背景色・高さでバーを調整します。
3. 「内部テキスト」の色を、バーの上でも読みやすくします。

④ スマホで確認して保存する

上部のスマートフォンのアイコンで表示を確認します。「公開」または「更新」で保存し、プレビューや実際のページで動作を確認します。作成途中の場合は下書き保存を使います。

スマホ表示の調整方法 ／ 保存・公開の手順

① 「カウンター」を追加する

1. 編集したいページを「Elementorで編集」で開きます。
2. 左上の「＋」（要素を追加）を押し、「カウンター」で検索します。
3. 該当するウィジェットをページの入れたい場所へドラッグします。配置済みなら、その部品をクリックします。

② 数値と単位を入力する

1234

1. 「開始ナンバー」に開始値、「終了ナンバー」に表示したい数値を入力します。
2. 数値の前に付ける文字は「番号接頭辞」、後ろの単位は「番号接尾辞」に入力します。
3. 「タイトル」に「導入実績」など、何の数字かを入力します。
4. 「アニメーションの継続時間 (ms)」を設定します。2000msは2秒です。

ここを確認：終了値・単位・タイトルが正しい。

③ 見た目と表示を確認する

123

1. 「スタイル」でタイトルの位置と数字の配置を選びます。
2. 「タイトルギャップ」で数字と説明の距離を調整します。
3. 「番号」「タイトル」で文字色とサイズを整えます。

④ スマホで確認して保存する

上部のスマートフォンのアイコンで表示を確認します。「公開」または「更新」で保存し、プレビューや実際のページで動作を確認します。作成途中の場合は下書き保存を使います。

スマホ表示の調整方法 ／ 保存・公開の手順

① 「タブ」を追加する

1. 編集したいページを「Elementorで編集」で開きます。
2. 左上の「＋」（要素を追加）を押し、「タブ」で検索します。
3. 該当するウィジェットをページの入れたい場所へドラッグします。配置済みなら、その部品をクリックします。

② タブ名と中身を設定する

12

1. 「タブ項目」の「タブ #1」を開き、「タイトル」を「サービス内容」などに書き換えます。
2. 同じように2つ目・3つ目の名前を変えます。項目を増やすときは「タブの追加」を押します。
3. 右側のページで編集したいタブを選び、その内側へ「テキストエディター」や「画像」などを追加します。
4. タブを1つずつ切り替え、それぞれの中身を作ります。左の「タイトル」はタブの名前で、本文の入力欄ではありません。

ここを確認：すべてのタブに正しい本文が入っている。

③ 見た目と表示を確認する

123

1. 「スタイル」の「タブ間の隙間」で、タブ同士の余白を整えます。
2. 「コンテンツからの距離」で、タブ名と本文の間を調整します。
3. 「普通」「マウスオーバー」「有効」を切り替え、選択中のタブが区別できる色にします。

④ スマホで確認して保存する

上部のスマートフォンのアイコンで表示を確認します。「公開」または「更新」で保存し、プレビューや実際のページで動作を確認します。作成途中の場合は下書き保存を使います。

スマホ表示の調整方法 ／ 保存・公開の手順

① 「アコーディオン」を追加する

1. 編集したいページを「Elementorで編集」で開きます。
2. 左上の「＋」（要素を追加）を押し、「アコーディオン」で検索します。
3. 該当するウィジェットをページの入れたい場所へドラッグします。配置済みなら、その部品をクリックします。

② 質問と回答を用意する

124

1. 「アイテム」の「項目 #1」を開きます。
2. 「タイトル」に「予約は必要ですか？」などの質問を入力します。
3. 右側のページでその質問を開き、中に「テキストエディター」を追加して回答を書きます。
4. 「項目を追加」で質問を増やし、同じ手順で回答を入れます。

ここを確認：質問を押すと、対応する回答が開く。

③ 見た目と表示を確認する

12

1. 「スタイル」→「アコーディオン」で項目間のスペースを調整します。
2. 「ヘッダー」で質問部分、「コンテンツ」で回答部分の見た目を整えます。
3. 最初に開く項目などの動作は「コンテンツ」→「インタラクション」で確認します。

④ スマホで確認して保存する

上部のスマートフォンのアイコンで表示を確認します。「公開」または「更新」で保存し、プレビューや実際のページで動作を確認します。作成途中の場合は下書き保存を使います。

スマホ表示の調整方法 ／ 保存・公開の手順