Please Sign In or Register

Signwriter

タイトルやコンテンツの見出し、またはコンテンツ内の指定したタグ内の文字列を、用意した TrueType フォントから生成された画像に置き換えて表示するモジュールです。

sIFR モジュールと似ていますが、Signwriter モジュールは GD を利用しています。
[ ダウンロード : http://drupal.org/project/signwriter ]

レビュー

このモジュールの使い方は大きく分けると、以下の 2 通りになります。

  1. コンテンツ内で利用する入力フィルタとして利用する。
  2. テーマテンプレートに組み込み、サイトタイトルやコンテンツタイトルで利用する。

ここでは 1. の方法についての設定内容を紹介します。
(2. についてはテーマの作成についての解説に含めようと考えています。)

Signwriter の機能を入力フィルタとして使用するためには以下の手順での設定が必要です。

  1. [管理セクション] → [サイトの環境設定] → [Signwriter] で Signwriter 全体の設定
  2. [管理セクション] → [サイトの環境設定] → [Signwriter] → [プロフィールの追加] で Signwriter プロフィールを追加
  3. [管理セクション] → [サイトの環境設定] → [入力書式] で Signwriter プロフィールで設定した入力フィルタを設定

また、[管理セクション] → [ユーザの管理] → [アクセスコントロール] から、このモジュールの管理についての権限を設定できます。

1. [管理セクション] → [サイトの環境設定] → [Signwriter] から Signwriter の設定を行ないます。

Signwriter の設定

プロフィール
作成したプロフィールの一覧です。
Signwriter では、入力フィルタとして利用するための設定をプロフィールとして作成します。
新しいプロフィールの追加や作成したプローフィールの編集/削除のページへ移動します。
キャッシュディレクトリー
Signwriter で作成した画像の保存場所を指定します。
デフォルトでは Drupal のルートに signwriter-cache ディレクトリを作成する設定になっていますが、ファイルシステムで設定したファイルの保存場所と同一にする場合は files/signwriter-cache のように設定します。
フォント検索パス
Signwriter が自動的にフォントを検出する Drupal ルートディレクトリ、files ディレクトリ、現在使用中のテーマディレクトリ以外からもフォントを検出したいときは、ここに : (コロン)で区切ったディレクトリのリストを入力します。
例) profiles/japanese/fonts:sites/default/fonts:files/fonts

2. [管理セクション] → [サイトの環境設定] → [Signwriter] → [プロフィールの追加] で Signwriter で使用するフォントやタグの設定などを設定します。

プロフィールを複数作成することで、表示画像のフォントの色や大きさなどを、条件に応じて変更できるようになります。

Signwriter プロフィールの追加

プロフィール名
設定した内容を管理するための固有の名前を入力します。
Pattern to Match When Used as a Filter
入力フィルタとして使用するタグを Perl の正規表現を使って設定します。
すべての見出しタグをフィルタとして利用する場合) /<h.*?>.*?<\/h.*?>/s
H1 の見出しタグだけをフィルタとして利用する場合) /<h1.*>.*?<\/h1>/s
signwriter というタグをフィルタとして利用する場合) /<signwriter>.*?<\/signwriter>/
フォント
使用するフォントのファイル名を .ttf の拡張子なしで指定します。
フォントサイズ
フォントのサイズを指定します。
「最大幅 (Max Width)」が設定してある場合は、最大幅に合わせてフォントサイズが変更されますので、ここでの設定は無効になります。
画像タイプ
画像の種類を選択します。 gif, png, jpeg, bmp が選択できます。
背景色
生成される画像の背景色を 6 桁の 16 進数で指定します。
赤) ff0000 , 青) 0000ff , 緑) 00ff00 , 白) ffffff , 黒) 000000
ここで設定する色をページの背景色の近似色に設定することで、アンチエイリアス画像を透過処理する際にキザキザの縁取りができてしまという現象を避けることができます。
「透過処理」や「背景画像」を設定した場合は、この設定は無効となり、「透過処理」や「背景画像」が優先されます。
前景色
テキストのフォントの色を 6 桁の 16 進数字で指定します。
透過処理
透過処理する場合はチェックします。有効にすると「背景色」で設定した色を透明な色とした画像が生成されます。
ページの背景に使用している画像を「背景色」の代わりに表示したい場合などには有効に設定します。
背景画像
生成される画像で使用する背景画像へのパスを Drupal ディレクトリからの相対パスで指定します。
背景画像は、繰り返して表示されませんので、指定した画像の縦×横サイズで表示しきれない文字列はカットされます。
Width
生成する画像の横幅をピクセル単位(数値のみ)で設定します。
ここで設定した横幅で表示しきれないテキストはカットされます。
Height
生成する画像の高さをピクセル単位(数値のみ)で設定します。
ここで設定した高さで表示しきれないテキストはカットされます。
Max Width
生成する画像の最大幅をピクセル単位(数値のみ)で設定します。
ここで設定した最大幅の範囲内ですべて表示できるよう、テキストのフォントサイズが自動的に調整されます。
テキスト横寄せ
画像の幅がテキストの幅より広い場合、行揃えの方法を選択できます。背景画像または「幅 (Width)」の設定が必須です。
横方向の位置
画像の左端から(右寄せテキストの場合は画像の右端から)テキストの開始位置までの距離を、ピクセル単位(数値のみ)で設定します。
縦方向の位置
画像の上端からテキストのベースライン(またはそれに相当するもの)までの距離を、ピクセル単位(数値のみ)で設定します。

そのうち、Perl の正規表現や画像処理についての解説ページも作成する予定です。

3. [管理セクション] → [サイトの環境設定] → [入力書式] で Signwriter の入力フィルタを有効にします。

追加した Signwriter プロフィールの名前が入力書式のフィルタ名として表示されますので、必要なものを有効にします。
また、HTML フィルタが設定してある書式では、Signwriter のフィルタとして使用されるタグの使用を許可する必要があります。

スクリーンショットと入出力の結果

Signwriter

入力フィルタを " /<signwriter>.*?<\/signwriter>/ " として設定している場合の入力内容と出力結果は以下の通りです。
画像と一緒に非表示のテキストデータも出力されるので、サーチエンジンにも有効です。

コンテンツの内容 :
<signwriter>Drupal<signwriter>
出力結果とその HTML コード :
<signwriter>
    <span style='display: none'>Drupal</span>
    <img src='/files/signwriter-cache/*****.png' alt='Drupal' />
</signwriter>

注意事項など

このモジュールは MySQL データベース( mysql, mysqli )に signwriter テーブルを作成します。
XREA サーバなど、セーフモードが ON になっているサーバでは putenv() に関するエラーが出力されるようです。
また、putenv() に関するエラーの影響だと思いますが、通常はフォント名だけでよいはずのフォントパスを Drupal ディレクトリからの相対パスで入力しなければ動作しませんでした。

日本語翻訳

Signwriter モジュール 翻訳ファイル5.X | Drupal-jBox.net で公開されています。
一部、日本語化に対応していない部分があったり、モジュールの t() 内のエスケープ文字が不足していることで、翻訳ファイルのインポート/エクスポートを行なっても po ファイルに出力される内容と実際の内容と異なってしまっているため翻訳できないという部分があったりします。

バグや問題点についての情報

トラックバック

トラックバックは承認後に表示されます。

URLから "-nospam" を削除してトラックバックを送信してください。