１５分で質問掲示板を公開する

※NOTE

質問掲示板のご利用にＦＡＱの公開は不要です。
質問掲示板にデータ量の制限はありません。

※NOTE

掲示板の紹介文とは、質問掲示板を利用する上でのルールや留意事項、あるいは機能の説明を記載した文章のことで、質問掲示板のトップ画面に表示されます。

１．　リンクメニューからマスタメンテをクリックします。

２．　ニュースを確認します。重要な機能の更新等についての案内もあるので必ずチェックしましょう。

３．　クライアントＩＤ、メールアドレス、パスワードを入力してログインします。

※NOTE

サービスが開始している状態とは、お客様のサイト上でＦＡＱ＠Ｍａｋｅｒが公開可能なことを意味します。サービスが停止した場合、お問い合わせ等一部の機能が利用できなくなりますが、既に公開されているＦＡＱの参照や質問掲示板の利用は可能です。

１．　サービスのステータスを確認します。

２．　サービスのステータスが運用中の場合は、「サービスの停止」ボタンを押してサービスを停止します。

※　はじめてログインしたときはサービスは停止しているので何もする必要はありません。

１．　アクセスメニューから「掲示板紹介文作成」を選びます。

２．　「質問掲示板紹介文編集」が開くので、「質問掲示板を利用する」欄の「利用する」をクリックしてください。

※　既に利用している場合この作業は必要ありません。

３．　「デフォルト」ボタンをクリックします。

４．　「プレビュー」が表示されるので、内容を確認した後「作成」ボタンをクリックしてください。

※NOTE

紹介文の内容を編集したい場合は、マニュアルの掲示板紹介文についてを参照してください。

１．　「サービスを開始」ボタンをクリックします。

２．　「ログアウト」をクリックします。

※NOTE

必ずマスタメンテ画面でサービスを開始して、基本設定に漏れやミスが無いか確認してください。
※　サービスの開始を行う際に、基本設定に漏れやミスが無いかシステムが自動でチェックをします。
※　サービスの開始が確認ができた後は、サービスを停止してもエンドユーザーはＦＡＱや質問掲示板を参照できます。
※　一方サービスを停止すると、エンドユーザーはお問合せ機能や要望･意見機能を利用できなくなります。
ＦＡＱを公開するＦＡＱ＠Ｍａｋｅｒへのリンクは、必ずポップアップかＩＦＲＡＭＥをご利用ください。

※NOTE

エンドユーザーが質問掲示板に気づかなければ、質問掲示板を公開する意味がありません。なるべく分かりやすい場所に分かりやすい表記で公開してください。
＜例＞　画面のヘッダーまたはフッターに「質問掲示板」と書かれた目立つ画像を用意する

※　本章を読む前に、こちらからFancyBoxを梱包した「lib.js」をダウンロードしておいてください。
※　FancyBoxから最新のソースをダウンロードした場合、本章の説明では動作しない可能性があります。

※NOTE

この例では「FancyBox」のほか「JQuery」を使用しています。これらの使用に不都合がある場合は、オンラインマニュアルの「質問掲示板の公開」を参照してみてください。

１．　「lib.zip」を解凍して、「jquery.fancybox」フォルダーを取り出し、そのまま任意の場所に配置します。

※　ここでは、質問掲示板を公開するＷＥＢページと同じディレクトリに配置しました。

２．　ヘッダー要素内で以下のようにjavascriptファイルとcssファイルを宣言します（赤字の部分です）。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>sample</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="jquery.fancybox/jquery.fancybox.css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.fancybox/jquery.fancybox-1.2.1.pack.js"></script>
</head>

※　必ず「DOCTYPE」を宣言する事を忘れないでください。

３．　同様にヘッダー要素内で以下のようにjavascriptの関数を宣言してください。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>sample</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="jquery.fancybox/jquery.fancybox.css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.fancybox/jquery.fancybox-1.2.1.pack.js"></script>
<script type="text/javascript" language="JavaScript" >
  $(document).ready(function() {
    var screenHeight = 375;
    if(!!window.screen) {
      screenHeight = screen.availHeight * 0.7;
    }
    $("a.iframe").fancybox({
      'hideOnContentClick': false,
      'frameWidth': 710,
      'frameHeight': screenHeight
    });
  });
</script>
</head>

４．　ボディー要素内にＦＡＱ＠Ｍａｋｅｒへのリンクを作成します。

<a class="iframe" href="'http://www.faqatmaker.jp/faq/html/bbs/qaList.html?cd=100001" >
質問掲示板
</a>

※　「href」属性の値は以下のようになります。
'http://www.faqatmaker.jp/faq/html/bbs/qaList.html?cd=お客様のクライアント番号

５．　以下は全体のサンプルHTMLです。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>sample</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="jquery.fancybox/jquery.fancybox.css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="jquery.fancybox/jquery.fancybox-1.2.1.pack.js"></script>
<script type="text/javascript" language="JavaScript" >
  $(document).ready(function() {
    var screenHeight = 375;
    if(!!window.screen) {
      screenHeight = screen.availHeight * 0.7;
    }
    $("a.iframe").fancybox({
      'hideOnContentClick': false,
      'frameWidth': 710,
      'frameHeight': screenHeight
    });
  });
</script>
</head>

<body>
  <a class="iframe" href="'http://www.faqatmaker.jp/faq/html/bbs/qaList.html?cd=100001">
    質問掲示板
  </a>
</body>
</html>

※NOTE

上記の方法でうまく動作しない場合は、オンラインマニュアルの方法を参照してみてください。