表町ホームページ
表町ホームページ
表町ホームページ
表町ホームページ
加盟店TOPページ編集の説明
加盟店TOPページ編集の説明
加盟店TOPページ編集の説明
加盟店TOPページ編集の説明
1 ページ 1 ページⅠ．はじめに
１. 店舗ページの説明
２. 編集画面へのログイン
３. 編集画面メニューの説明
Ⅱ．情報の編集方法
１. 編集の大まかな流れ
２. PR情報の編集方法
１） PR情報編集画面の表示
２） 文章の変更方法
３. 店舗情報の編集方法
１） PCに画像を準備する方法
２） 店舗情報編集画面の表示
３） 画像を貼り付ける方法
４） 文章の変更方法
４. 新着情報の編集方法
１） PCに画像を準備する方法
目次
１） PCに画像を準備する方法
２） 新着情報編集画面の表示
３） 画像を貼り付ける方法
４） 文章の変更方法
５. 画像情報の編集方法
１） PCに画像を準備する方法
２） 画像情報編集画面の表示
３） 画像を貼り付ける方法
４） 文章の変更方法
Ⅲ．その他編集方法
１. 文字サイズ、文字色の変更方法
１） 文字サイズの変更方法
Ⅰ- １. 店舗ページの説明
情報１
情報１
情報１
情報１
情報２
情報２
情報２
情報２
情報３
情報３
情報３
情報３
画像①
画像①
画像①
画像①
画像②
画像②
画像②
画像②
情報４
情報４
情報４
情報４
3 ページ 情報１ … 新着情報：編集可能な部分でセールや新商品などを設定できます 情報２ … PR情報 ：編集可能な部分でお店のPRなどを設定できます 情報３ … 店舗情報 店舗画像：編集可能な部分で店舗の画像を設定できます 詳細情報：編集はできません 変更の場合は別途申請が必要です変更の場合は別途申請が必要です変更の場合は別途申請が必要です変更の場合は別途申請が必要です 情報４ … 画像情報：編集可能な部分で画像と文章を設定できます 【画像ファイル一覧】 ※）サイズと縮小サイズは目安です image2.jpg 500px×340px 情報４_画像② 80% 80% 500px×340px 画像名 shop.jpg 情報１_画像 情報３_画像 縮小サイズ 60% なし image1.jpg 情報４_画像① recent.jpg サイズ 280px×340px 510px×340px情報４
情報４
情報４
情報４
3 ページ【事前に準備するもの】 ・ログインするには、事前に各町のHP担当者様より配布されている以下のようなログイン情報が必要となります。 ① ログイン画面を表示し、専用の編集画面にログインします。 ※ログイン画面を表示する方法は、以下の２通りあります。操作しやすい方法で表示してください。 ※ログイン画面を表示する方法は、以下の２通りあります。操作しやすい方法で表示してください。※ログイン画面を表示する方法は、以下の２通りあります。操作しやすい方法で表示してください。 ※ログイン画面を表示する方法は、以下の２通りあります。操作しやすい方法で表示してください。 方法１ 店舗のHPの右下のアイコンよりログインメニューを表示し、ログインする 1）ご自身の店舗HPを表示し、右下の「QHMQHMQHM」の文字をクリックします。QHM
Ⅰ- ２. 編集画面へのログイン
喫茶
喫茶
喫茶
喫茶 ○○○
○○○
○○○
○○○
2）ログイン画面が表示されます。喫茶
喫茶
喫茶
喫茶 ○○○
○○○
○○○
○○○
－－－ 省略 －－－ この「 この「 この「 この「QHM」を」を」を」を クリックします クリックしますクリックします クリックします方法２ URLを指定してログインメニューを表示し、ログインする 1）事前に準備したログイン情報より、「ログインURL」をWEBブラウザに入力し、Enterキーを押下します。 2）ログイン画面が表示されます。 ② ユーザ名、パスワードを入力してください 事前に準備したログイン情報より、「ユーザ名」「パスワード」を入力し、「Enter」ボタンを押下します。 事前に準備したログイン情報より、「ユーザ名」「パスワード」を入力し、「Enter」ボタンを押下します。 ユーザ名 ユーザ名ユーザ名 ユーザ名 パスワード パスワード パスワード パスワード 5 ページ
トップへ：店舗ページが表示されます 編集：編集画面に移動します 添付：画像変更画面に変更されます このページの：バックアップ以外は使用しないでください サイトの：使用しないでください ツール：使用しないでください 設定：使用しないでください
Ⅰ- ３. 編集画面メニューの説明
ログアウト：編集を終了します【文章を変更する場合】 ① 編集画面を表示します ② 文章を変更します ③ プレビューを表示して確認します 再度、変更が必要な場合は、②に戻ります ④ 更新します 【画像を変更する場合】 ＜画像の前準備＞ ① 店舗ページに載せたい画像ファイルをPCに保存します ② 添付したい場所（情報１、情報３、情報４）に応じて、①のファイル名を変更します ※）Ⅰ－１. 店舗ページの説明の【画像ファイル一覧】と同じ画像名にします ＜画像の貼り付け＞ ① 編集画面を表示します ② 古い画像を削除します ③ 新しい画像をアップロードします ④ 必要な場合はサイズを変更します ⑤ プレビューを表示します 再度、サイズ変更が必要な場合は、④に戻ります
Ⅱ- １.編集の大まかな流れ
7 ページ ⑥ 更新します 7 ページ編集前 編集後 １） PR情報編集画面の表示
Ⅱ - ２．PR情報の編集方法
クリックすると PR情報画面のみが 表示されます ２） 文章の変更方法 ①文章を変更します 改行や空白文字は入力したままで表示します 枠内のみ編集してください ”編集”をクリックすると 編集画面が表示されます 「テスト追加１ テスト追加２」 を追加します。② プレビューを表示します ”プレビュー”をクリックすると 変更後のプレビューと編集画面 が表示されます 変更後のプレビュー です 編集画面です 再度、変更が必要な場合は ①同様にこの部分を変更して 左下の”再度プレビュー” をクリックします 9 ページ ③更新します ”ページの更新”をクリックすると PR情報が更新され、１）の画面に 戻ります ①同様にこの部分を変更して 左下の”再度プレビュー” をクリックします ”再度プレビュー” ”キャンセル”をクリックすると 更新されずに、１）の画面に戻 ります 9 ページ
変更前 変更後
１） PCに画像を準備する方法
①載せたい画像ファイルをPCに保存します
②①の画像のファイル名を”shop.jpgshop.jpgshop.jpgshop.jpg”に変更します
※）ファイル名は必ず.JPGではなく .jpgになっていることを確認してください。
Ⅱ- ３. 店舗情報の編集方法
編集したい画像ファイルを 右クリックをして .jpgになっていることを確認してください。 ※）OSのバージョンや それぞれのPCの設定によって 操作方法は異なります 編集したい画像ファイルを 右クリックをして ”編集”をクリック 左上のボタン（ファイル）を クリックして 「名前をつけて保存」 をクリックファイル名：
shop
shop
shop
shop
ファイルの種類：
JPEG
JPEG
JPEG
JPEG
２） 店舗情報編集画面の表示 クリックすると 店舗情報の画像部分のみが 表示されます ”編集”をクリックすると 編集画面が 表示されます 11 ページ ３） 画像を貼り付ける方法 ①古い画像を削除します 編集画面が 表示されます ”shop.jpg”の右にある ”[詳細]”をクリックします 11 ページ
②画像をアップロードします ”このファイルを削除します” を選択します ログインの時のパスワードを入力して ”実行”をクリックします ”添付”を クリックします ”参照”を クリックします
クリックします １）で保存した画像を選択して ”開く”をクリックします ”アップロード”を
※）左の画像は1024px × 768pxです お使いの画像によってサイズは異なります。 ③画像のサイズを変更します ２）と同様の方法で編集画面を表示させてから画像サイズを変更します 例）画像の大きさを半分にします 変更前） 変更後） ④プレビューを表示します ２）の画面に戻り アップロードした画像が 表示されます ↓のように半角で「,50%」を入力します 変更前）nolink,画像の説明 変更後）nolink,50%50%50%,画像の説明50% ”プレビュー”をクリックすると 13 ページ ※）サイズの再調整が必要な場合は ③に戻って%の数字を微調整し、 左下の”再度プレビュー”をクリックします ”プレビュー”をクリックすると 変更後のプレビューと編集画面 が表示されます 画像の登録について、うまくいかない場合、 こちらを参照ください。 今までに頂いた質問をまとめています。 http://omotecho.or.jp/help/ 13 ページ
⑤更新します
※重要！！
※重要！！
※重要！！
※重要！！
「ページの更新」をして、画像の右に表示される店舗情報（P.9参照 店名、取扱商品、電話番号などの部分）が
「ページの更新」をして、画像の右に表示される店舗情報（P.9参照 店名、取扱商品、電話番号などの部分）が
「ページの更新」をして、画像の右に表示される店舗情報（P.9参照 店名、取扱商品、電話番号などの部分）が
「ページの更新」をして、画像の右に表示される店舗情報（P.9参照 店名、取扱商品、電話番号などの部分）が
画面からはみ出し、消えていないか確認をしてください。
画面からはみ出し、消えていないか確認をしてください。
画面からはみ出し、消えていないか確認をしてください。
画面からはみ出し、消えていないか確認をしてください。
もし、消えている場合は、画像サイズが大きいので、前ページ③「％入力」の数字を小さくし調整してください
もし、消えている場合は、画像サイズが大きいので、前ページ③「％入力」の数字を小さくし調整してください
もし、消えている場合は、画像サイズが大きいので、前ページ③「％入力」の数字を小さくし調整してください
もし、消えている場合は、画像サイズが大きいので、前ページ③「％入力」の数字を小さくし調整してください
４） 文章の変更方法 画像の下に表示される文章を変更します 編集前 編集後 ”キャンセル”をクリックすると 更新されずに、２）の画面に戻 ります ”ページの更新”をクリックすると 店舗情報の画像が更新され、 ２）の画面に戻ります ①店舗情報編集画面を表示します ２）と同様 ②文章を変更します 変更前） 変更後） 「テスト追加」 を追加します 改行や空白文字は入力したままで 表示します１） PCに画像を準備する方法 Ⅱ- 3.店舗情報の編集方法と同様にPCに画像を保存し、”recent.jpg”にファイル名を変更します ２） 新着情報編集画面の表示 Ⅱ- 3.店舗情報の編集方法と同様 ３） 画像を貼り付ける方法 Ⅱ- 3.店舗情報の編集方法と同様 ４） 文章の変更方法 Ⅱ- 3.店舗情報の編集方法と同様 １） PCに画像を準備する方法 Ⅱ- 3.店舗情報の編集方法と同様にPCに画像を保存し、”image1.jpg”、”image2.jpg”にファイル名を変更します
Ⅱ - ４．新着情報の編集方法
Ⅱ - ５．画像情報の編集方法
15 ページ ２） 新着情報編集画面の表示 Ⅱ- 3.店舗情報の編集方法と同様 ３） 画像を貼り付ける方法 Ⅱ- 3.店舗情報の編集方法と同様 ４） 文章の変更方法 Ⅱ- 3.店舗情報の編集方法と同様 15 ページ変更前 変更後 文字サイズ：14 文字色：黒 文字サイズ：30 文字色：赤色 １） 文字サイズの変更方法
Ⅲ - １. 文字サイズ、文字色の変更方法
編集画面から サイズを変更したい文章を 指定します このボタンを 30 このボタンを クリックします サイズに「30」を入力して 「OK」をクリックします２） 文字色の変更方法 ※）変更後は、Ⅱ- 2.PR情報の編集方法の２）文章の変更方法と同様にプレビュー表示して確認後、更新します。 編集画面から 色を変更したい文章を 指定します このボタンの中から 赤色をクリックします 赤色がセットされます 17 ページ 上級者向け 上級者向け 上級者向け 上級者向け ＊形式：.jpg, .png, .gif ＊画像のサイズは、幅550px以内が望ましいです。 ＊デジカメで撮影した画像は大きすぎるため画像編集ソフトで縮小するか 編集方法で説明しているとおり画像サイズの変更が必要になります（難易度 中）
Ⅲ- ２. 画像の加工の説明
★注意事項
画像のファイルサイズが大きすぎる場合、表町TOPページの表示に
も影響を与えることが有ります。
なるべく200KB以内の画像をアップするようにお願いいたします。
17 ページ上級者向け 上級者向け 上級者向け 上級者向け ＊ほかの機能も使用したい場合
