CMS履歴(2020/03/22更新)

他のテンプレートや、自社のオリジナルデザインにCMSを組み込む方法

まずは、CMSが使えるかの確認から

  1. CMSがあなたのサーバーで動くか、試用版を試して下さい。
    ※試用版が動作しない場合は、弊社CMSは使えません。
    試用版を試す

下準備

  1. あなたのサイトの文字コードが「UTF-8」になっているか確認して下さい。
    htmlの上の方に、<meta charset="UTF-8">など、「UTF-8」の文字があれば問題ありません。
  2. 文字コードに問題なければ、冒頭のステップでテストをした「試用版」ファイルから以下だけ抜き出し、あなたのサイトフォルダに移動して下さい。
    ※同じフォルダ名やファイル名があると上書きされてしまいます。ご注意下さい。
  3. 続いて、original_sampleset.zipをダウンロード&解凍します。
    original_sampleset.zipのダウンロード

    画像がない場合の代替画像(noimg.png)と、スタイルシート(stylestyle.css)の2枚のファイルが入っています。
    cssは、オリジナルデザインにCMSを組み込みやすくする為に弊社で用意したものです。後で変更して頂いて構いません。
    こちらの2枚のファイルもあなたのサイトに移動して下さい。
  4. 以下より、あなたのサイトの編集作業に入ります。

全ページ共通の編集作業に入ります

既存サイトをコピーし、コピーしたもので作業を行なって下さい。
いきなり本サイトで設定すると問題が出た場合に復旧しづらくなります。

  1. 全てのhtmlファイルの<head>内に以下のスタイル読み込みタグを追加。
    既存サイトのcss読み込み行より下に配置して下さい。

    ※cssファイル名は任意のものに変更して頂いても構いません。変更の際は、cssファイル本体のファイル名も変更しておきましょう。
    他、例えばcssフォルダがある場合は「css/stylestyle.css」としてもらっても構いません。この場合も、指定した階層に移動するのを忘れず。

  2. トップページへのリンク先を全て「<a href="./">」に変更。
  3. CMS出力用のメニューとリンクを設定。liタグを使うなど、今使っているサイトのコーディングに合わせて調整して下さい。
    ※以下は試用版を試すための設定です。物件項目は変更できます。

    ▼出力イメージです。※スタイルはテスト確認後にそちらで整えて下さい。
  4. サブブロックにおすすめ物件出力用のタグを追加。
    1カラムレイアウトの場合はメインコンテンツ内でも構いません。

    ▼出力イメージです。※スタイルはテスト確認後にそちらで整えて下さい。

トップページの編集に入ります

  1. トップページ(通常はindex.html)のファイル名をindex_.htmlとアンダーバー入りに変更。

    index_.htmlのファイル名は変更しないで下さい。
    プログラムがこのファイルをトップページとして読み込んで出力しますので、ファイル名は変更しないで下さい。また、他にindex.htmlがあるとそちらが優先表示されてしまいますので、作らないように。index_.htmlというファイル名ですが、実際にこのファイルにアクセスする事はありません。通常のindex.html同様、http://〜〜〜/で開きます。

  2. index_.htmlを開き、現在の物件数を出力するタグを追加。

    ▼出力イメージです。※スタイルはテスト確認後にそちらで整えて下さい。
  3. 新着物件情報のタグを追加。

    ▼出力イメージです。※スタイルはテスト確認後にそちらで整えて下さい。
  4. お知らせ欄の出力タグを追加。

    ▼出力イメージです。※スタイルはテスト確認後にそちらで整えて下さい。

続いて物件一覧ページの準備に入ります

  1. 既存ファイルをコピペし、list.htmlというファイル名のファイルを作成します。
    メインコンテンツ内は空にしておいて下さい。
  2. list.htmlのhead内に以下のタグを追加します。
  3. list.htmlのメインブロック内に以下のタグを貼り付けます。
  4. 実際の一覧ページの出力サンプルを見る場合はこちら。

続いて物件詳細ページの準備に入ります

  1. 既存ファイルをコピペし、item.htmlというファイル名のファイルを作成します。
    メインコンテンツ内は空にしておいて下さい。
  2. item.htmlのhead内に以下のタグを追加します。
    上のlist.htmlをベースにする場合、list.htmlのheadに入れたタグは削除して以下を追加して下さい。
  3. メインブロック内に以下のタグを貼り付けます。
    重要な説明がテキストで入っていますが、読んだあとは削除しておいて下さい。
  4. 実際の詳細ページの出力サンプルを見る場合はこちら。

最後に、物件専用フォームの準備に入ります

  1. 既存ファイルをコピペし、toiawase.htmlというファイル名のファイルを作成します。
    list.htmlやitem.htmlを土台にする場合は、head内に追加したタグは削除しておいて下さい。
    また、メインコンテンツ内は空にしておいて下さい。
  2. メインブロック内に以下のタグを貼り付けます。
    重要な説明がテキストで入っていますが、読んだあとは削除しておいて下さい。
  3. 実際の出力サンプルを見る場合はこちら。

フォームに関する補足

toiawase.htmlは「一般のお問い合わせフォーム」としての利用もできます。物件フォームの場合、詳細ページからリンクをつなぐことで自動的に物件IDと名称が入りますが、toiawase.htmlへのリンクを以下のurlでつなぐと、一般フォームとして開きます。
<a href="./?act=toiawase">お問い合わせ</a>
実際の出力サンプルはこちら。

サーバーにアップロードして動作確認

テスト用フォルダを作ってそちらで動作確認をして下さい。いきなり本番サイトへの上書きはしないように。
動作に問題なければcssなどお好みに合わせて調整しなおして下さい。

導入ページのレイアウトが崩れている場合

既存サイトのスタイルより優先順位が低い場合、スタイルが反映されません。
!importantを加えてみて下さい。強制的に適用されます。
例:color: #FFF !important;

既存サイトのレイアウトが崩れている場合

CMS用で読み込んでいるstylestyole.cssファイルに同じスタイル名がある可能性があるので確認して下さい。

『高機能版』不動産CMSのマニュアル・FAQについては

マニュアルはこちら。
FAQ集はこちら。

どうしもうまくいかない場合

サポート掲示板からご質問下さい。無償サポートの範囲内で対応させて頂きます。

<< 1つ前のページに戻る