Theme options/ja: Difference between revisions
From LimeSurvey Manual
(Updating to match new version of source page) |
(Updating to match new version of source page) |
||
Line 3: | Line 3: | ||
__TOC__ | __TOC__ | ||
<div class="mw-translate-fuzzy"> | |||
<div class="simplebox">[[File:help.png]] '''LimeSurvey 3'''では、まったく新しいテンプレートエンジンシステムを導入しました。[https://twig.symfony.com/ Twig 1.29]と[https://getbootstrap.com/ Bootstrap]を使用しており、テンプレートの継承と設定が可能になります。</div> | <div class="simplebox">[[File:help.png]] '''LimeSurvey 3'''では、まったく新しいテンプレートエンジンシステムを導入しました。[https://twig.symfony.com/ Twig 1.29]と[https://getbootstrap.com/ Bootstrap]を使用しており、テンプレートの継承と設定が可能になります。</div> | ||
</div> | |||
Line 11: | Line 13: | ||
=はじめに= | =はじめに= | ||
<div class="mw-translate-fuzzy"> | |||
LimeSurvey 3には'''テンプレートオプション'''という新機能があり、アンケートのテンプレートに関連した設定を素早く簡単に変更する様々なツールを利用できます。 | LimeSurvey 3には'''テンプレートオプション'''という新機能があり、アンケートのテンプレートに関連した設定を素早く簡単に変更する様々なツールを利用できます。 | ||
</div> | |||
=テンプレートオプションパネル= | =テンプレートオプションパネル= | ||
<div class="mw-translate-fuzzy"> | |||
新しい'''テンプレートオプション'''機能は[[Survey settings/ja|アンケート設定]]からアクセスします。 | 新しい'''テンプレートオプション'''機能は[[Survey settings/ja|アンケート設定]]からアクセスします。 | ||
</div> | |||
Line 21: | Line 27: | ||
<div class="mw-translate-fuzzy"> | |||
パネルのツールバーは2つのタブから構成されています。簡単なオプションとテンプレートエディターの高度なオプションです。 | パネルのツールバーは2つのタブから構成されています。簡単なオプションとテンプレートエディターの高度なオプションです。 | ||
</div> | |||
==簡単なオプション== | ==簡単なオプション== | ||
<div class="mw-translate-fuzzy"> | |||
アクセスすると次のページが読み込まれます。 | アクセスすると次のページが読み込まれます。 | ||
</div> | |||
Line 32: | Line 42: | ||
<div class="mw-translate-fuzzy"> | |||
{{Alert|Title=注意|text= 各々のテンプレートには、アンケートの'''テンプレートオプション'''から変更できる特定のオプションがあります。このウィキセクションでは、LimeSurveyの既定のテンプレートである'''fruity'''を使って素早さと簡便さを説明しますが、HTML・php・CSSに関する事前の知識なしにテンプレートに強力な変更を加えることが可能です。}} | {{Alert|Title=注意|text= 各々のテンプレートには、アンケートの'''テンプレートオプション'''から変更できる特定のオプションがあります。このウィキセクションでは、LimeSurveyの既定のテンプレートである'''fruity'''を使って素早さと簡便さを説明しますが、HTML・php・CSSに関する事前の知識なしにテンプレートに強力な変更を加えることが可能です。}} | ||
</div> | |||
あらかじめ'''簡単なオプション'''が選択されています。もっとも重要なアンケートテンプレートをここで変更することができます。 | あらかじめ'''簡単なオプション'''が選択されています。もっとも重要なアンケートテンプレートをここで変更することができます。 | ||
<div class="mw-translate-fuzzy"> | |||
* '''すべて継承する:''' ''はい''を選択すると、すべてのテンプレート設定がグローバル[[Themes/ja|設定レベル]]から継承されます。''いいえ''をクリックして右上の'''保存'''ボタンを押すと、より多くのテンプレート設定オプションが表示されます。それぞれのオプションは以下のように設定できます。 | * '''すべて継承する:''' ''はい''を選択すると、すべてのテンプレート設定がグローバル[[Themes/ja|設定レベル]]から継承されます。''いいえ''をクリックして右上の'''保存'''ボタンを押すと、より多くのテンプレート設定オプションが表示されます。それぞれのオプションは以下のように設定できます。 | ||
** アンケートグループのテンプレート設定を継承する - ''継承(Inherit)''(変更しない限り、アンケートのテンプレートはグローバルテンプレートを継承します。) | ** アンケートグループのテンプレート設定を継承する - ''継承(Inherit)''(変更しない限り、アンケートのテンプレートはグローバルテンプレートを継承します。) | ||
** グローバルテンプレートの設定を継承しない - ''いいえ'' | ** グローバルテンプレートの設定を継承しない - ''いいえ'' | ||
** ''はい''。選択すると、テンプレート設定は好きなように変更できます。それぞれのテンプレート設定で''継承''が選べます。 | ** ''はい''。選択すると、テンプレート設定は好きなように変更できます。それぞれのテンプレート設定で''継承''が選べます。 | ||
</div> | |||
{{Box|継承の仕組みは3つのレベルで適用されます。 | {{Box|継承の仕組みは3つのレベルで適用されます。 | ||
Line 52: | Line 66: | ||
===継承しない=== | ===継承しない=== | ||
<div class="mw-translate-fuzzy"> | |||
上述の通り、アンケート設定メニューから[[Themes/ja|グローバルテンプレート設定]]を'''継承しない'''という設定にすることができます。'''保存'''ボタンをクリックすると、多くのオプションが表示されます。 | 上述の通り、アンケート設定メニューから[[Themes/ja|グローバルテンプレート設定]]を'''継承しない'''という設定にすることができます。'''保存'''ボタンをクリックすると、多くのオプションが表示されます。 | ||
</div> | |||
Line 58: | Line 74: | ||
<div class="mw-translate-fuzzy"> | |||
{{Box|本機能が強力であることを示すため、以下の説明は'''fruity'''テンプレートに基づいています。テンプレートによって独自のカスタマイズオプションがあります。}} | {{Box|本機能が強力であることを示すため、以下の説明は'''fruity'''テンプレートに基づいています。テンプレートによって独自のカスタマイズオプションがあります。}} | ||
</div> | |||
*'''Ajaxモード:''' ''はい''にすると、アンケートページはajaxによって素早く読み込まれます(''平均的なLimeSurveyユーザー向けです'')。''いいえ''にすると、ページは再読み込み操作によって読み込まれます。デバッグ向きです。 | *'''Ajaxモード:''' ''はい''にすると、アンケートページはajaxによって素早く読み込まれます(''平均的なLimeSurveyユーザー向けです'')。''いいえ''にすると、ページは再読み込み操作によって読み込まれます。デバッグ向きです。 | ||
Line 74: | Line 92: | ||
<hr width="50%" style="margin:auto"> | <hr width="50%" style="margin:auto"> | ||
<div class="mw-translate-fuzzy"> | |||
*'''背景画像:''' ''いいえ''にすると、グループまたはグローバルのテンプレートとは異なる背景画像を選択することができます。テンプレート設定パネルの一番下にある'''アップロード'''ボタンをクリックし、好みの画像を選択することにより、背景画像をアップロードすることもできます。 | *'''背景画像:''' ''いいえ''にすると、グループまたはグローバルのテンプレートとは異なる背景画像を選択することができます。テンプレート設定パネルの一番下にある'''アップロード'''ボタンをクリックし、好みの画像を選択することにより、背景画像をアップロードすることもできます。 | ||
*'''ロゴ:''' ''いいえ''にすると、アンケート名がトップバーに表示されますが、''はい''にすると、ディレクトリにあるファイルの一つをロゴ画像として選択することができます。 | *'''ロゴ:''' ''いいえ''にすると、アンケート名がトップバーに表示されますが、''はい''にすると、ディレクトリにあるファイルの一つをロゴ画像として選択することができます。 | ||
</div> | |||
<hr width="50%" style="margin:auto"> | <hr width="50%" style="margin:auto"> | ||
Line 85: | Line 105: | ||
*'''ラジオボタンアニメーション:''' ''はい''にすると、ラジオボタンタイプの質問の選択肢を選んだときにアニメーションが起動します。 | *'''ラジオボタンアニメーション:''' ''はい''にすると、ラジオボタンタイプの質問の選択肢を選んだときにアニメーションが起動します。 | ||
<div class="mw-translate-fuzzy"> | |||
{{Box|アニメーションに使用されているライブラリーは[https://daneden.github.io/animate.css/ animate.css]です。別のアニメーションライブラリーを組み込むこともできます。}} | {{Box|アニメーションに使用されているライブラリーは[https://daneden.github.io/animate.css/ animate.css]です。別のアニメーションライブラリーを組み込むこともできます。}} | ||
</div> | |||
<div class="mw-translate-fuzzy"> | |||
{{Note|期間の欄に数字を入力します。10と入力すると、アニメーションは10秒継続します。}} | {{Note|期間の欄に数字を入力します。10と入力すると、アニメーションは10秒継続します。}} | ||
</div> | |||
<hr width="50%" style="margin:auto"> | <hr width="50%" style="margin:auto"> |
Revision as of 17:17, 5 June 2021
Install テンプレートオプションを利用するには、Limesurvey 3.0+をインストールしてください。このオプションは古いバージョンのLimeSurveyでは使用できません。
はじめに
LimeSurvey 3にはテンプレートオプションという新機能があり、アンケートのテンプレートに関連した設定を素早く簡単に変更する様々なツールを利用できます。
テンプレートオプションパネル
新しいテンプレートオプション機能はアンケート設定からアクセスします。
パネルのツールバーは2つのタブから構成されています。簡単なオプションとテンプレートエディターの高度なオプションです。
簡単なオプション
アクセスすると次のページが読み込まれます。
各々のテンプレートには、アンケートのテンプレートオプションから変更できる特定のオプションがあります。このウィキセクションでは、LimeSurveyの既定のテンプレートであるfruityを使って素早さと簡便さを説明しますが、HTML・php・CSSに関する事前の知識なしにテンプレートに強力な変更を加えることが可能です。
あらかじめ簡単なオプションが選択されています。もっとも重要なアンケートテンプレートをここで変更することができます。
- すべて継承する: はいを選択すると、すべてのテンプレート設定がグローバル設定レベルから継承されます。いいえをクリックして右上の保存ボタンを押すと、より多くのテンプレート設定オプションが表示されます。それぞれのオプションは以下のように設定できます。
- アンケートグループのテンプレート設定を継承する - 継承(Inherit)(変更しない限り、アンケートのテンプレートはグローバルテンプレートを継承します。)
- グローバルテンプレートの設定を継承しない - いいえ
- はい。選択すると、テンプレート設定は好きなように変更できます。それぞれのテンプレート設定で継承が選べます。
継承の仕組みは3つのレベルで適用されます。
- グローバルレベル(テンプレートリストから選択可能)他の2つのレベルはグローバルテンプレートを継承します。
- アンケートグループレベル(アンケート設定パネルから設定可能)アンケートグループレベルのテンプレート設定はグローバルテンプレート設定を継承します。
- アンケートレベル. アンケートテンプレート設定は、アンケートグループのテンプレート設定を継承します。
- フルーツフォント: フルーツテンプレートで使用するフォントを選択します。
- フルーツのバリエーション: ドロップダウンリストからフルーツテンプレートのバリエーションを選択します。フォントとアイコンの色が変わります。
継承しない
上述の通り、アンケート設定メニューからグローバルテンプレート設定を継承しないという設定にすることができます。保存ボタンをクリックすると、多くのオプションが表示されます。
本機能が強力であることを示すため、以下の説明はfruityテンプレートに基づいています。テンプレートによって独自のカスタマイズオプションがあります。
- Ajaxモード: はいにすると、アンケートページはajaxによって素早く読み込まれます(平均的なLimeSurveyユーザー向けです)。いいえにすると、ページは再読み込み操作によって読み込まれます。デバッグ向きです。
- アンケートコンテナ: はいにすると、アンケートは幅が制限されているコンテナの中に表示されます。これは、アンケートの幅がコントロールされている携帯電話やタブレットからアンケートに答えるときに有効です。すべての質問を読んだり、回答の選択肢を見るために横方向にスクロールする必要がないため、回答者にとってより快適なものになります。一定の幅になっているブログや掲示板にアンケートを埋め込む場合には、このオプションをいいえにすることもできます。
- 質問枠線: はいにすると、各質問は枠線内に表示されます。いいえにすると、質問は枠線を使いません(画面幅より大きな配列質問タイプを使うことができます)。
- 質問シャドウ: はいにすると、質問枠線のまわりにシャドウが表示されます。
- 背景色: 質問、回答の背景色を選択します。
- フォントカラー: ポップアップメニューから好みのフォントカラーに変更します。
- 質問背景色: ポップアップメニューから好みの質問背景色に変更します。
- チェックアイコン: 複数選択質問タイプに使われるチェックアイコンを選択します。
- 背景画像: いいえにすると、グループまたはグローバルのテンプレートとは異なる背景画像を選択することができます。テンプレート設定パネルの一番下にあるアップロードボタンをクリックし、好みの画像を選択することにより、背景画像をアップロードすることもできます。
- ロゴ: いいえにすると、アンケート名がトップバーに表示されますが、はいにすると、ディレクトリにあるファイルの一つをロゴ画像として選択することができます。
- bodyアニメーション: はいにすると、アンケートの"body"が読み込まれたときに適用されるアニメーションを選べます。
- 質問アニメーション: はいにすると、質問が読み込まれたときに適用されるアニメーションを選べます。
- 警告アニメーション: はいにすると、アンケート内の警告(アンケートが保存されなかったとき、異常なトークンが入力されたとき)に対し、指定したアニメーションが適用されます。
- チェックボックスアニメーション: はいにすると、回答をチェックする度にアニメーションが起動します。
- ラジオボタンアニメーション: はいにすると、ラジオボタンタイプの質問の選択肢を選んだときにアニメーションが起動します。
アニメーションに使用されているライブラリーはanimate.cssです。別のアニメーションライブラリーを組み込むこともできます。
- フルーツフォント: テンプレートで使用するフォントを選択します。
- フルーツのバリエーション: ドロップダウンリストからテンプレートのバリエーションを選択します。フォントとアイコンの色が変わります。
- アップロード: テンプレートで使用するロゴや背景となる画像をアップロードします。LimeSurveyでアップロードされた画像を格納する"/themes/survey/fruity/files"フォルダーへの書き込み権限が必要です。
高度なオプション
テーマオプションタブを開くと、 簡単なオプションか高度なオプションのどちらかを使って編集するか選ぶことができます。“高度なオプション”は、データベースからメインのテーマ設定欄に直接アクセスできるフォームです。動作原理を理解するため、XMLファイルやスクラッチでテーマを作成することも理解しなければなりません。したがって、非常に複雑で上級者向けです。
それでも高度な設定の編集をしたければ、高度なオプションタブをクリックします。
- Files css: テンプレートに含めるCSSファイル
- Files js: テンプレートに含めるJSファイル
- Files Print Css: テンプレートを印刷するときに読み込むCSSファイル
- Options: テンプレートビューに必要なオプション(とその設定値)
- CssFramework Name: 読み込むCSSフレームワークの名前。現時点では、Bootstrapか何も指定しないかとどちらかです。
- Cssframework Css: コアのbootstrap.cssを、カスタマイズしたものに置き換えます。
- Cssframework Js: コアのbootstrap.jsを、カスタマイズしたものに置き換えます。
- Packages To Load: この設定により、LimeSurveyからコアのアセットパッケージを読み込ませることができます。
画面上部から、テーマのディレクトリーにファイルをアップロードすることができます。 これらのパラメーターは、テーマの全体的な外観を変えるために使用します。