Scriptoのテーマ化

Scriptoのテーマは、Scriptoプロジェクトと関連するOmeka Sサイトの外観を統一する方法です。まず、サイトのナビゲーションからプロジェクトへのリンクを作成することによって、Scriptoプロジェクトをサイトに関連付けます。Omeka Sサイトのダッシュボードで、「ナビゲーション」設定に進み、サイトのナビゲーションに「Scripto」を追加します。ユーザーがあなたのサイトを訪れたとき、そのナビゲーションリンクは、サイトのコンテキストをScriptoに提供し、付随するScriptoテーマを適用します。

既存のScriptoテーマを使用する

Scriptoテーマに必要なのは、以下のサブディレクトリにあるScriptoモジュール内のスタイルシート（.css）ファイルのみです：Scripto\asset\css\site-themes\。スタイルシートの名前はあなたのサイトテーマディレクトリの名前と一致している必要があります。

Omeka Sテーマ「Papers」は、War Departmentプロジェクトのテーマをベースにしており、そのScriptoテーマを以下のパスに含んでいます：asset/css/scripto/papers.css。このテーマを有効にする方法は2つあります。

スタイルシートファイルを手動でScriptoモジュールにコピーする。

CSSファイルをScriptoモジュール内の適切なディレクトリにコピーします。Omeka Sインストール内でのパスはこんな感じです：[$ROOT]/modules/Scripto/asset/css/site-themes。Scriptoテーマに変更を加えたい場合、あなたのスタイルはその場所から読み込まれるでしょう。

コマンドラインを使用する。

この方法は技術的なユーザー向けです。「Papers」テーマはGulpを使用してSass/CSSのコンパイルを管理し、Scriptoテーマをエクスポートするための特定のタスクを持っています。このタスクを使用するには、コマンドライン経由でテーマフォルダのルートに移動しgulp scriptoと入力します。これにより、Scriptoテーマがコンパイルされ、Scriptoモジュールがインストールされていることを前提に正しいフォルダに配置されます。注：ScriptoテーマはGulpやSassを使用する必要はないので、この方法は常に選択肢であるわけではありません。

Scriptoテーマの作成

Scriptoテーマに必要なのは、以下のサブディレクトリ内のScriptoモジュールにあるスタイルシート（.css）ファイルのみです：Scripto/asset/css/site-themes/。スタイルシートの名前はあなたのサイトテーマディレクトリの名前と一致する必要があります。注：全てのScriptoカスタマイズはCSS経由で制御されているため、テーマ提供者はScriptoのマークアップを変更することはできません。

@import CSSルールを使用すると、既存のスタイルをインポートすることで、Scriptoテーマの基盤を素早く作成することができます。例として再び「Papers」テーマを使用する場合、あなたの@importルールは以下のようになります：

@import url('../public-app.css');
@import url('../../../../../themes/papers/asset/css/style.css');

このインポートは、カスタムScriptoテーマからデフォルトのScriptoテーマおよびサイトテーマへの相対パスを使用しています。これであなたはスタイルの上書きとScripto専用のCSSを書くことができるようになります。

ScriptoテーマでSassを使う

Omeka S自体およびその多くのテーマと同様に、「Papers」テーマはGulpとSassを使用してスタイルを管理しています。これらのツールを使用する予定がある場合、以下は「Papers」テーマのルートで実行する必要のあるコマンドです：

npm install：テーマのNode依存関係をインストールします。これはどんなツールを使う前に必要です。
gulp css：このコマンドはasset/sass内のあなたの.scssファイルを見て、それぞれのCSSファイルをasset/cssにエクスポートします。
gulp css:watch：このコマンドはgulp cssと同じ機能をしますが、コマンドが停止されるまでasset/sassフォルダの変更を監視し続けます。
gulp scripto：このコマンドはgulp cssと同じ機能をしますが、Scriptoテーマのファイルを含みます。
gulp scripto:watch：このコマンドはgulp css:watchと同じ機能をしますが、Scriptoテーマのファイルを含みます。

テーマアセット

重要な注意点：ScriptoはCSSを完全に制御しているため、サイトテーマのテーマオプション、例えばユーザー設定の画像アセットや色とは相互作用できません。Scriptoテーマと一緒にカスタムの背景やロゴをサイトテーマで使用する予定の場合は、画像をサイトテーマ内のフォルダに保存し、相対パスで適切に参照してください。