検索結果: Atelier

隠居のBlog備忘録: MT4.1 でエントリー部分のみを印刷する

　友人から、ブログのヘッダー部分や右サイドメニューを外して、エントリー部分のみを印刷できないかの質問を受けた。確かに、ヘッダー部分や右サイドメニューが印刷されるのは少々うっとうしい。

　方法をググッテみるといつもテンプレートを使わせてもらっている「小粋空間」さんに、「印刷用スタイルシート」というカストマイズがあることが分かった。このカスタマイズは、印刷をするときには、スタイルシートを切り替える仕様になっている。MT4.1、「小粋空間」さんのテンプレート（layout-two-column-liquid-right ）の私のブログ環境に導入してみたので備忘録として書き留めておきたい。
　

印刷用スタイルシート追加を追加する。
　管理画面のデザイン→テンプレート→インデックス・テンプレートの表示で「インデックステンプレートを作成」クリックして、以下のように新しいインデックス・テンプレートを作成する。
- テンプレートの名前：ForPrinting（なんでもよい）
- 出力ファイル名：print.css
- 再構築オプション：チェックを外す
- このテンプレートにリンクするファイル：（空白）
- テンプレートの中身：スタイルシート（styles-site.css）の中身を丸ごとコピー

印刷用スタイルシートの修正
コピーしたスタイルシートで本体のヘッド部分と右サイドメニューが印刷プレビューで表示されないように、該当スタイルのID属性、クラス属性をいじった。
　私の場合、具体的にはスタイルシートの次の項目を青字で書いた部分を付加した。

#header 
    {
     /* padding: 15px;
    border-bottom: 1px solid #669;
    color: #999;
    background-image: url("http://n-huhei.net/Libraly/Image/Wood_ipe_01.gif");   
    background: #8fabbe; 
   text-align: left;     */
   display: none;
}

#links-left-box dl,
#links-right-box dl {
  /*  margin: 0;
    padding: 0;   */
      display: none;
    }

/* 2カラムリキッドレイアウト(右サイドバー) */
.layout-two-column-liquid-right #content {
    /* margin: 0 250px 10px 0px;  */
    margin: 0 10px 0px;    
   /* border-bottom: 1px solid #669;
    border-right: 1px solid #669;
    background-color: #ffffff;  */
    border-style: none; 
}

テンプレートに link 要素追加
　次に、モジュールテンプレートの「ヘッダー」 <head> 部にあるスタイルシートを呼び出している部分を次の青字部分を追加した。
実際には、この部分を先に付加しておいて、ブログのエントリーを表示し、ブラウザーのツールバー「ファイル」→「印刷プレビュー」で確認しながら print.css をいじる試行錯誤をした。
```
   <link rel="stylesheet" href="<$MTLink template="スタイルシート"$>" type="text/css" media="screen,tv" />
   <link rel="stylesheet" href="<$MTBlogURL$>print.css" type="text/css" media="print" />
```

カスタマイズの結果
　左のスクリーンショットは、このカスタマイズをしていない場合とカスタマイズした後との印刷画面の比較である。
　カスタマイズした後は、ヘッダーと右サイドメニューが印刷画面に出てこないので、エントリー部分のみを印刷できる。

追記文章の折りたたみ

　最近は、Web Radio に熱中していたので、いつもブログの改修に参考させてもらっている「小粋空間」さんへの訪問が少なくなっていた。久しぶりに覗いてみると「追記文章の折りたたみ」というカスタマイズが出ていた。以前から、できたら手を加えたいなと思っていたカスタマイズなので早速取り組んで見ることにした。

続きを読む "追記文章の折りたたみ"

favicon の設置

　１１月１２日に、私のサイトの簡単な favicon(Favorite Icon) を作成して設置した。イニシャルを組み合わせただけの簡単なアイコンである。このときは Firefox では表示の確認ができたが、InternetExplorer 7（IE7）では表示されなかった。急ぐことでもないので放ってあったが、少し時間ができたのでサーチしてみると favicon を web で使える形式（.ico）に変換してくれる英語のサイトに、ズバリのQ&Aがあった。どうやら、キャッシュをいったんクリアにしなければならないようだ。IE7の「ツール」→「閲覧の履歴の削除」→「ファイルの削除」「履歴の削除」だけではうまくいかず、「ツール」→「インターネットオプション」→「全般」タブ→「閲覧の履歴」→「設定」で「インターネット一時ファイル」を「Webサイトを表示するたびに確認する」を選択すると「タブブラウザー」にも favicon が表示されるようになった。１６X１６pixの中に表示しなければならないので、凝ったものを作るのは難しいが。
　ＩＥ７での表示がうまくいったので、私のサイトにコメントやトラックバックをいただく人にはいまのところ favicon を設置されている方はいないのであるが、ついでに「小粋空間」さんで紹介されている＜Ｆａｖｉｃｏｎをコメント・トラックバックに表示する＞をトライした。紹介されているプラグインのリリース元　gemal.dk：Favicon Pluginでは、「小粋空間」さんがインストールされた以降、 Version Up されており現在は Version 1.4 Works with Movable Type 3.3x となっている。 Version Up されているので「小粋空間」さんで紹介されている方法通りにはいかないが、することはほぼ同じである。異なるのは、DLした favicon.zip を解凍してできる Favicon というフォルダーを /mt/cgi/plugin にフォルダーごとアップロードすることである。管理画面のプラグイン Favicon の起動でエラーがでるが、自らのコメントやトラックバックで試してみるとうまくいっているようである。エラーの原因をもう少し調査してみたい。また宿題ができた。　

続きを読む "favicon の設置"

番号リストで番号を降順にする方法は？

