データ項目を追加
個人設定の項目は、plone 2.0.5 ではフルネーム、メールアドレスなどの項目があります。 ここに、ニックネームや所属組織名、血液型、性別などを設定できるようにします。
まず最初に個人設定として登録できる項目を増やします。
- この項目は
portal_memberdataというツールに設定してあります。 zope の管理画面でportal_memberdataを選択します。
- 次に、
Propertiesタブをクリックします。
plone 2.0.5 は初期状態では下記の項目をメンバーごとの情報として管理するようになっています。
Valueに入っている値は初期値として使用されます。- email: メールアドレス
- portal_skin: 使用するスキン
- listed: メンバーの検索リストに記載するかどうか
- login_time: ログインした日時
- last_login_time: 最後にログインした日時
- fullname: フルネーム
- visible_ids: ショートネームの編集をするかどうか
- wysiwyg_editor: コンテンツ編集時に使用するエディタ
- error_log_update: 謎
- formtooltips: 謎
- この画面で追加したい項目を画面下のフォームに入力して
Addボタンを押します。 ここでは下記の項目を登録します。データの型は全部stringでいいと思います。- nickname: ニックネーム
- organization: 所属組織名
- blood: 血液型
- sex: 性別
項目を追加した結果はこんな感じになります。所属組織名には初期値を設定してみました。
これで、個人設定の項目としてこれらの項目を登録するための準備はできました。
次に、これらの項目をメンバーが自分で設定できるようにするために、個人設定の画面に入力フィールドを追加します。
設定画面に項目追加
目次
- 概要[overview]
- カスタマイズ用にコピー[copy]
- テキストフィールドを追加[text]
- セレクトフィールドを追加[select]
- 顔写真サイズの変更[portrait]
- 日本語化[japanese]
- 個人設定画面の確認[display]
- ソースコード[soruce]
概要[overview]
portal_memberdata にプロパティを追加して項目が設定できるようになったので、次は個人設定画面で追加した項目を入力できるようにします。
追加した項目とその名前、入力方式は以下のようにします。
- nickname: ニックネーム: テキストフィールド
- organization: 所属組織名: テキストフィールド
- blood: 血液型: 「未指定/A/B/O/AB」から選択
- sex: 性別: 「未指定/男性/女性」から選択
それとは別に顔写真の表示サイズを 192x192 と大きくしてみます。
カスタマイズ用にコピー[copy]
まず最初に、入力画面をカスタマイズ用にコピーします。
個人設定画面は portal_skins/plone_prefs/personalize_form
にあります。
ZMI(zope 管理画面)でこのアイテムを開いて Customize ボタンをクリックします。
テキストフィールドを追加[text]
それではカスタマイズ用にコピーした personalize_form のソースを編集して、ニックネームと所属組織名の入力フィールドを追加しようと思います。
そのために、テキストフィールドはどのように記述されているか見て真似しようと思います。 フルネームの入力用のテキストフィールドは、以下のように記述されています。:
<div class="field"
tal:define="error errors/fullname | nothing;
fullname python:request.get('fullname', member.getProperty('fullname', ''));"
tal:attributes="class python:test(error, 'field error', 'field')">
<label for="fullname" i18n:translate="label_full_name">Full name</label>
<div tal:content="error">Validation error output</div>
<input type="text"
id="fullname"
name="fullname"
size="25"
tabindex=""
value="member.fullname html_quote"
tal:attributes="value fullname;
tabindex tabindex/next;"
/>
</div>
上記のコードをコピーして、fullname の部分を nickname や organization に、label_full_name の部分を label_nick_name や label_organization に変更します。
セレクトフィールドを追加[select]
次に、血液型や性別を設定するための入力フィールドを追加しようと思います。
こちらはテキストフィールドではなく選択式にしたいので、wisiwyg_editor の記述を参考にしてみます。
エディタを指定する部分は以下のように記述されています。ちょっと複雑です。:
<div class="field"
tal:define="wysiwyg_editor python:request.get('wysiwyg_editor',
member.getProperty('wysiwyg_editor',''))">
<label for="wysiwyg_editor" i18n:translate="label_content_editor">Content editor</label>
<div class="formHelp" i18n:translate="help_content_editor">
Select the content editor that you would like to use.
Note that content editors often have specific browser
requirements.
</div>
<select name="wysiwyg_editor"
id="wysiwyg_editor"
tabindex=""
tal:attributes="tabindex tabindex/next;">
<tal:block tal:repeat="editor site_properties/available_editors">
<option tal:condition="python:editor != 'None'"
value="None"
tal:attributes="value editor;
selected python:test(editor==wysiwyg_editor, 'selected', None);"
tal:content="editor">
WYSIWYG-editor
</option>
<option tal:condition="python:editor == 'None'"
value="None"
tal:attributes="value editor;
selected python:test(editor==wysiwyg_editor, 'selected', None);"
tal:content="editor"
i18n:translate="label_ordinary_content_editor">
Ordinary Form-based Editor (works in all browsers)
</option>
</tal:block>
</select>
</div>
ちょっと複雑な感じがしますが、ポイントは ''-</tal:block> の部分です。
最初にエディタの一覧を取得してそれを tal:repeat でループして選択肢として表示しています。
また、test(editor==wysiwyg_editor,... と書いてある部分で実際の値と比較して、設定してある値が、選択された状態になるようにしています。
ただ、血液型などは値が固定なので、外部から取得せず直接ここに書き込んじゃおうと思います。
というわけで、こんな感じのコードを追加します。:
<div class="field"
tal:define="blood python:request.get('blood', member.getProperty('blood',''))">
<select name="blood"
id="blood"
tabindex=""
tal:attributes="tabindex tabindex/next;">
<option value="">--</option>
<tal:block tal:repeat="val python:('A', 'B', 'O', 'AB')">
<option value="None"
tal:attributes="value val;
selected python:test(val==blood, 'selected', None);"
tal:content="val"
i18n:translate="">
Blood
</option>
</tal:block>
</select>
</div>
顔写真サイズの変更[portrait]
次に、顔写真の表示サイズを変更します。
これは簡単で、personalize_form の以下のコードで height と width の値を変えるだけです。:
<img src="" alt=""
height="100"
width="75"
class="portraitPhoto"
style="float: right;"
tal:condition="portrait"
tal:attributes="src portrait/absolute_url"
/>
ここでは 192(pixel) × 192(pixel) に変更しました。
ただし、画像のサイズを変更する場合は、defaultUser.gif
もあわせて変更した方がいいと思います。
日本語化[japanese]
追加した項目の日本語表示に対応するために、po ファイルに項目を追加します。
po ファイルの修正はサーバ上のファイルを直接編集して行います。(ZMI からは行えません)
Products/CMFPlone/i18n ディレクトリの下にある plone-ja.po ファイルに以下のような項目を追加します。
msgid "label_nick_name" msgstr "ニックネーム" msgid "label_organization" msgstr "所属" msgid "label_blood" msgstr "血液型" msgid "label_sex" msgstr "性別"msgid "Male" msgstr "男性" msgid "Female" msgstr "女性"
msgid "A" msgstr "A型" msgid "B" msgstr "B型" msgid "O" msgstr "O型" msgid "AB" msgstr "AB型"
また、msgid "help_portrait" に「幅75ピクセル、高さ100ピクセル」という記述があるので、ここも変更しておきます。
編集が終わったら ZMI で
Control_Panel/TranslationService/CMFPlone.i18n-plone-ja.po
にアクセスして再読み込みを実行するか、
zope サーバを再起動してください。
個人設定画面の確認[display]
コードが作成できたら、個人設定画面が正しく表示され、値が設定されるかを確認します。
ソースコード[soruce]
個人設定画面に「ニックネーム」「所属組織名」などの項目を追加した場合の、
personalize_form のソースコードは下記のリンクから参照してください。
プロフィール表示ポートレット
目次
- 概要[overview]
- Script 作成[script]
- ポートレット作成[create]
- ソースコード[source]
概要[overview]
さて、 データ項目を追加 を 設定画面に項目追加 でメンバーが自分のプロフィール情報を登録できるようになりました。
しかし、このままでは登録した情報は自分しか見ることができません。
そこで、メンバーのホームにアクセス時にプロフィール情報を参照できるように、ポートレットを作成します。
今回作成するのは以下の2つの Skript と1つの Page Template です。
getMemberByIdId からメンバーのデータを取得する Python Script。getDispnameId からメンバーの表示用の名前を取得する Python Script。portlet_profileプロフィールを表示するポートレット本体。
Script 作成[script]
最初に2つのスクリプトを custom フォルダに作成します。 このスクリプトはポートレットの中で使用されます。
このスクリプトをわざわざ外だしにした理由は、Page Template の中で記述すると複雑になるということもありますが、それよりも 「管理者権限じゃないと実行できないメソッド」を使用している。 ということの方が重要です。
例えば getMemberById スクリプトでは、CMFCore/MembershipTool.py で定義されている
getMemberById(id) というメソッドを使用しています。
このメソッドはメンバーは実行できず、管理者権限を持ったユーザでないと実行できません。 そこで zope の Proxy roles という機能を使って、スクリプトに管理者権限を与えます。
スクリプト等に管理者権限を与えるためには、その対象となるアイテムの
proxy タブをクリックします。
すると、Proxy roles 設定画面が表示されるので、与えたい権限(この場合は Manager)を選択して Save Changes ボタンをクリックします。
このように設定することにより、普通のメンバーが実行できる Script の中で、管理者権限がないと実行できないメソッドが実行できるようになります。
ポートレット作成[create]
ここまででプロフィール情報を表示するためのポートレットを作成する準備ができました。
あとは、custom フォルダに portlet_profile という名前の Page Template
を作成します。
なお、画像の表示時に /thumb
と指定してサムネイルを表示していますが、この記述方法でサムネイルを表示できるようにするためには、
ImageTag_CorePatch 0.3
をインストールする必要があります。
ポートレットを作成したら、設定を行います。
このポートレットはメンバーのホーム以下に動作するので、
Members フォルダのプロパティに left_slots または right_slots
の値として here/portlet_profile/macros/portlet を設定します。
メンバーのページを参照して、ポートレットのプロフィール情報が表示されていることを確認します。
以上で、各メンバーでプロフィール情報を参照できるようになります。
ソースコード[source]
ここで説明した Script, Page Template のソースコードは下記のリンクから参照してください。