ホーム
〇〇駅から徒歩3分の歯科医院。一般歯科・小児歯科・予防歯科・インプラント。土曜診療。
<< デモ一覧に戻る
歯科医院のデモ
- このページでは、Frames CMS の製品版で実際に作った歯科医院のサイトをご紹介します。一般歯科・小児歯科・予防歯科のある、駅前の歯科医院を想定した、7ページ構成です。
- 使っているフレーム（デザインの枠）1種類とパーツ16種類を、すべて公開しており、「どのパーツを組み合わせれば、このページになるのか」がそのまま分かります。
- このデモは、左の列にロゴの箱とメニュー、その下に「サイドバー」（診療時間・予約ボタン）を置いた2カラムです。
まずは全体像から
このデモの構成
7つのページで構成しています。「初めての方へ」のページを独立させるのが、医院のサイトの基本の型です。
01
02
初めての方へ
初診の流れと、お持ちいただくもの。
03
診療のご案内
一般歯科・小児歯科・予防歯科・インプラント・ホワイトニング。
04
自費診療の料金
インプラント・ホワイトニング・セラミックの料金。
05
医院紹介
院長あいさつ・スタッフ・院内のご案内。
06
お知らせ
さんぷる歯科クリニックからのお知らせ一覧です。
07
お問い合わせ
入力項目を自由に作れるフォーム。
デザインの土台
使っているフレーム
このデモで使っているフレームは 「sidewave1（左メニュー・写真の下に波）」 です。
フレームとは、サイト全体の「枠」のことです。ヘッダー・メインビジュアル・メニュー・フッター・全体の余白や配色を、まとめて決めているものだとお考えください。製品版では約50種類から選べます。
左の列にロゴの箱と縦に並ぶメニュー、右に本文が入る2カラムのフレームです。写真の下が波の形になります。
メニューの下に「サイドバー」
メニューの下に、全ページ共通の「サイドバー」を置き、診療時間を入れています。Web予約は、メニューの最後の項目を「ボタン」にして目立たせているので、どのページを見ていても、予約のきっかけが目に入ります。中身は、管理画面の「サイドバー」でパーツを並べるだけです。
下のページの上部の写真を差し替える
トップ以外のページの上部に出る写真は、「デザイン → このフレーム専用の素材」で差し替えられます。このデモでは、医院の写真にしています。
ロゴは「画像」で入れています
このデモのロゴは、マークとサイト名を組み合わせたロゴ画像です。管理画面の「サイト基本設定 → ロゴ画像」に画像を入れるだけで、ヘッダーに表示されます。ロゴは濃い色の箱の中に入るので、白いロゴを使っています。
ロゴ画像を入れない場合は、サイト名がそのまま文字で表示されます。それでもサイトは作れますが、文字だけのロゴは、どうしても印象が弱く、さみしい仕上がりになりがちです。デモの見本と同じ雰囲気に仕上げたい場合は、シンプルなもので構いませんので、ロゴ画像を1つご用意ください。小さなマーク＋サイト名、くらいで十分に引き締まります。
ロゴは背景が透明なPNGがおすすめです。ヘッダーの色が濃いフレームでは白いロゴを、明るいフレームでは濃い色のロゴを使うと読みやすくなります。大きさは「サイト基本設定 → ロゴの大きさ」で変えられます。
同じフレームで作った、ほかのデモ
設定を変えるだけで、ここまで変わります
Frames CMS のデモは、すべて同じ1つの CMS で作っています。下のデモは、このデモと同じフレーム「sidewave1」を使ったものです。
テーマカラー・メイン画像・ロゴ・並べるパーツを変えるだけで、同じフレームでも、印象がここまで変わります。
まつげ・眉サロン
このデモの作り方
使用したパーツ
セクションごとに、使ったパーツです。
管理画面で同じパーツを選べば、同じ形が作れます。
ホーム
| セクション | 使ったパーツ | Free版 |
|---|---|---|
| こんなことで、お悩みではありませんか？ | ビフォーアフター（吹き出し） | |
| 診療のご案内 | 特徴・サービス（アイコン3列） | |
| 無料相談への誘導 | パララックス背景（写真／動画） | |
| 院長あいさつ | テキスト＋写真2枚（角丸と丸） | |
| お知らせ | お知らせ一覧（自動） |
初めての方へ／診療のご案内／自費診療の料金
| セクション | 使ったパーツ | Free版 |
|---|---|---|
| 初診の流れ | ステップ案内（縦・番号＋画像） | |
| 画像（1枚） | 画像（1枚） | |
| お持ちいただくもの | 箇条書き（中黒・番号） | |
| 診療のご案内 | 汎用レイアウト（画像＋テキスト・配置選択） | |
| サムネイル横スライド（写真の流れ） | サムネイル横スライド（写真の流れ） | |
| お知らせボックス | アラート（お知らせボックス） | |
| 自費診療の料金 | 料金表（プラン比較） |
医院紹介／サイドバー（全ページ共通）
| セクション | 使ったパーツ | Free版 |
|---|---|---|
| 診療時間 | 基本セット（見出し＋本文＋画像） | |
| スタッフ | スタッフ紹介 | |
| 院内のご案内 | ギャラリー（複数画像） | |
| 診療時間 | 営業時間・曜日表 |
全16種類のパーツのうち、13種類は製品版でのみ使えるものです。吹き出しのビフォーアフターやプラン比較表、診療時間の曜日表は製品版のパーツです。製品版では70種類以上のパーツが使えます。
ゼロから作らなくて大丈夫です
このデモを、そのままお使い頂くことも可能です
製品版をご購入いただいた方には、このデモと同じ中身が入った状態のデータをご利用頂く事も可能です。
デモデータをご希望の場合は、購入者マイページからDLして下さい。
このデモをベースに「ゼロ」から作るお客様向けです。すでにFrames CMSでページを作られている場合、デモのデータを入れると既存の内容は引き継がれません。作りかけのサイトがある方は、パーツを1つずつ置いていく通常の方法をおすすめします。
作るときの参考に
歯科医院のサイトで迷いやすいところ
このデモを作るときに考えたことを、いくつか書いておきます。
- 自費診療の料金は載せたほうがいいですか
- 載せたほうが安心してもらえます。このデモでは、インプラント・ホワイトニング・セラミックをプラン比較表にしました。「〇〇円〜」の目安で構いません。
- 医療広告のルールで、気をつけることはありますか
- 「絶対に痛くない」「日本一」のような言い切りや比較の表現は避けます。このデモのキャッチも「痛くない、こわくない歯医者へ。」と、方針として書いています。詳しくは、医療広告ガイドラインをご確認ください。
- 診療時間は、どこに載せればいいですか
- トップと、サイドバーの両方に置くのがおすすめです。いちばんよく見られる情報なので、どのページからも見えるようにしました。
この構成で作れるサイト
歯科医院以外にも
このデモは歯科医院を想定していますが、同じ構成のまま、内容を差し替えるだけで使える業種がたくさんあります。
内科・小児科／整骨院・整体院／動物病院／皮膚科／眼科／調剤薬局 など、「診療時間と予約を、いつも見えるところに置きたい」ところであれば、そのまま当てはまります。
サイドバーは、2カラムのフレームで使えます。1カラムのフレームに切り替えても、中身は消えません。
まずは無料で試せます
Free（無料版）のご案内
Frames CMSには無料版があります。登録不要でダウンロードでき、期限もありません。
ご自身のサーバーに設置して、管理画面の使い勝手を確かめてから、製品版をご検討ください。
無料版で作ったページやお知らせは、製品版に切り替えてもそのまま残ります。作り直しは必要ありません。
<< デモ一覧に戻る