心療内科や精神科のホームページには、優しい配色・ゆとりのあるレイアウトに加え、必要な情報にスムーズに辿り着ける工夫が求められます。

「見ていて疲れない。」
「訪れた人たちの心が安らぐ。」

患者様が安心して利用できるデザインが欠かせないわけです。

そんな印象を与えるサイトを実現できるのが、心療内科を想定したWordPressテーマ「MONAD(モナド)」。診療案内や医師紹介、よくある質問ページなどを美しいデザインでまとめられます。

当記事で、MONADの機能概要をご紹介いたします。

WordPressテーマ「MONAD」とは

WordPressテーマ「MONAD(モナド)」は、TCDシリーズの110作目の製品で、心療内科クリニックをコンセプトにデザインされています。安心感を重視した医療系のサイトに最適なテンプレートです。

販売ページ

できること・主な特徴

  • ゆったりとしたアニメーション。
  • 丸みのある優しいデザイン。
  • 予約や問い合わせへの導線が豊富。
  • 診療案内ページをつくれる。
  • 医師紹介ページをつくれる。
  • よくある質問ページをつくれる。
  • 高機能なランディングページ作成機能が使える。

向いているサイト

優しい配色や心安らぐ雰囲気と相性のいい、次のような医療系サイトに最適です。

  • 心療内科・精神医療
  • メンタルクリニック
  • 診療所
  • カウンセラー
  • 社会福祉施設

MONADの機能概要

WordPressテーマ「MONAD」でつくったデモサイトを参考に、各所のパーツやページごとの機能概要をご紹介いたします。

ロード画面 読み込み中の画面を表示・カスタマイズする機能。
背景のアクセント コンテンツの背景に装飾を加える機能。柔らかい雰囲気を演出する。
ヘッダーメッセージ 全ページの最上部で案内・告知できる。緊急度、重要度の高いメッセージに最適。
ヘッダーバー サイトのナビゲーションメニュー。右端には電話番号も表示可能。
ヘッダーコンテンツ サイトのファーストビューとなる部分。縦書き・横書きの切り替えや動画のセットも可能。
サイドボタン 全ページに表示されるサイドボタン。重要な導線を設置しておける。
トップページのアイテム 下層ページへの導線となる部分。用意されているアイテムを組み合わせて、全箇所ノーコードで作成可能。
診療案内ページ クリニックのサイトに欠かせない部分。複雑な病名や症状をわかりやすく伝えるための雛形。
スタッフページ 固定ページテンプレート「スタッフ一覧」。医師やスタッフを一覧表示するための機能。WordPressのユーザーと連動する仕様。
FAQページ 固定ページテンプレート「FAQページ」。患者さまの疑問や不安を解消するためのよくある質問ページをつくる機能。
ランディングページ 固定ページテンプレート「ランディングページ」。いろんなバリエーションがつくれるLP作成機能。
フッター 4つまでバナーを登録できる。クリニックの営業時間表も簡単作成。

ロード画面

MONADのロード画面

上記のようなロード画面を任意で表示・カスタマイズできる機能です。

  • テーマ内蔵の3種類のロードアイコン
  • オリジナルロゴ画像やキャッチフレーズ

などを設定して表示します。

表示時間や表示するページ、表示する頻度も調整できます。基本仕様は他のTCDテーマと共通なので、こちらの記事で解説しています。

MONADでは上記仕様に加えて、次にご紹介する「背景のアクセント」も登録可能です。

ユーザーの初回訪問時のみ、トップページにだけロード画面を表示する。という動作も再現できるので、ウェルカムページのようにもご活用いただけます。

背景のアクセント

MONADの背景アクセント

背景のアクセントはMONAD特有の機能で、コンテンツの背景に表示されている赤枠の装飾の部分です。先述のロード画面やトップページに設定できます(非表示も可)。

設定UIは以下のようになっています。

MONADの背景アクセントの設定UI

  • プリセット4種類
  • オリジナルの色か画像

を表示できて、位置も調整可能です。

