デモサイトは歯科医院をイメージして制作しています。日本は諸外国に比べてオーラルケアが遅れています。欧米人のようにスキンシップやハグなどを日常的に行わないことが原因ではないかと言われていますが、その反面、歯科医院はかなりの数が溢れているようです。

歯科医院の数は、コンビニよりも多いそうなので驚きですね。街を見渡すと確かに歯医者さんが多いことに気がつくと思います。

しかし、その高い競争率から閉業に追い込まれる医院も多いので、周りとの差別化がさらに重要になってきます。このような厳しい状況の中、少しでも多くの人に認知され、来院者を増やす手段のひとつとしてウェブサイトが効果的であると私たちは考えます。

端的にどういった部分が効果的かと言えば、まずは来院を考えている方に安心感を与えられるという点でしょうか。

例えば、自分が歯痛に悩まされているとして考えてみてください。歯並びが気になるでも構いません。いずれにしても街を歩いていて、さらっと病院に入ることはないと思います。昔からのかかりつけがない限り、事前に口コミを聞いたり、インターネットを使って下調べすることが多いですよね。

病院や医療関係の事業全般に言えることですが、自分の身体のメンテナンスには多くの人が慎重になると思います。

では、院内の様子やスタッフの情報、よくある質問などを詳細に記載しているスタイリッシュなウェブサイトがあればどうでしょうか。数多くある歯科医院の中から選んでいただける可能性は大きく上がると思います。

正直いうと、スマホ環境からは見づらいサイトなども少なくないので、ウェブサイトの開設は今からでも遅くありません。細かい治療法や、金額なども掲載しておくとより安心感を与えることができるでしょう。

そこにプラスアルファで院長やスタッフのブログなどを継続的に更新したりします。患者さんが気軽に来れるようにキャッチーな日常を発信してもいいですし、歯にまつわる豆知識なんかも来院する方の役に立つはずです。

WordPressテーマ「CURE」を使って制作すれば、歯科医院のウェブサイトに必要とされる機能やデザインを一気に実装することが可能です。このデモサイトを隅々まで触って体感してみてください。当デモサイトからあなたのウェブサイトに使えるアイデアが生まれると弊社としても幸いです。

• コンテンツカルーセル：任意の数だけ画像・説明文・リンクを設定可能
• 診療案内一覧：カスタム投稿タイプ「診療案内」でつくったページをトップページに表示する
• メッセージ：画像とテキストをセットして代表のメッセージなどを設定する
• 記事カルーセル：医院のブログやお知らせを日付やランダム順で表示する
• アクセス情報：基本設定で設定できるマップなどのコンテンツを表示する
• フリースペース：オリジナルのコンテンツを表示する（HTMLで入力可）

コンテンツカルーセルには、任意の数だけコンテンツをセットできるので、様々な形で活用いただけます。デモサイトのように下層ページへの導線として活用する方法の他に、外部リンクを設定してバナーのように使うことも可能です。

診療案内一覧は、カスタム投稿タイプで制作したコンテンツが自動で反映される仕様です。個別に設定するのはサイズや背景画像ぐらいですので、設定する手間はありません。下層ページのコンテンツを要約して、わかりやすいアイコン画像などをセットするとより効果的かと思います。

来院する方を安心させるために、院長からのメッセージや医院の立地情報なども表示させておくといいでしょう。

CUREでは、ヘッダーの告知機能を搭載していますが、こちらでも活用いただけます。ぜひご覧下さい。

新型のウイルスなどの未曾有のトラブルや、期間限定のキャンペーンなどに活用できるヘッダーメッセージ機能 – WordPressテーマ「CURE (tcd082)」

新型コロナウイルスの影響で多くの影響が出ている昨今ですが、その影響は事業者や業界によっても異なります。CUREでコンセプトにしている歯科医院も大きな影響を受けている業界のひとつかと思います。

YouTube動画のレスポンシブ表示

クイックタグとYouTubeの埋め込みコードを組み合わせるだけで、簡単に様々なデバイスでレスポンシブ表示します。PC、スマホ、タブレッドでぜひ確認してみてください。メインカラム幅より横幅が大きい動画でも自動的にカラム幅ぴったりにリサイズされる便利なクイックタグです。

