タグ

ブックマーク / www.koikikukan.com (45)

  • CSSでタイトルバナーに画像を表示する

    ブログの上部タイトル部分の背景に画像を表示するカスタマイズです。CSS のbackground プロパティを利用することで、スクリーンショットのように画像を表示することができます(季節に合わない画像ですいません)。 なお画像は Link Style 様より利用させて頂きました。ありがとうございました。 1.基的な設定方法 バナー部分のHTMLと画像を表示するCSSの基的な構造は次の通りです。 HTML HTMLは h1 タグと a タグでブログのタイトルをリンク表示しているだけです。 <h1><a href="http://~/">タイトル</a></h1> CSS この h1 タグに対し、下記のような CSS を設定すれば背景画像(リストの「画像ファイル名」)が表示されます。リストは画像以外のプロパティを省略しています。 h1 { background-image: url("画像フ

    CSSでタイトルバナーに画像を表示する
  • JavaScript 不要なサイドメニューのツリー化 for Movable Type

    Movable Type で JavaScript を用いずにサイドメニューのリストをツリー化するカスタマイズです。 以前、「サイドメニューのツリー化スクリプト(改)」という記事で Movable Type の各リストを JavaScript を用いてツリー化するカスタマイズを紹介しておりますが、3.2 以降で新しいMTタグ *1 が追加されたことで、ほとんど全てのリストについて、JavaScript を使用せずにツリー化が可能であることが判明しました。 この方法は JavaScript を用いたカスタマイズと比較して、下記のメリットがあります。 ブラウザで JavaScript を OFF にしている場合でもツリー表示が可能 JavaScript 起動による表示遅延がなし JavaScript 関連のカスタマイズが不要 ということで、Movable Type のツリー化についてはエント

    JavaScript 不要なサイドメニューのツリー化 for Movable Type
  • JavaScript 不要なサイドメニューのツリー化 for Movable Type(MTCollate編)

    Movable Type で JavaScript を用いずにサイドメニューのリストをツリー化するカスタマイズで、「JavaScript 不要なサイドメニューのツリー化 for Movable Type」で公開していなかった、MTCollate プラグイン *1 を利用して「最近のコメント」「最近のトラックバック」を表示している場合の方法です(関連記事:MTCollate を使って「最近のコメント」を表示する)。 JavaScript 不要なサイドメニューのツリー化の記事より概要部分を再掲しておきます。 以前、「サイドメニューのツリー化スクリプト(改)」という記事で Movable Type の各リストを JavaScript を用いてツリー化するカスタマイズを紹介しておりますが、3.2 以降で新しいMTタグ *2 が追加されたことで、ほとんど全てのリストについて、JavaScript

    JavaScript 不要なサイドメニューのツリー化 for Movable Type(MTCollate編)
    yz_s
    yz_s 2007/02/13
    MTCollate.pl+PingEntry.pl使用。
  • カテゴリーアーカイブと月別アーカイブのページ分割

    Movable Type でのカテゴリーアーカイブと月別アーカイブのページ分割方法をご紹介します。 参照サイトはMagic whiteさんの「カスタマイズメモその2」経由できままにポロポロさんの「ページ分割」です。あっさりできました。ありがとうございます。 ということで以下に設定方法(プラグインファイルの配置は自宅サーバ用)を記しておきます。 1.プラグインファイルのダウンロード MT Extensions より MTPaginate をダウンロード(ページ上の方にある「Download」をクリック)。ファイルは任意のフォルダ(デスクトップ等)に保存します。 2.プラグインファイルのアップロード ダウンロードしたファイルを解凍し、その中の MTPaginate.pl を plugins ディレクトリにアップロードします。 注:この情報はバージョン1.28のものです。 ダウンロードしたファイ

    カテゴリーアーカイブと月別アーカイブのページ分割
    yz_s
    yz_s 2007/02/12
    MTPaginate.pl使用。
  • トップページのページ分割

    Movable Type のトップページ(メインページ)のページ分割方法をご紹介します。 設定方法は以前エントリーしたカテゴリーアーカイブと月別アーカイブのページ分割とほとんど同じですが、考慮すべき点があることと、前記エントリーと内容を合体させるとタイトルを変更しなければならなくなるため、別エントリーでご紹介します。 1.プラグインファイルのダウンロード MT Extensions より MTPaginate をダウンロード(ページ上の方にある「Download」をクリック)。ファイルは任意のフォルダ(デスクトップ等)に保存します。 2.プラグインファイルのアップロード 注:この情報はバージョン1.28のものです。 ダウンロードしたファイルを解凍し、その中の MTPaginate ディレクトリを下記のディレクトリ構成になるように plugins ディレクトリに丸ごとアップロードします。 p

    トップページのページ分割
    yz_s
    yz_s 2007/02/12
    MTPaginate.pl使用。
  • 小粋空間: Web2.0 Logo Creator (URL変更)

    以前はてなブックマークで人気のあった「Web2.0 Logo Creator by Alex P」を使ってみようと思ってアクセスしたみたところ、404 エラーに。Google で検索しても、同じ URL が紹介されたサイトばかりヒットするので「サービス終了か?」と思いましたが、新しい URL がみつかりました。 ということで下記に掲載しておきます。 旧:http://msig.info/web2.php 新:http://h-master.net/web2.0/ 新:http://creatr.cc/creatr/ こういう場合、はてなブックマーク数はどのように変化するのでしょうか(2007.01.02 時点で旧:667/新:11)。 覚え書きで利用方法も掲載しておきます。既出ですが、配布元の FAQ にある、異なる色およびグラデーションにする方法も記しておきます。 1.ロゴを生成する 下

    小粋空間: Web2.0 Logo Creator (URL変更)
  • 月別アーカイブの折りたたみで年表示に折りたたみのリンクを与える

    月別アーカイブリストの年別の折りたたみで、年表示に折りたたみ用のリンクを与えるカスタマイズです。 これまで紹介してきた「月別アーカイブリストの年別折りたたみ」では、年表示の横に折りたたみマークを表示していましたが、「年表示にリンクを設定できないでしょうか」というご質問を頂きました。たしかに月別アーカイブでは年表示部分に他のアーカイブジャンプするリンクがある訳ではないのでごもっとです。 ということでエントリーにてカスタマイズ方法をご紹介致します。 スクリーンショットは完成例です。ご覧の通り、年表示部分に折りたたみのリンクが表示されます。 1.「月別アーカイブリストの年別の折りたたみ」を行っていない場合 まず、月別アーカイブリストの折りたたみを設定していない方は、「JavaScript 不要な月別アーカイブの年別ツリー化+折りたたみ」を参照して、カスタマイズを行ってください。 設定後、2項

    月別アーカイブの折りたたみで年表示に折りたたみのリンクを与える
    yz_s
    yz_s 2007/02/08
    menufolder.jsの修正が必要。
  • Movable Type 3.x デフォルト・テンプレートのAtomフィードの不具合について

    Movable Type のデフォルトテンプレート Atom フィード(atom.xml)に軽微な不具合があるようです。 Movable Type 3.x デフォルト・テンプレートのAtomフィードの不具合について Movable Type 3.0以降にデフォルト・テンプレートとして含まれている、atom.xmlを生成するテンプレートをそのまま利用していると、2007年に入ってから再構築したときに内容が変わってしまい、ブログの購読者(あなたのブログのAtomフィードを購読している読者)の側で、未読ではない記事が未読として表示されてしまうなどの軽微な問題が起こる可能性があります。 この不具合を解消するためには、リスト1(atom.xml より抜粋)の赤色部分を、リスト2の青色に変更します。 リスト1 atom.xml 修正前 <id>tag:<$MTBlogHost exclude_port

    Movable Type 3.x デフォルト・テンプレートのAtomフィードの不具合について
  • Movable Type 3.3 エントリー・タグ詳説

    Movable Type 3.3 から追加されたタグ機能の利用方法が下記のページに掲載されています。 Movable Type Beta Weblog:Everybody loves tags! 以下、元記事で紹介されているタグの機能や利用方法について超意訳で紹介します。 1.タグとは? タグは、項目の特定の一部分を説明するための簡単な単語、あるいは語句です。例えば、私は(私自身に) human, male, guy, sailor, product manager, san franciscan, shaved head, tall, joke-cracking, six apartisan, stressed-out, geek というタグ付けをするかもしれません。それらのタグの全てが、私が誰であるかに関して、より良い情報を与えてくれます。 Movable Type ではエントリーにタ

    Movable Type 3.3 エントリー・タグ詳説
  • 小粋空間: Movable Type 3.3 テンプレート

    Movable Type 3.3 テンプレートを公開します。下記のリンク先よりテンプレートアーカイブをダウンロードしてお使いください。 Movable Type テンプレート 上記のリンクは Movable Type 3.2 用のテンプレートを公開しているエントリーですが、カスタマイズ内容がほぼ同じですので、そのまま利用させて頂くことにしました。 なお、テンプレートのご利用および継続的なメンテナンス等について、ご支援・ご賛同くださる方からの寄付をお待ち申し上げます。 上記の「寄付」のリンクをクリックすると Paypal によるお支払いページにジャンプします。 1.3.2 テンプレートからの変更点 3.3 MovableType テンプレートは 3.2 MovableType テンプレートをそのまま流用しており、3.3 の機能追加部分について一部変更しています。変更点は下記の通りです。 3.

    小粋空間: Movable Type 3.3 テンプレート
  • Movable Type プロフィールのページを作る(3.2-ja~用)

    「プロフィール」用テンプレートの作成方法です。以前書いたプロフィールのページを作るが3.1xまでしか対応していなかったので、3.2-ja~3.35-ja用に書き直しました。なおここでご紹介するのは公開テンプレート用ですので予めご了承ください(デフォルトテンプレートのものは別途エントリーします)。 同様の手法で「このサイトについて」や「注意事項」のページを色々と作ることができます。プロフィール自体をエントリーとして追加する方法もありますが、ここではインデックステンプレートとして追加し、その中に直接コンテンツを記述する方法を説明します。 1.プロフィール用テンプレートの作成 Movable Type 管理画面左メニューの「テンプレート」をクリックし、右側上に表示されている「テンプレートを新規作成 」をクリックしてください。次に表示された画面で以下の項目を設定します。 テンプレートの名前:Pro

    Movable Type プロフィールのページを作る(3.2-ja~用)
  • Movable Type の PHP化(その2:.html のままPHPを有効にする)

    Movable Type の PHP化(その1)では拡張子を変更する方法を説明しましたが、このエントリーでは拡張子を変更せず、html のままPHP化を行うカスタマイズを紹介します。 このカスタマイズを行えば、モジュール化やページ分割等を、拡張子の変更なしで利用できるようになります。 1年以上前、自宅サーバで運営している時にこのテクニックを知ったのですが、.htaccess を利用すればレンタルサーバでも可能であることに最近気がつきました。 ここでは、 AddType ディレクティブによる設定 ForceType ディレクティブによる設定 AddHandler ディレクティブと Action ディレクティブによる設定 の3つの方法を紹介します。 基的には1項の設定で動作するはずですが、さくらインターネットでは3項の方法でしか有効になりませんでした。4項以降の作業は1?3項共通です。 なお

  • CSSでエントリータイトルに画像を表示する

    エントリータイトルの先頭に画像に表示する方法を紹介します。ここでは公開テンプレート(Movable Type)を用いた説明になりますが、HTMLCSSの設定による一般的なテクニックですので、どのようなテンプレート(あるいはHTML)でも利用可能です。 カスタマイズを行うことで、スクリーンショットのようにタイトル左に画像が表示されます。 以下カスタマイズ方法です。なお、リスト形式(ul - li)で画像を表示する場合はリストマークの画像のずれを修正するを参照ください。 1.テンプレートの修正 Movable Type の公開テンプレートではエントリータイトルを下記のように設定しています(分かりやすくするために一部省略しています)。 <h3 class="entry-header">●<$MTEntryTitle$></h3> <$MTEntryTitle$> が実際にはエントリータイトル

    CSSでエントリータイトルに画像を表示する
    yz_s
    yz_s 2006/08/14
    そのうちやる。そのうち。
  • 小粋空間: ボタン・バナー・アイコン作成・配布サイト一覧

    クレジットバナー追加の流れで、ブログでよくみかけるボタン(バナー)・アイコンの関連サイトを紹介しておきます。 ここに掲載していないもので「もっと有名なサイトがあるよ」という場合、ご連絡頂ければ幸いです。 AntiPixel:Steal These Buttons http://www.antipixel.com/blog/archives/2002/10/22/steal_these_buttons.html 80x15のボタンを(多分)最初に作成したサイト。 GTMCKNIGHT:Buttons http://gtmcknight.com/buttons/ 上記の記事をきっかけに始まった 80x15 ボタン収集サイト。Upload Form から作成したボタンを登録することができ、このページ左側の Menu をクリックすると膨大な数のボタンが表示されます。 SUICAのバナーもありました

    小粋空間: ボタン・バナー・アイコン作成・配布サイト一覧
  • Movable Type で1日午前0時のエントリーがカレンダーに反映されない不具合について

    「1日のエントリーがカレンダーに反映されませんというご質問を頂いて」調べたところ、エントリーの投稿日を1日の00時00分00秒で保存した場合、カレンダーに該当エントリーのリンクが反映されないことが判明しました。月末の23時59分59秒についても同様のようです。 コードを調査したところ、カレンダーの生成を行っているのは lib/MT/Template/ContextHandlers.pm にある _hdlr_calendar で、1ヶ月分のエントリーを取得する処理で該当の投稿日のエントリーだけ除外されてしまうのが原因です。これについては Movable Tyep 3.0 から発生していた現象のようです。 この不具合を解消するには、1日の投稿日に00時00分00秒、月末の投稿日に23時59分59秒を用いないか、下記のパッチをあててください。 --- lib\MT\Template\Contex

    Movable Type で1日午前0時のエントリーがカレンダーに反映されない不具合について
  • 著作権表示の西暦をリアルタイム化する

    Movable Type の著作権表示は、BlogCopyright Plugin を使ったカスタマイズが有名です。このプラグインは登録されている最初のエントリーと最後のエントリーから著作権の西暦を自動生成しますが、再構築した時点の年しか取得できません。つまり年をまたがった場合、再構築が行われるまでは更新されないことになります。 ということで、プラグインを少し修正して、リアルタイムカレンダーのように、リロードを契機に年表示を切り替える方法をご紹介します。日々更新されている方にとっては1年に数分?数時間しか有効にならないという甚だコストパフォーマンスの低い技ですが、年始末にブログを更新できない場合はお勧めです。ある意味、更新頻度が低い方ほど効果大です。 1.著作権表示の意味 カスタマイズの前に、一般的によくみかける Copyright © 2004 hogehoge All rights r

    著作権表示の西暦をリアルタイム化する
    yz_s
    yz_s 2006/04/02
    BlogCopyright.pl ver.1.0
  • メール送信ページを作る

    メールによるご連絡を頂けるよう、プロフィールのページにメールアドレスを掲載していたのですが、メールアドレスを非掲載にしたかったことと、メールがブログから送信されたものであることが分かるようにマークをつけたかった(方法については後述)ので、送信フォームに変更しました。 今回利用させていただいたのは下記のプラグインです。ありがとうございました。 The blog of H.Fujimoto:メールフォーム作成用プラグイン 配布元で設定方法が解説されてますが、こちらでも簡単な設定方法を記しておきます。なお技術的な質問につきましては配布元にお問い合わせ頂ければ幸いです。 1.プラグインのダウンロード メールフォーム作成用プラグイン(その1)の mt-mail-form.zip のリンクをクリックして、アーカイブをダウンロードします。 2.プラグインのアップロード アーカイブを解凍すると MailF

  • 月送りカレンダー・1日に表示されなくなる不具合を改善

    月送りカレンダーには、毎月1日にエントリーが投稿されてない状態でコメントまたはトラックバックを受信すると、カレンダーが表示されない(「404 Not Found」が表示)という既知の不具合があります。このようになる原因は次の通りです。 例えばメインページは、コメントまたはトラックバックの受信を契機に全ての情報が再構築されます。その際、メインページに埋め込まれている月送りカレンダー表示用の iframe タグ <iframe name="cal-iframe" src="<$MTBlogURL$>archives/calendar/<$MTDate format="%Y/%m/index" $>.php" ...(中略)... marginheight="0"></iframe> にある MTDate(赤色)も更新され、新しい月が設定されることになります。ただしパスが示す先には新しい月のカレ

    月送りカレンダー・1日に表示されなくなる不具合を改善
  • カテゴリー・アーカイブに前後カテゴリーのリンクを表示する

    エントリー・アーカイブで前後のエントリーのリンク、月別アーカイブで前後月のアーカイブリンクを表示するのと同じように、カテゴリー・アーカイブで前後のカテゴリーリンクを表示する(スクリーンショット)というオーソドックスなカスタマイズです。 リンクの表示には Supplemental Category Tags プラグインの MTCategoryPrevious/MTCategoryNext タグを利用します。参考サイトは下記です。ありがとうございました。 絵文録ことのは:MT:前/次のカテゴリーへリンク 上記で配布元サイトの和訳が掲載されていますので、ここでは基的な設定方法のみ記しておきます。 1.プラグインのダウンロード 配布元サイトの Supplemental Category Tags(下記)へジャンプし、Availability の項にある mtcatx-1_5.zip のリンクをク

    yz_s
    yz_s 2006/03/21
    mtcatx Plugin使用。
  • 小粋空間: 休日表示付リアルタイムカレンダー for Movable Type

    Movable Type のカレンダーに土・日・休日・日を表示するカスタマイズです。ここではデフォルトテンプレートおよび公開テンプレートを利用したテーブルタイプのカレンダー、および公開テンプレートの月送りカレンダーに対するカスタマイズをご紹介します。CSSを変更すれば他のテンプレートでもご利用可能です。 スクリーンショットはデフォルトテンプレートに設定した完成例です。 余談ですが、これまで公開してきたカレンダーのHTMLマークアップおよびCSSの設定を若干見直しました。 2006.10.10 追記:カスタマイズを Ajax 化した「Ajax 月送りカレンダー」を公開しています。 1.休日表示用カレンダースクリプトのダウンロード 下記のリンク先にある dayChecker.js をクリックして休日表示用カレンダースクリプトをダウンロードしてください。 download 2.スクリプトのア

    小粋空間: 休日表示付リアルタイムカレンダー for Movable Type
    yz_s
    yz_s 2006/03/20
    dayChecker.js使用。