スクロール時に、時間差でゆったりと動くパララックスエフェクトも簡単に適用できます。

背景の余白を優しいアクセントで装飾するようにお使いください。ゆったりとした動きとともに柔らかい雰囲気を演出できます。デザインに奥行きを持たせたリッチな表現が可能です。

ヘッダーメッセージ

MONADのヘッダーメッセージ

サイトの最上部にヘッダーメッセージを表示できます。全ページに表示されるため、緊急度、重要度の高い案内や告知に最適です。

  • テキスト
  • リンク先URL
  • 文字色
  • 背景色

を設定可能です。

臨時休診や新しい診療科目の開始、期間限定のキャンペーンなど。「訪問者に最優先で伝えたい情報」を設定しておくのに最適なパーツです。

ヘッダーバー

MONADのヘッダーバー

MONADのヘッダーバーには、検索フォームエリアの代わりに電話番号も表示できます。

MONADのヘッダーバーに電話番号を表示した例

必要に応じて補足説明も追加表示できます。

また、デモサイトでは、スクロール時にも上部に固定表示されていますが、固定解除も可能です。

ヘッダーバーを上部固定表示し、電話番号等を表示すると効果的に導線を確保できます。補足説明には、休診日やオンライン予約のテキストリンク(aタグ)などが適しています。

ヘッダーコンテンツ

MONADのヘッダーコンテンツ

トップページのヘッダーコンテンツの機能は次の通り。

テキストの向き 縦書き・横書き
背景のタイプ 画像・mp4動画・Youtube
ヘッダースライダーのデザイン 2タイプ

デモサイトで縦書き表示にしているテキストは、横書き表示にも変更可能です。横書き表示の場合は、次のような体裁でボタンも表示できます。

MONADのヘッダーコンテンツで横書きにした例

背景のタイプには、mp4動画も設置可能です。

また、ヘッダースライダーのデザインは、次の2タイプから変更できます。

  • スペースあり
  • スペース無し
MONADのヘッダーコンテンツで横書きにした例

テキストの向き、ボタンの有無、背景のタイプ、ヘッダースライダーのデザインなどを組み合わせて、幅広いヘッダーコンテンツを作成可能です。

フォントタイプやサイズ、色なども調整可能です。背景に設置するコンテンツなどに合わせて、細部にこだわって設定していただけます。

サイドボタン

MONADのサイドボタン

サイト内の全箇所に表示されるサイドボタン。設定項目は次の通りです。

MONADのサイドボタンの設定UI

  • アイコン(無しも可)
  • ラベル
  • URL
  • 背景色

ボタンごとに、上記項目が用意されており、最大4つまで登録可能です。

デモサイトでは、「スクロール後に表示する」という設定にしていますが、「常に表示する」にも切り替え可能です。あえてスクロール後に表示することで、ユーザーの注意を引く狙いがあります。

トップページのアイテム

ヘッダーコンテンツより下部の下記箇所。

MONADのトップページメインコンテンツ

ここには、次の6種のアイテムが用意されており、それらを組み合わせて作成する仕様です。

  1. デザインコンテンツ
  2. 2カラムコンテンツ
  3. 投稿一覧
  4. お知らせ一覧
  5. 診療案内一覧
  6. フリースペース

ドラッグ&ドロップで並び変えたり、自由に追加&削除が可能です。

すべてのアイテムを設置する必要はないですが、トップページから下層ページへの導線は非常に重要です。サイト全体の概要を示す役割もあります。適切な配置、リンク先を色々とお試しください。

デザインコンテンツ

MONADのデザインコンテンツ

デザインコンテンツは、下記項目を登録できるアイテムです。

  • 縦書き or 横書きのキャッチフレーズ
  • 画像2枚
  • 背景のアクセント
  • ボタン(任意のリンク先URL)
院内の画像を登録したり、クリニックのイメージが伝わる画像をセットしておくといいでしょう。柔らかな雰囲気の演出のためにも、「背景のアクセント」はぜひ利用したいところです。