記事カードリンク

サイト内リンクを記事タイトル+サムネイル画像のクールなカードリンクで表示できます。記事タイトルやアイキャッチの変更は自動で反映されます。どうです？クールでしょ。

2021.02.15

歯科医院に最適なウェブサイトをスマートに制作できるWordPressテーマ「CURE」

TCD最新のWordPressテーマ「CURE」をリリースしました。 デモサイトは歯科医院をイメージして制作しています。日本は諸外国に...

2021.02.07

WordPressテーマ「CURE」機能概要

CUREは、歯科医院をコンセプトに制作したテーマですので、ユーザーの不安感や心配を取り除くのに活用いただける機能があらかじめ搭載されていいま...

カラムレイアウト

レイアウト2c

レイアウト3c

記事を読みやすくする見出しスタイルの表現の幅が広がりました。

下記のようなテーマオプションからH2,H3,H4,H5のそれぞれのスタイルを編集可能です。

フォント色、罫線の有無や、その太さや背景色の有無など、細かく設定・保存ができるので、以下のような様々なスタイルで見出しをスタイリング可能です（ほんの一例です）。

見出し2

見出し3

見出し4

見出し5

マニュアルや報告書などページ数の多い文書を作成するときには、第1章、第2章というように章や、第1節、第2節というように項目などで管理します。このように「第1章、第1節、第1項」といった階層構造を持たせておくと、読み手にとってわかりやすくなります。 文書に階層構造を持たせる場合は、「見出し」と呼ばれるスタイルを設定します。
見出しの「h1」は記事のタイトルで使われています。本文では基本的に使わない方が良いため、TCDクイックタグの入力設定には表示されないようにしてあります。記事の本文見出しには「h2」以降の見出しタグを用いて文章に階層構造を持たせるように意識をしてください。
「h1」だけでなく「h2」や「h3」も使うことで、WEBページの内容がわかりやすくなり、検索エンジンに対してフレンドリーなWEBコンテンツを作ることができます。hタグをうまく使うことで、検索エンジンはかんたんにWEBページの内容を理解できるようになるでしょう。そして、検索エンジンが内容を正しく理解できると、検索結果に表示されやすくなると言われています。
章ごと・見出しタグごとに内容がまとまっていてわかりやすいと、コンテンツの質は勝手に上がります。要点が整理され、コンテンツの内容がより役に立つものになるからです。一方、見出しが効果的に使われていない文章はわかりづらいために役に立てづらく、良質なコンテンツとは言えなくなります。
見出しタグは1から5までありますが、最も重要なのがh1、次に重要なのがh2、さらにはh3タグとなります。WEBページ執筆時はh1から5へと順番に使うのが基本です。文字サイズを調整したい場合などはCSSで対応するようにしましょう。
見出しごとに内容がまとまることは、訪問ユーザーにとって、とても良い対策になると言えます。訪問ユーザーの心を動かすような、わかりやすい文章やコンテンツを作るには、それなりにノウハウが必要ですが、「h2」や「h3」（「h4」「h5」）タグを使ってコンテンツを作りつづけると、誰でも自然にそのノウハウが身についていきます。
ぜひ、見出しクイックタグを使って、まとまりのあるコンテンツを書く習慣をつけ、訪問ユーザーの心を動かすコンテンツをたくさん産み出していきましょう。TCDクイックタグがあなたが文章を書くことに集中できるようサポートします。

囲み枠のスタイル

WEBコンテンツを運営されている方にとって、記事を書く中で「ここに注目してほしい！」と思うことは多くあると思います。そんなときにはパッと目をひく、囲み枠（ボックスデザイン）がおすすめです。TCDクイックタグでは3種の囲み枠を用意しています。

文章や図などを枠で囲んでグループ化して見せたり、見出しなどを枠で囲んで強調することは文章の内容が整理されて見やすくなります。デザインにメリハリがつき、アクセントになるなど、囲み枠の効果はたくさんありますので効果的に使っていきましょう。

