ホーム
ごあいさつ、取扱業務3つへの入口、よくいただくご相談、無料相談の案内、事務所について、お知らせ。
<< デモ一覧に戻る
士業事務所のデモ
- このページでは、Frames CMS の製品版で実際に作った司法書士事務所のサイトをご紹介します。相続登記・不動産登記・会社登記を扱う事務所を想定した、8ページ構成です。
- 使っているフレーム（デザインの枠）1種類とパーツ14種類を、すべて公開しており、「どのパーツを組み合わせれば、このページになるのか」がそのまま分かります。
- このデモは、ページ数が多いサイトの型です。他のデモが「1カラム」なのに対し、これだけ右側にメニューが並ぶ2カラム。ページが増えても迷子にならない作りになっています。
まずは全体像から
このデモの構成
8つのページで構成しています。取扱業務ごとにページを分けるのが、士業サイトの基本の型です。
01
02
相続・遺言
法改正の注意ボックス、お引き受けできることの表、手続きの流れ（タイムライン）、よくあるご質問。
03
不動産登記
売買・贈与・住所変更の3つを、写真つきの横並びで紹介。必要書類の表とご質問。
04
会社・法人登記
設立・役員変更・本店移転をアイコン3列で。設立費用の内訳の表とご質問。
05
費用の目安
3列の表で、業務・報酬・実費を並べたページ。士業サイトで一番よく見られるページです。
06
事務所案内
写真1枚、事務所概要の表、アクセスの箇条書き、地図。
07
お知らせ
相談会の日程や法改正の案内など。記事を追加すると一覧と詳細が自動で作られます。
08
お問い合わせ
入力項目を自由に作れるフォーム。相談内容の種類を選ばせる項目を足すと、返信が楽になります。
デザインの土台
使っているフレーム
このデモで使っているフレームは 「frame3-c2（2カラムレイアウト）」 です。
フレームとは、サイト全体の「枠」のことです。ヘッダー・メインビジュアル・メニュー・フッター・全体の余白や配色を、まとめて決めているものだとお考えください。製品版では20種類以上から選べます。
2カラムのフレームだけが使える「メニューの見出し」
このデモのサイドメニューは、「取扱業務」「ご依頼について」「事務所」の3つにグループ分けされています。この見出しは、管理画面のメニュー編集でリンク先の種類を「見出し」にすると作れます。
見出しは、2カラム（サイドメニュー型）のフレームのときだけ表示されます。1カラムのフレームに切り替えると自動的に隠れ、普通のメニューとして並びます。データは消えませんので、また2カラムに戻せば見出しも戻ります。
ページが8つ以上あるサイトでは、この見出しがあるだけで、かなり探しやすくなります。士業・工務店・学習塾・病院など、ページ数が増えやすい業種向けのフレームです。
このデモでは、色を1つだけ変えています
frame3-c2 の標準のアクセント色はオレンジですが、事務所の落ち着いた印象に合わせて深緑に変更しました。変更したのは管理画面の「デザイン → テーマカラー」で、カラーピッカーから色を選んだだけです。
費用の目安ページの表の見出しと、相続手続きの流れの丸印が、この深緑です。紺色と深緑の組み合わせは、士業のサイトで扱いやすい配色です。
変えられるのは、メインカラー・アクセントカラー・薄い色（差し色）・背景色・文字色の5つ。フレームを選んだあとで、事務所の雰囲気に寄せることができます。
なお、その下にはテーマCSSを直接編集できる欄もあります。余白や角の丸み、フォントサイズなど、色以外も細かく調整したい方向けです（CSSの知識がある方向けの機能なので、通常はカラーピッカーだけで十分です）。
変えた色だけが保存される仕組みになっています。あとから別のフレームに切り替えても、変更していない色はそのフレーム本来の配色が生きます。
使用したパーツ
セクションごとに、使ったパーツです。
管理画面で同じパーツを選べば、同じ形が作れます。
ホーム
| セクション | 使ったパーツ | Free版 |
|---|---|---|
| ごあいさつ | 基本セット（見出し＋本文＋画像） | |
| 取扱業務3つへの入口 | オーバーレイ（画像リンク・横並び） | |
| よくいただくご相談 | 箇条書き（中黒・番号） | |
| 無料相談のご案内 | CTA（誘導ボックス） | |
| 事務所について | 横長レイアウト（テキスト＋写真） | |
| お知らせ | お知らせ一覧（自動） |
相続・遺言／不動産登記／会社・法人登記
| セクション | 使ったパーツ | Free版 |
|---|---|---|
| 法改正の注意ボックス | アラート（お知らせボックス） | |
| お引き受けできること／必要書類 | 表（項目と内容） | |
| 相続登記の流れ | 沿革・年表（タイムライン） | |
| 売買・贈与・住所変更 | 横並び（写真＋文章） | |
| 会社登記の3種 | 特徴・サービス（アイコン3列） | |
| よくあるご質問 | FAQ（クリックで開閉） |
費用の目安／事務所案内
| セクション | 使ったパーツ | Free版 |
|---|---|---|
| 報酬の目安（3列の表） | 多列テーブル（自由な列数） | |
| 事務所の写真 | 画像（1枚） | |
| 事務所概要 | 表（項目と内容） | |
| アクセス | 箇条書き（中黒・番号） | |
| 地図 | 埋め込み（YouTube・地図など） |
全14種類のパーツのうち、10種類は製品版でのみ使えるものです。とくに多列テーブル（自由な列数）は、報酬表のように「業務・報酬・実費」と3列以上並べたいときに欠かせません。製品版では約50種類のパーツが使えます。
パーツの小ワザ
ホームで使っている「オーバーレイ（画像リンク・横並び）」は、2つ並べるのがおすすめのレイアウトです。このデモではあえて3つ並べていますが、1マスが狭くなるぶん、見出しは短くする必要があります。
目安は、1カラムのフレームなら5〜6文字、2カラムなら4文字まで。このデモでは「相続」「不動産」「会社」と短くして、正式な名前は下の説明文に逃がしました。「相続・遺言」のように長い見出しを入れると、途中で折り返して読みづらくなります。
ゼロから作らなくて大丈夫です
このデモを、そのままお使い頂くことも可能です
製品版をご購入いただいた方には、このデモと同じ中身が入った状態のデータをご利用頂く事も可能です。
デモデータをご希望の場合は、ご購入後にお問い合わせください。
このデモをベースに「ゼロ」から作るお客様向けです。すでにFrames CMSでページを作られている場合、デモのデータを入れると既存の内容は引き継がれません。作りかけのサイトがある方は、パーツを1つずつ置いていく通常の方法をおすすめします。
作るときの参考に
士業サイトで迷いやすいところ
このデモを作るときに考えたことを、いくつか書いておきます。
- 報酬をサイトに載せるべきでしょうか
- 載せた方が問い合わせは増えます。士業に相談する方が一番不安なのは「いくらかかるか分からない」ことだからです。
このデモでは「66,000円〜」のように下限だけを出し、別途かかる実費を同じ表に並べました。登録免許税などの実費は事務所の取り分ではないので、分けて書いておくと誤解が起きません。
金額の下に「これは目安で、前提が変われば事前に見積り直す」と一言添えておくのが、あとで揉めないコツです。 - ページはどう分ければいいですか
- 取扱業務ごとに1ページが基本です。検索してくる方は「相続登記 〇〇市」のように業務名で探すので、業務ごとにページがある方が届きます。
このデモでは、相続・不動産・会社の3ページに分け、そこに「費用の目安」と「事務所案内」を足しました。ページが増えたら、サイドメニューの見出しでグループ分けしてください。 - 解決事例や実績は載せていいですか
- 守秘義務があります。依頼者が特定できる情報（地名・時期・金額・家族構成の組み合わせ）は、匿名にしていても特定されることがあります。
このデモでは解決事例のページを作っていません。代わりに「よくいただくご相談」として、誰のことでもない一般的な相談例を箇条書きで並べました。同じ役割を、リスクなしで果たせます。 - できない業務についてはどう書きますか
- 書いておいた方が親切ですし、事務所も守れます。このデモでは、よくあるご質問の中で「遺産分割の話し合いの代理は弁護士の業務」「相続税の申告は税理士の業務」とはっきり書き、提携先を紹介する旨を添えました。
問い合わせの段階で線が引けていると、お互いに無駄な時間が減ります。 - 法改正の案内はどこに置けばいいですか
- このデモでは、相続・遺言のページの上部にアラート（黄色い帯）で「相続登記の義務化」を置きました。そのページを見に来た人に、必ず目に入る位置です。
お知らせにも1本書いておくと、記事として検索にも拾われます。両方に置くのがおすすめです。 - ブログは必要ですか
- 更新が止まったブログは、かえって印象が悪くなります。無理に始める必要はありません。
このデモは「お知らせ」だけで、記事は7本。相談会の日程、法改正、報酬表の更新など、実務のついでに書けるものに絞っています。月に1本でも十分です。
この構成で作れるサイト
司法書士以外にも
このデモは司法書士事務所を想定していますが、同じ構成のまま、内容を差し替えるだけで使える業種がたくさんあります。
行政書士／税理士／社会保険労務士／弁護士／土地家屋調査士／中小企業診断士／設計事務所／不動産管理会社／各種コンサルティング など、「取扱業務」と「費用」と「誰がやるか」を伝えたいところであれば、そのまま当てはまります。
2カラム（サイドメニュー）のフレームは、工務店・学習塾・介護施設・自治体まわりの団体など、ページ数が多くなりがちなサイトにも向いています。1カラムのフレームに切り替えることも、あとからいつでもできます。
まずは無料で試せます
Free（無料版）のご案内
Frames CMSには無料版があります。登録不要でダウンロードでき、期限もありません。
ご自身のサーバーに設置して、管理画面の使い勝手を確かめてから、製品版をご検討ください。
無料版で作ったページやお知らせは、製品版に切り替えてもそのまま残ります。作り直しは必要ありません。
<< デモ一覧に戻る