2カラムコンテンツ

MONADの2カラムコンテンツ

2カラムコンテンツは、下記項目を登録できるアイテムです。

  • 縦書き or 横書きのキャッチフレーズ
  • 画像・テキスト・リンクのセット
  • 背景のアクセント
「画像・テキスト・リンクのセット」はお好きな数だけ登録可能です。並び替えもドラッグ&ドロップで可能ですので、下層ページへの導線にする以外にも、外部サイトへのリンク先としてもご利用いただけます。

投稿一覧

MONADの投稿一覧

WordPressの投稿一覧をカルーセル式で表示するアイテムです。

以下の設定項目があります。

  • 縦書き or 横書きのキャッチフレーズ
  • 記事一覧

どの記事をどの順番で表示するのかは、次の設定項目で指定可能です。

記事のタイプ ・全ての記事
・カテゴリー
・おすすめ記事1,2,3
・カスタム(ID指定)
TCDテーマは管理画面にIDを表示
記事の並び順 日付 / ランダム
全ての記事を日付順で表示するのもいいですが、特に目立たせたい記事を指定して表示するのもありです。いろんな記事を見せたいなら「投稿記事一覧」を複数設置して、別々の記事を表示させる使い方もできます。

お知らせ一覧

MONADのお知らせコンテンツ

MONADに実装されているカスタム投稿「お知らせ」の記事を一覧で表示するアイテムです。ここには、アイキャッチ画像は表示されない仕様です(詳細ページには表示されます)。

以下の設定項目があります。

  • 縦書き or 横書きのキャッチフレーズ
  • 記事一覧

こちらも投稿一覧と同じく細かく表示記事を指定可能です。

記事のタイプ ・全ての記事
・カテゴリー
・おすすめ記事1,2,3
・カスタム(ID指定)
TCDテーマは管理画面にIDを表示
記事の並び順 日付 / ランダム
クリニックからのお知らせなどとして利用する場合は、全ての記事を日付順で表示するのがセオリーですが、特定のカテゴリーのお知らせ記事のみを表示する使い方もできます。

診療案内一覧

MONADの診療案内コンテンツ

MONADに実装されているカスタム投稿「診療案内」の記事を一覧で表示します。

以下の設定項目があります。

  • 縦書き or 横書きのキャッチフレーズ
  • 記事一覧

記事一覧には、すべての診療案内記事が表示される仕様です。

診療案内詳細ページで設定した内容が、そのままトップページに反映されるので、すぐに設定完了します。クリニックにどんな診療科目があるのかを示しておくのは、当然重要です。トップページにぜひ表示しておきたいコンテンツです。

フリースペース

WordPressのクラシックエディターを使って自由に作成できるアイテムです。

次の設定項目があります。

  • 縦書き or 横書きのキャッチフレーズ
  • WordPressのクラシックエディター(ビジュアル/テキスト)

WordPressの本文を作成する際の利用できる機能は、すべて利用できます。メディアライブラリから画像や動画も設置可能です。

自作のバナーやSNS投稿、地図などを設置するのもいいでしょう。テーマ内蔵のアイテムと組み合わせて、独自のコンテンツを混ぜて表示する使い方も可能です。

診療案内ページ

  • アーカイブページ
  • 詳細ページ
MONADの診療案内アーカイブページ

MONAD独自のカスタム投稿タイプ「診療案内」。クリニックの診療科目を案内するための機能です。

複雑な病名などをわかりやすく伝えるために、本文以外にも補足説明を登録できる入力欄があります。デモの診療案内ページを例にすると、次のようになっています。

MONADの診療案内ページの仕様

アイキャッチ画像の周りに補足説明を表示できるわけです。