枠を多用しすぎると、強調したい箇所が主張をしすぎているため、読みにくくなってしまい、これでは本末転倒です。枠をつけるのは必要なものだけにし、その他は、下線を引く、文字を大きくする、色を変える、太字にする、書体を変えるなどしましょう。

カスタマイズ＊囲み枠のカラーバリエーション

※クラス指定を追加することで配色の変更が可能です。

「揃える」ことは重要です。文字の位置や、見出しなど揃えられるところはすべて揃えます。文章の端が揃うことで文頭が見つけやすくなり、文章が読みやすくなります。画像の大きさ、ボックスの色を揃えると見た目のバランスが良くなります。

「まとめる」ことも効果的です。項目名と説明、写真と写真のタイトルなどのデザインを揃えるように、関連のあるもの（例えば注釈など）を同じ枠、背景色で表示することで直感的に理解をしやすくなり、劇的に全体の視認性が向上します。

まとめた情報を「区別する」とグループが強調され、情報を素早く見つけることができ、正確に伝えることができます。グループを区別するには、罫線を引く、色分けをするなどの方法があります。TCDクイックタグを使ってサッとデザインを整えましょう。

プロのデザイナーは、これらのルールを経験からほとんど無意識に使いこなします。このルールを身に付ければ、誰でもレイアウトが上達します。様々なルールがありますが、基本ルールは「揃える」「まとめる」「区別する」を使った情報の整理整頓です。

ボタンのスタイル

ボタン1
ボタン2
ボタン3
テーマオプションからボタンのデザインやサイズを3つまで柔軟に編集・登録可能です。

カスタマイズ＊ボタンの配置方法を指定する

※pタグで囲い、クラス指定を追加することで配置方法の指定が可能です。

左寄せ

中央寄せ

右寄せ

テーブルのレスポンシブ表示

テーブルタグで作成された表組みをレスポンシブに表示するためのタグです。
ブラウザのウィンドウ幅を縮小してスマホでの表示スタイルをご確認ください。

フォームのスタイル

プラグイン「Contactform7」で作成したフォームを記事内に設置した際のスタイル設定も含まれています。
レスポンシブ表示に対応しています。
[contact-form-7]

アンダーライン1・2・3

重要な箇所など、強調させたい部分をこのようなアニメーションで強調させることができます。
アップデートしたクイックタグではテーマオプションから3種類までアンダーラインを保存できます。
重要度に合わせて使い分けることも簡単ですね。

吹き出し

それぞれのユーザー画像や名前はテーマオプションから任意に変更できます（テキストエディターで直接入力も可能）。

ユーザーA

こんな感じにデザインされた吹き出しが簡単に表示されます。

ユーザーB

会話形式のブログでもリズミカルに作成可能ですね。

ユーザーC

こんな感じで吹き出しの中のテキストにマーカーを引くのももちろん可能です。

ユーザーD

枠と背景の色を分けられるので、幅広いデザインを楽しめますね！

来院の相談や、予約をする上で必ず確認する項目の一つだからです。

CUREでは、それらを表示する箇所が複数あっても、設定する回数は一回だけで完了します。

テーマオプションの以下のような基本設定内で、医院の基本情報として、問い合わせボタンや立地条件などの詳細を設定しておくと、対応しているページでワンタッチで表示できるというわけです。

この仕様によって設定の二度手間が省かれ、サイト構築がスムーズになります。

また、電話番号が変わったり、住所を移転したとしても一箇所の設定を変更すれば、表示されている箇所はすべて連動して入れ替わります。サイト上で間違った情報を掲載したままになることが無くなるわけですね。　

トップページのマップの隣に表示しているアクセス情報などは、HTMLで入力可能なフリースペースで制作可能です。デモサイトのように表示したい場合は、テキストエディターで以下のようなHTMLを入力いただくことで表示いただけます。以下のHTMLをそのままコピーして各所を書き換えてご利用いただいてもいいですし、自由にコンテンツを作成いただくことも可能です。

<div class="tcd_access_info">
<h5><span style="color: #00a8ca"><strong>お車でお越しの方</strong></span></h5>
阪神11号池田線 梅田 5分～10分
阪神1号環状線 堂島 5分
<h5><span style="color: #00a8ca"><strong>バスでお越しの方</strong></span></h5>
JR大阪バス梅田バス停下車 徒歩15分
阪急バス梅田バス停下車 徒歩5分
<h5><span style="color: #00a8ca"><strong>駐車場</strong></span></h5>
30台完備の駐車場を確保しております
</div>