　自分のWeblogを中心とするホームページに手を加えた事項を備忘録的に書き留めて、カストマイズ履歴のページをテンプレートとして作成している。カストマイズした項目のリストは新しいカストマイズが一番上にきているが、リストの番号は一番最新のものが常に１番であった。この番号はできれば最新のカストマイズが何番目のカストマイズかを示したいので、番号は降順にして１番目にしたカストマイズは１番にしたい。HTMLのコードでは、HTML4.01の仕様書でもそのような方法は記載されていないらしく、HTMLコードではどうも駄目らしい。Googleで「HTML 降順　リスト　ol li」でサーチすると、人力検索？Hatena:：Qustionで「HTML番号リストで番号を逆順にする方法は？」という質問があり、その回答に andi さんという方が JavaScript での解決を提示されておられる。この JavaScript をいただいて、カストマイズ履歴テンプレートに貼り付けてみると希望通りの表示になった。ただし、このJavaScriptは、</ol>　の後に貼り付けると上手くいくようだ。なお、<ol>　は下のScript 似合わせて　<ol　id=hoge>　とValue属性が必要である。　ちなみに、この JavaScript は以下の通りである。

<script>
var o = document.getElementById("hoge");
var max = o.childNodes.length;
for(var i = 0;i < max;i ++){
o.childNodes[i].value = max - i;
}
</script>

続きを読む "番号リストで番号を降順にする方法は？"

MT3.33-ja に VersionUp

　MT3.3-ja にクロスサイトスクリプティングの脆弱性があるとのことで、万が一を考え MT3.33-ja にアップグレードすることにした。この９月２６日にリリースされたばかりである。備忘録的に記録することにした。
　私の環境は、サーバーのレンタル先が lolipop で、DBには SQlite を使用している。lolipop から提供されている「既に MovableType をインストール済みの場合の最新版へのアップグレードの方法」マニュアルは db が SQlite の場合となっているので、これに従って実施することにした。以前から沢山のファイルをUPするときのFTPソフトは DreamweaverMX を使ってきたが、IEを使っても簡単にできることが最近になって気が付いた。今回も IE でバックアップを取った。ただ、やり方が拙かったのか旧バージョンの cgi/mt ディレクトリーを丸ごと削除しようとすると上手くいかない。仕方なく少し手間であるが、 DreamweaverMX を使って mt ディレクトリーを丸ごと削除し、解凍した MT3.33-ja　をUP（PUT)した。マニュアルには、mt-config.cgi と sqlitedb はバックアップしたファイルをUPすることになっている。　mt-config.cgi はmt ディレクトリーのルートにあるからすぐ分かるが sqlitedb は mt/db ディレクトリーにある。
　前回のアップグレードで苦い経験しているカスタマイズしたプラグインを特定し、バックアップからUPしたと思っていたが、plugins ディレクトリーのルートにあるファイルのUP（PUT)を見落としていたため、カテゴリー項目の並び方につかっている cutfirstchar.pl などのファイルが落ちておりカテゴリ項目の表示が頭３桁の数字が表示されたりした。もう一つのミスは、.cgi ファイルの属性変更である。 mt ディレクトリー直下にある .cgi ファイルの属性は７００（lolipopでは、７５５でなく７００になっている）に変更したが（これが結構面倒な作業である。一括で変更できる方法がないものか。）、SCodeディレクトリーにある mt-scode.cgi は見落とした。その結果、コメントスパム対策に要求している入力すべき数字が現れない現象が起きた。そのあたりを修復するとほぼバージョンアップ前の状況になったが、MT3.3用に新たにインストールしたテンプレートを編集するためのプラグイン BigTemplateWindow が上手く動いていない。ただ、今回はカスタマイズを　What's　New？で簡単に記録していたことがずいぶん役に立った。カスタマイズの記録は今後も必要であろう。

Reform e-Words

　「MTでつくる最強のブログサイト」で紹介されていた関連IT用語表示（e-words）を取り入れていた。　私の友だちのような高齢者向けに、IT用語を説明するサービスのつもりだった。ただ、defaultでは用語のリストの文字が大きく、また、●のリストマークも気に入らなかった。いじれる部分はないかと e-words のスクリプト部分 embed.x で検索すると「小粋空間」さんの埋め込み e-words を使うというエントリーが見つかった。カスタマイズのカテゴリーでは収載されていなかったので気が付いていなかったのだ。早速、利用させていただいて、従来のテーブルイメージのものと切り替えた。テンプレートも折りたたみなど多くのカスタマイズも「小粋空間」さんのものを利用させていただいているので、全体のバランスがよくなり気に入っている。掲載されているコードに、文字コードutf8を指定する部分と折りたたみのJavaScriptを付加するだけで上手くいった。いつもながらに、yujiroさんに感謝です。

続きを読む "Reform e-Words"

Atelier

Atelierで“Customize”タグの付いているブログ記事

隠居のBlog備忘録: MT4.1 でエントリー部分のみを印刷する

タグ:

追記文章の折りたたみ

タグ:

favicon の設置

タグ:

番号リストで番号を降順にする方法は？

タグ:

MT3.33-ja に VersionUp

タグ:

Reform e-Words

タグ:

Atelier

Atelierで“Customize”タグの付いているブログ記事

隠居のBlog備忘録: MT4.1 で エントリー部分のみを印刷する

タグ:

追記文章の折りたたみ

タグ:

favicon の設置

タグ:

番号リストで番号を降順にする方法は？

タグ:

MT3.33-ja に VersionUp

タグ:

Reform e-Words

タグ:

隠居のBlog備忘録: MT4.1 でエントリー部分のみを印刷する