Actions

Themes/ja: Difference between revisions

From LimeSurvey Manual

(Created page with "テーマを'''全般設定'''から変更すると、選択したテーマは、作成するすべてのアンケートの既定のテーマになります。 アンケート...")
(Created page with "=開発= File:theme_overview.jpg")
 
(12 intermediate revisions by 2 users not shown)
Line 20: Line 20:
アンケート内の '''テーマ設定パネル'''を使用して特定のアンケートのテーマを変更した場合、そのアンケートのテーマのみが変更されます。
アンケート内の '''テーマ設定パネル'''を使用して特定のアンケートのテーマを変更した場合、そのアンケートのテーマのみが変更されます。


==Global setting default theme==
==全般設定の既定のテーマ==


<center>[[File:default theme setting.png]]</center>
<center>[[File:default theme setting.png]]</center>


==Theme options panel==
==テーマ設定パネル==
This option changes the theme for a particular survey.
このオプションは、特定のアンケートのテーマを変更します。
To access the new '''theme options''' feature, go to the [[Survey settings|survey settings]]:
新しい'''テーマ設定'''機能にアクセスするには、[[Survey settings/ja|アンケート設定]]に移動します。


<center>[[File:Survey menu - theme options.png]]</center>
<center>[[File:Survey menu - theme options.png]]</center>


=Available list of themes=
=利用できるテーマの一覧=
The list of themes available can be access from the Administration Dashboard. Configuration > Advanced > Themes <br>
利用できるテーマの一覧は管理ダッシュボードからアクセスできます。設定 > アドバンス > テーマ <br>
<center>[[File:list of themes.png|800px]]</center>
<center>[[File:list of themes.png|800px]]</center>




The list is divided into 5 columns:
一覧には5つのカラムがあります。
*'''Preview of the theme:''' This shows how the theme will look like when used.
*'''プレビュー:''' テーマを使用するときどのように見えるかを表します。
*'''Theme title:''' Specifies the name of the theme.
*'''名前:''' テーマの名称です。
*'''Description of the themes:''' Users can always get more information about the theme using the URL on the description.
*'''説明:''' ユーザーは説明にあるURLからいつでもテーマに関する詳細な情報を取得することができます。
*'''Type of theme:''' Core themes are themes provided with LimeSurvey and cannot be changed while User themes are extended themes added in upload directory by users.
*'''タイプ:''' コアテーマはLimeSurveyが提供するテーマ、ユーザーテーマはユーザーがアップロードディレクトリーに追加した拡張テーマです。
*'''Extends:''' if the theme extends other themes, the name of the extended theme will be displayed here.
*'''継承:''' テーマが他のテーマを拡張したものである場合、元になったテーマがここに表示されます。
*'''Last Column with some action buttons:''' The last Column contains five buttons as shown on the image.
*'''アクションボタンのある最後のカラム:''' 最後のカラムには以下の図にある5つのボタンがあります。
The buttons are ways in which a theme can be edited and each button will be explained in details below,
ボタンはテーマを編集する方法であり、以下で詳細に説明します。


**'''Theme editor:''' it will redirect you to the theme editor
**'''テーマエディター:''' テーマエディターに移動します。
**'''Theme options:''' it will lead you the global configuration of theme options
**'''テーマ設定:''' テーマ設定のグローバル設定が表示されます。
**'''Uninstall:''' it will delete the configuration entries of a theme in the database
**'''アンインストール:''' データベース内のテーマの設定項目を削除します。
**'''Install:''' it will load the manifest of a theme to add it to database and make it available for selection at the survey level
**'''インストール:''' テーマのマニフェストを読み込んでデータベースに追加し、アンケートレベルで選択できるようにします。
**'''Reset:''' This will completely reset the theme.
**'''リセット:''' テーマを完全にリセットします。




==Theme editor==
==テーマエディター==
The LimeSurvey '''core themes''' (default themes) cannot be modified. The "extend" button give users the opportunity for a core theme to be modified(extended).
LimeSurveyの'''コアテーマ'''(既定のテーマ)は変更できません。"拡張"ボタンからコアテーマを変更(拡張)することができます。


<div class="simplebox">[[File:help.png]] This documentation assumes you already know how to use the Template Editor in the previous version of LS. </div>
<div class="simplebox">[[File:help.png]] このドキュメントは、旧バージョンのLimeSurveyのテンプレートエディターの使用方法に関する知識があることを前提にしています。</div>


The fruity theme is used for this demonstration on how to extend/modify a theme using the theme editor.
このデモでは、テーマエディターを使ってテーマを拡張/変更する方法について、fruityテーマを使用して説明します。


When the theme editor button is clicked, the page below is displayed. The theme can be previewed using the "Previous" and "Next" buttons. The screen size can be adjusted to see how responsive the theme is on all devices.
テーマエディターボタンをクリックすると、以下のページが表示されます。"戻る""次へ"ボタンを押すとテーマのプレビューができます。画面サイズを調整することにより、あらゆるデバイスでのレスポンシブ表示を確認することができます。新しいテンプレートをインポートしたり、現在のテンプレートをzipファイルとしてエクスポートすることができます。
A new template can be imported or the current template can be exported as a zip file.