どちらもグローバルナビメニューにカーソルを合わせるとふわっと優しく下からスライドインして表示される仕様です。どこか不安を抱えてホームページを訪れたお客様に少しでも心地よさを感じてもらえるようにこのようなアニメーションを採用しています。

＜メガメニューA＞

メガメニューAはカスタム投稿タイプ「診療案内」へのリンクを表示できます。それぞれのアイコンは診療案内ページを作成する際に、「画像（メガメニュー）」という項目で設定するだけです。デモサイトのように親しみやすいアイコン風の画像をセットしておくと治療へのハードルが下がるかもしれません。

＜メガメニューB＞

メガメニューBは、ブログコンテンツをアイキャッチ画像やカテゴリーと共に表示するメニューです。カテゴリーページへも遷移できるので、お客様をスムーズにご案内できます。日付やランダム順で表示順を選択できるので過去記事を再度アピールすることも可能です。

• 3点コンセプトコンテンツ
• 画像＋テキストコンテンツ
• 丸型画像コンテンツ
• フリースペース

下記のようにデザインされた3点コンセプトコンテンツでは、一枚の画像と3点のコンセプトを表示してアピールできます。何に力を入れている歯科医院なのかを端的にアピールしましょう。ここでの訴求は、医院の印象に影響を与えるはずです。

例えば、PC環境では、サイドカラムにウィジェットを表示しておくことができます。2カラムで表示しておくとPCの画面ではスクロールする必要はありませんし、同時に目にいれることができますよね。広告を表示したり、おすすめ記事を表示したり、カテゴリー別のリンクを表示するなど色々試せます。

ただし、スマホ環境だとどうでしょうか。

縦にスクロールが長くなってしまうと少し煩わしいですよね。なので、デモサイトではあえてウィジェットを少なくしています。関連記事の表示件数にしても同様の理屈で少なくしているわけです。実際にお手元のデバイスで表示の違いを確認してみてください。

• アイキャッチ画像の下
• 関連記事の上
• ショートコード
• モバイル用

記事詳細ページのアイキャッチ画像の下部、関連記事の上部に表示される画像とURLを登録できる他、HTMLコードをご利用いただけるエリアもご用意しております。同様に登録した広告をショートコードとして出力する機能もあるので、本文中の任意の箇所に表示させることも可能です。
モバイル用の広告設定は、モバイルユーザー限定で表示する広告機能としてご活用いただけます。デバイスごとにチェックして、広告を推しすぎないバランスを意識してみましょう。

ブログやお知らせ記事のサイドカラムには、広告を3種類からランダムに表示できるウィジェットもセットできるので、ぜひご活用ください。デモサイトでいう右上に表示されているCUREの広告の部分になります（デモサイトでは、一つしか登録していません）。

そんな方の為に、誰でも一瞬でデモサイトに近い設定ができるインポート・リセット機能を実装しました。テーマオプションの設定やサンプル記事、グローバルメニュー、ウィジェットをデモサイトに近い状態にすぐに再現できます（※サンプルの画像や文章が入る為、デモサイトとは異なります）。

これで、ウェブサイトのローンチまでの時間を大幅に短縮できるようになります。TCDの画期的な新機能です。他テーマからの切り替えもこれで簡単になりますね。

2021.02.06

来院予定者のニーズを満たす情報をアピールできる3点ボックスと固定式サイドメニュー

CUREで最初に目に入る特徴的な点は、固定表示されるサイドバーメニューとヘッダーコンテンツ下部の3点ボックスです。これらは医院のウェブサイト...

アイコンは下記の30種類から選択いただけますので、ご自身の目的にあったものをセットしておくといいでしょう。CUREのような歯科医院であれば、予約やお問い合わせ、アクセス情報などを表示しておくのが、基本ですね。

実際にお手元のスマートフォンでデモサイトをご覧いただくと、どのような表示かをご確認いただけます。