cookieでCSSを操ろう

• たとえばCSSを複数用意する。
• 訪問者にCSSを選んでもらう。
• 次に来たときには選んだCSSで表示する。

それではどうしようか。

一般的な方法としてどうなのかはよくわからんけど、とりあえずcookieで何とかできないものかと考えたわけで。

cookieにCSSの情報を記録しておこうではないか(・∀・)b

基本的に知っておくべきこととしては

• cookieは発行したサイトにアクセスしたときに勝手に情報を送信する
• 送信された情報はサーバ側で環境変数として使用可能

ということくらいだろうか。

Zopeでcookieに関連したものとしては「setCookie()」というのがあるようだ。

<dtml-call expr="RESPONSE.setCookie('クッキーに保存する変数の名前', '値', expires='日付')">

みたいなふうにするらすぃ（他にもオプションはある）。

のでこれを使うことにするナリ。

プルダウンメニューでCSSを選ばせるのはこの前考えたこれを利用する。でもって、選んでもらったCSSをcookieに保存しておけばいいですかな。

ふだんはNagosui_cssというCSSを適用しているけど、ここでNagosui_css_2というもう一つのCSSを用意し、cssという変数によって変えることにしよう。

ということでプルダウンメニューの部分はこんな感じで。

<form method="post" action="index_html">
  <select name="css">
    <option value="none" selected disabled >Select CSS</option>
    <option value="default">default</option>
    <option value="dark">dark</option>
  </select>
  <input type="submit" value="Change">
</form>

#value="default"を選んだ場合にはNagosui_cssを、#value="dark"を選んだ場合にはNagosui_css_2を適用するようにする。

cssという変数にdefault/darkという値をぶち込んでPOSTするのだヾ(*`Д´)ノ

ということでサイトのヘッダ部分は、REQUESTの中にcssという変数があるかどうかによって条件分岐。

<dtml-try>
  <dtml-if expr="REQUEST.css == 'default'">
    <style type="text/css" media="all">@import "Nagosui_css";</style>
     <dtml-call "RESPONSE.setCookie('css', 'default', expires=(ZopeTime() + 30).rfc822())">
  <dtml-elif expr="REQUEST.css == 'dark'">
    <style type="text/css" media="all">@import "Nagosui_css_2";</style>
     <dtml-call "RESPONSE.setCookie('css', 'dark', expires=(ZopeTime() + 30).rfc822())">
  <dtml-else>
    <style type="text/css" media="all">@import "Nagosui_css";</style>
     <dtml-call "RESPONSE.setCookie('css', 'default', expires=(ZopeTime() + 30).rfc822())">
  </dtml-if>
<dtml-except>
    <style type="text/css" media="all">@import "Nagosui_css";</style>
     <dtml-call "RESPONSE.setCookie('css', 'default', expires=(ZopeTime() + 30).rfc822())">
</dtml-try>

expiresの書き方に少しとまどったのだけど、ZopeTime()は日付でカウントしているということをどこかで読んだことがあったので、そ れをrfc822フォーマットで出力すればよいと考えて、無事書くことができました。ここでは一応30日間保存しておくように設定しておきまふ （ZopeTime()+ 30のところ）。

とりあえず今回も一応予想通りの動きはしてくれたのでホッと一安心です。

あんまりスマートじゃないような気がしないでもないですが(*´Д`)…