Tag : Loggix
10 - 12 of 30
Loggix 9.7.28 のカスタマイズ内容(まとめ)
旧Ganesha's Lab.(by SQLite2版Loggix)より移転転記。(2009-12-13)
Loggix 9.7.28 へのアップデート時点でカスタマイズしている内容のまとめ。内容的には以前のエントリーの焼き直しが多いけど、あちこち散らばってしまっているので、ここにまとめておきます。
/.htaccess のカスタマイズ
XREAサーバーの自動広告挿入スクリプトを止めるためのカスタマイズです。/.htaccess に次の一文を追記します。
LayoutIgnoreURI /loggixを設置したディレクトリ名/*
/theme/base.html のカスタマイズ
最新版のファイルを開くと、jQuery や ColorBox 関係のコードがどっと増えていてびっくりする。このファイルの変更点の多さが、今回のアップデートでバックアップ/上書き方式を採らなかった理由のひとつ。カスタマイズしてる部分の方が、修正点がずっと少ない。
38行目の <div id="header"> と39行目の <h1> ~省略~ </h1> の間に、XREAサーバーの手動広告挿入コードを追記します。こんな感じです。
<div id="header"> <!-- Begin #xrea_ad --> <div class="xrea"> <a href="http://img.xrea.com/ad_click.fcg"> <img height="60" src="http://img.xrea.com/ad_img.fcg" width="468" alt="XREAサーバーの広告です" /> </a> </div> <!-- End #xrea_ad --> <h1> ~省略~ </h1>
また、40行目のBlogサブタイトル部分を修正します。
<p>~私的な技術系・物欲系メモ。</p>
CSS関係のカスタマイズ
以前のエントリー、当BlogのHeader周りのデザインをようやく修正で「Loggix のCSSファイル構成には欠点がある」と書き、その処方箋も提示しておいたが、今回のアップデートを機に、この処方箋を実行に移した。
-
まず、/theme/css/default/default.css をdefault_origin.css にリネームした上で、3行目~5行目までの@import構文を削除する。
-
新たな default.css を作成する。その内容は下記のとおり。
@charset "utf-8"; @import url(default_origin.css); @import url(../_import/text.css); @import url(text.css); @import url(modules.css); @import url(user_custom.css);
1.と2.の変更の目的は、オリジナルの default.css 内で指定されているCSS指定を保持しながら、user_custom.cssで上書き指定可能にするためだ。これによって、オリジナルのCSSに対して、どんな修正を行ったのかが一目瞭然となる。
-
/theme/css/default/win_ie.css の修正
同じ目的で、win_ie.css の修正を行う。 オリジナルの win_ie.css では、default.css を@importしているが、@importの階層化はパフォーマンスが落ちるそうなので、各CSSファイルを直接@importするように改める。
@import url(default_origin.css); @import url(../_import/text.css); @import url(text.css); @import url(modules.css); @import url(user_custom.css);
上記の通り、@import構文の部分は default.css と同じになる。 なお、以前のバージョンの Loggix では、当Blogのデザインだとヘッダー周りのCSS指定をIEのみ微調整する必要があったが、最新版ではその必要が無くなった。 また今度微調整が必要になった場合は、win_ie.css に追記して行えばよい。 win_ie.css の記述内容は、オリジナルの default.css と違って少ないので、直接追記してもどこを修正したか分からなくなる心配は少ない。
-
/theme/css/default/user_custom.css については、好みに合わせてカスタマイズすれば良い。一連の修正でCSS編集はこのファイルのみで行えるようになったので、後の管理は大変楽になると思う。
/theme/js/scripts.js のカスタマイズ
ここでは以前のエントリー、Loggix:imgタグのカスタマイズで行ったものと同じ修正を行う。今回のアップデートで scripts.js の内容も随分変わっているようだが、基本的には同じやり方で修正できた。
まず、修正が必要なのは266行目~267行目だ。
- 修正前
var attachCode = '<img src="./data/resources/' + file + '" alt="' + file + '" />';
- 修正後
var attachCode = '<img src="./data/resources/' + file + '" width="' + fileWidth + '" height="' + fileHeight + '" alt="' + file + '" />';
次に、273行目~276行目を修正する。
- 修正前(見やすくするために改行を追加しています)
attachCode = '<a href="./data/resources/' + file + '" class="colorbox">' + '<img src="./data/resources/' + file + '" alt="' + file + '" />' + '</a>';
- 修正後
attachCode = ''<a href="./data/resources/' + file + '" class="colorbox">' + ''<img src="./data/resources/' + file + '" width="' + fileWidth + '" height="' + fileHeight + '" alt="' + file + '" />' + ''</a>';
この修正により、最新版Loggix でも、タグボタンでimgタグを挿入する際に自動的に画像ファイルのwidth値とheight値を取得し、挿入するようになった。
ように見えたが、この機能、IEでないと正常に動作しない。以前のバージョンでも正常に動作しないブラウザがあったが、Safari、Firefox、Opera が全部ダメということは無かった。(ダメなのは一種類だけだったはず)今度のバージョンでは、IE以外のブラウザは全滅だ。IE必須ってのは、ちょっと困るなあ。
Loggix を 9.7.28 にアップデート
旧Ganesha's Lab.(by SQLite2版Loggix)より移転転記。(2009-12-13)
Loggix 9.7.28 がリリースされてから、早くも2ヵ月。「忙しいから、あとでゆっくり」と先送りするのもいい加減にして、そろそろアップデートしなきゃ、ということでアップデートしました。Loggix 自体のバージョンアップや、個人的にカスタマイズした部分がいくつか追加になっているため、前回まとめたアップデート手順だけでは通用しなかったので、改めて覚書を兼ねたアップデート手順改訂版をエントリーしておきます。
Loggix アップデート手順(改訂版)
-
過去ログのバックアップ。
/dataフォルダ内の.dbファイルをバックアップします。 また、/data/resourcesフォルダをフォルダごとバックアップします。
-
最新版 Loggix にカスタマイズ内容を反映させる。
今回は結構大がかりなアップデートだったようなので、 カスタマイズ済みファイルを旧版から引き継がずに、 最新版ファイルにこれまでのカスタマイズ内容を反映させる ことにしました。修正が必要なファイルは下記のとおり。
- /.htaccess
- /theme/base.html
- /theme/css/default/default.css
- /theme/css/default/default_origin.css
- /theme/css/default/win_ie.css
- /theme/css/default/user_custom.css
- /theme/js/script.js
ヘッダーまわりのデザインを修正済みなので、
/theme/css/default/images/header-1.png のバックアップは不要。 個々のファイルの修正内容については、次エントリにまとめるのでそちらを参照のこと。 -
念のために Loggix をインストールしたフォルダを丸ごとリネームして残した状態で、最新版の全ファイルをアップロード。リネームして残した旧版は、最新版が無事動作したのを確認してから削除する。
1.でバックアップしたファイルや、 2.でカスタマイズしたファイルも、ここで併せてアップロードする。
-
下記フォルダ、ファイルのパーミッションを777に変更。 サブディレクトリやファイルのパーミッションまで変更しないように 注意。
- /data
- /data/resources
- /data/loggix.sqlite.db
-
不要なサンプルメニューファイルを削除。(offフォルダ内に移動)
- /plugins/showSamplesMenu.php
以上
旧Ganesha's Lab.(by SQLite2版Loggix)より移転転記。(2009-12-13)
前回、scripts.js のカスタマイズがIE以外では無効と書いたが、関係ありそうな情報をいくつか探してみた。実際に再カスタマイズを試すのは先の話になりそうなので、その時にまた探さなくて済むようにClipしておく。
JavaScript で、画像本来のサイズ(幅, 高さ)を取得する方法 - latest log
JavaScriptで画像の本来の幅と高さを取得する - inamenaiの日記
JavaScript で画像本来のサイズ(幅, 高さ)を取得する : dogmap.jp
Safariでは画像のloadが終わっていないとwidth、heightがうまく取得できない at HouseTect, JavaScripter Blog
考察
上の4つめ、アップデート前の Loggix で Safari のみ画像サイズが取得できなかったのは、これが原因だったんじゃないだろうか。
さて、どのサイトでも共通しているのは、ブラウザによって画像サイズの取得方法を変えなければいけない、ということ。改めて考えてみるとscripts.jsのカスタマイズでやっているのは、imgタグ内にwidthとheightの値を書き出すようにしているだけだから、値の取得方法についてはデフォルトのまままったく触っていない。こっちを追加でカスタマイズする必要があるのだろう。また、最新版で挙動が変わっているのは、やっぱりjQueryを導入したことで前バージョンと画像サイズの取得方法が変わっているんじゃないかと推測。
問題はjQuery関係でファイルがやたら増えているので、どこを弄ればいいかさっぱり分からないこと。ゆっくり時間がとれる時じゃないと弄るのは無理、よって当分先の話。