記事タイトル 必須項目です。症状の正式名称などを入れるといいでしょう。
見出し 任意項目です。症状をわかりやすい表現にして見出しにするといいかもしれません。
アイキャッチ 必須項目です。イラスト素材などは優しい雰囲気が出ますね。
説明文 任意項目です。症状の概要などを書いておきます。HTMLも使えます。
リスト 任意項目です。症例などを箇条書きにしておくとわかりやすいです。この箇所はアーカイブページにも表示されます。
任意項目は必須ではありませんが、診療案内をわかりやすく表現するために便利です。コンパクトな文字数で収まるように設定しておくのがおすすめです。

スタッフページ

MONADのスタッフ一覧ページ

>> デモのスタッフページを見る

固定ページテンプレート「スタッフ一覧」でつくれるページです。クリニックのスタッフや医師を紹介するための機能です。

登録された画像とプロフィール情報が綺麗に整列します。WordPressのユーザープロフィールと連動する仕様なので、スタッフごとの投稿記事への導線としても機能します。

各スタッフの表示/非表示や順番は、固定ページ内の管理画面で変更可能です。

MONADのスタッフ一覧ページ編集画面

どんな医師やスタッフが在籍しているかは、クリニックのサイトでよく見られる部分の一つです。スタッフの投稿記事があれば、そこにも紐づく仕様なので、投稿記事へのアクセスも狙えます。

FAQページ

MONADのFAQページ

>> デモのFAQページを見る

固定ページテンプレート「FAQページ」で作成できるページです。患者様の疑問や不安を解消する「よくある質問」をまとめておくための機能です。FAQグループごとにアンカーリンクする仕様です。

設定画面は、次のようになっています。

MONADのFAQページ設定画面UI

FAQグループをつくって、その中に質問と回答を登録していく仕様です。FAQ項目は任意の数だけ追加できて、ドラッグ&ドロップで並び替えも可能です。

FAQをグループ分けすることで、情報が整理されます。患者さまが求める情報に辿り着きやすくなるよう、診療や通院、症状の簡単なQAなどをまとめておくと実用的なページになるはずです。

ランディングページ

MONADのLP

固定ページテンプレート「ランディングページ」で作成できるページです。ランディングページ(LP)をつくるための機能です。

ランディングページとは
検索結果や広告、SNSやメルマガを経由して、ユーザーが最初に「着地(landing)するページ」のことです。略してLPとも呼ばれます。
参考:https://tcd-theme.com/2024/08/what-is-landing-page.html

例えば、ひとつのテンプレートでこのようなページがつくれます。

  1. LPデモ1(採用情報)
  2. LPデモ2(講演会)
  3. LPデモ3(書籍出版)

ヘッダーやフッターを非表示にしたり、全画面ヘッダーに切り替えることが可能です。

LPの作成方法は、こちらの記事で解説しています。

MONADのLP作成機能では、キャッチコピーを縦書き表示にもできて、つくれるページのバリエーションが増えています。別途有料のLP作成ツールを利用する必要はありません。

MONADのフッター部分は、次の構成になっています。

MONADのフッター

バナー ・画像
・テキスト
・リンク先URL
という項目のバナーを最大4つまで登録可能(非表示も可)。
テキスト クリニック名、住所や定休日、電話番号などを入力できます。
営業時間表 あらかじめ用意されているマス目に営業時間や曜日などを設定できます。テキストを入れられるので曜日ごとに医師の名前を入れることも可能です。
フッターメニュー 最大4列のフッターメニューを登録できます。
コピーライト 著作権表示を登録可能です。「© 2024 病院名」などと登録します。
バナーのリンク先は、必ずしもクリニックの下層ページである必要はありません。提携している医院やクリニックのサイトにリンクさせる使い方もありです。

心から安心できる
クリニックのサイトをMONADで。

WordPressテーマ「MONAD(モナド)」の機能概要をご紹介いたしました。

心療内科、精神科などのクリニックのホームページ制作に便利な機能が、1パッケージにまとまっています。安心できるクリニックのサイト制作には、ぜひMONADをご活用ください。

実際にデモサイトを見ていただくことで、心地よいアニメーションや優しい雰囲気のデザインを体感していただけます。

WordPressテーマ「MONAD」