Line 66: Line 65:
<center>[[File:Theme editor button clicked.png|800px]]</center>
<center>[[File:Theme editor button clicked.png|800px]]</center>
<br>
<br>
  The "Extend" button will ask for a new name to save a copy of the theme you want to modify.
  The "拡張"ボタンを押すと、変更したいテーマのコピーを保存するための新しい名前を聞かれます。この場合、fruityテーマが"extends_fruity"担っています。<br>
In our case, the fruity theme will be named "extends_fruity".<br>




<center>[[File:extended theme edit.png|800px]]</center>
<center>[[File:extended theme edit.png|800px]]</center>


==Theme inheritance overview==
==テーマ継承の概要==
When a theme is extended, a copy of the original theme can easily be modified.
テーマを拡張すると、元のテーマのコピーを簡単に変更できます。
In our case, we have a copy of the fruity theme saved as "extends_fruity" which will be available for use in the list of themes available.
この例では、fruityテーマのコピーが"extends_fruity"として保存され、利用可能なテーマ一覧から利用できるようになります。
<div class="simplebox">[[File:help.png]] Modifying the theme is for advance users with basic knowledge of HTML, CSS and Twig.</div>
<div class="simplebox">[[File:help.png]] テーマの変更はHTML、CSS、Twigの基本的な知識を持つ上級者向けです。</div>
 
=開発=
[[File:theme_overview.jpg]]

Latest revision as of 11:57, 28 November 2022

LimeSurvey 3では、 Twig 1.29Bootstrapをベースにテンプレートの継承とテンプレートオプションが可能なまったく新しいテンプレートエンジンシステムを導入しています。フロントエンドのHTMLページは、ニーズに合わせて100%カスタマイズできます。


Limesurvey 3.0+をインストールすると、アンケートのテーマオプション機能を利用することができます。このオプションは、古いLimeSurveyバージョンでは利用できません


  以下のセクションは作成中です。LimeSurvey 3.xから導入された新しいテーマシステムに関する簡単な説明は、こちらのwikiセクションを参照してください。LimeSurvey 2.xを使用している場合は、こちらのwikiセクションを参照してください(常にアップグレードをお勧めします)。


はじめに

LimeSurvey 3.xでは、テーマオプションが利用でき、アンケート管理者が素早く簡単にアンケートのテーマに関連する設定を変更できる様々なツール一式が利用できます。

テーマを変更する設定

LimeSurvey 3.xでテーマを使用するには、全般設定またはアンケート内のテーマ設定パネルの2つの方法があります。

テーマを全般設定から変更すると、選択したテーマは、作成するすべてのアンケートの既定のテーマになります。 アンケート内の テーマ設定パネルを使用して特定のアンケートのテーマを変更した場合、そのアンケートのテーマのみが変更されます。

全般設定の既定のテーマ

テーマ設定パネル

このオプションは、特定のアンケートのテーマを変更します。 新しいテーマ設定機能にアクセスするには、アンケート設定に移動します。

利用できるテーマの一覧

利用できるテーマの一覧は管理ダッシュボードからアクセスできます。設定 > アドバンス > テーマ


一覧には5つのカラムがあります。

  • プレビュー: テーマを使用するときどのように見えるかを表します。
  • 名前: テーマの名称です。
  • 説明: ユーザーは説明にあるURLからいつでもテーマに関する詳細な情報を取得することができます。
  • タイプ: コアテーマはLimeSurveyが提供するテーマ、ユーザーテーマはユーザーがアップロードディレクトリーに追加した拡張テーマです。
  • 継承: テーマが他のテーマを拡張したものである場合、元になったテーマがここに表示されます。
  • アクションボタンのある最後のカラム: 最後のカラムには以下の図にある5つのボタンがあります。

ボタンはテーマを編集する方法であり、以下で詳細に説明します。

    • テーマエディター: テーマエディターに移動します。
    • テーマ設定: テーマ設定のグローバル設定が表示されます。
    • アンインストール: データベース内のテーマの設定項目を削除します。
    • インストール: テーマのマニフェストを読み込んでデータベースに追加し、アンケートレベルで選択できるようにします。
    • リセット: テーマを完全にリセットします。


テーマエディター

LimeSurveyのコアテーマ(既定のテーマ)は変更できません。"拡張"ボタンからコアテーマを変更(拡張)することができます。

このドキュメントは、旧バージョンのLimeSurveyのテンプレートエディターの使用方法に関する知識があることを前提にしています。

このデモでは、テーマエディターを使ってテーマを拡張/変更する方法について、fruityテーマを使用して説明します。

テーマエディターボタンをクリックすると、以下のページが表示されます。"戻る"、"次へ"ボタンを押すとテーマのプレビューができます。画面サイズを調整することにより、あらゆるデバイスでのレスポンシブ表示を確認することができます。新しいテンプレートをインポートしたり、現在のテンプレートをzipファイルとしてエクスポートすることができます。




The "拡張"ボタンを押すと、変更したいテーマのコピーを保存するための新しい名前を聞かれます。この場合、fruityテーマが"extends_fruity"担っています。


テーマ継承の概要

テーマを拡張すると、元のテーマのコピーを簡単に変更できます。 この例では、fruityテーマのコピーが"extends_fruity"として保存され、利用可能なテーマ一覧から利用できるようになります。

テーマの変更はHTML、CSS、Twigの基本的な知識を持つ上級者向けです。

開発