タグ

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

  • アップロード画像の img 要素の alt 属性・title 属性をカスタマイズする

    Movable Type 4.2 で、ブログ記事の「画像の挿入」を使ってアップロード画像を文や追記に埋め込む場合の、img 要素のalt 属性や title 属性の出力内容をカスタマイズする方法です。 1.「説明」フィールドの内容を alt 属性に挿入する アップロード時の「説明」フィールドの内容を alt 属性に反映させるカスタマイズです。 デフォルトの状態では、次のようにアップロード時のオプションを設定した場合、 埋め込まれる img 要素の alt 属性には、このように「ファイルオプション」の「名前」フィールドの内容が反映されます。 下に示す、1項のカスタマイズを行えば、埋め込まれる img 要素の alt 属性には、このように「ファイルオプション」の「説明」フィールドの内容が反映されます。 ただし、デフォルトの動作(alt 属性に「名前」フィールドの内容を反映)は適切と思われます

    アップロード画像の img 要素の alt 属性・title 属性をカスタマイズする
  • 小粋空間: JavaScript - Lightbox JS アーカイブ

    以前、クールに画像を表示するツール Litebox 1.0 をご紹介しました。この Litebox を起動するためには、a 要素の rel ... [記事ページへ]

  • カスタムフィールドのテキストエリアに入力した改行をページに反映させる

    Movable Type のカスタムフィールドで「テキスト(複数行)」という種類のフィールドを利用する際、テキストエリアへの入力内容に改行や空行を含めても、出力される文字列の改行や空行はすべて除去された状態で出力されてしまいます。 エントリーでは、この事象を解消する方法を紹介します。 1.問題点 例えば、次のようなカスタムフィールドを作成します。テンプレートタグはとりあえず「EntryData」としておきます。 作成したフィールドで、次のようなテキストを入力します。 このカスタムフィールドを出力する「ブログ記事の概要」のサブテンプレートは次のようにします。 : <div class="asset-body"> <$MTEntryBody$> <MTIfNonEmpty tag="EntryData"> <$MTEntryData$> </MTIfNonEmpty> </div> : この

    カスタムフィールドのテキストエリアに入力した改行をページに反映させる
    wakatakahawks
    wakatakahawks 2008/03/19
    カスタムフィールドのテキストエリアに入力した改行をページに反映させる
  • カスタムフィールドの入力文字数の制限を変更する

    カスタムフィールドの入力文字数の制限を変更する方法を紹介します。 この問題は Movable Type 4.2 で改善されています。 作成したカスタムフィールドに大量の文字を入力した場合、文字数の制限にひっかかる場合があります。文字数の制限を変更すれば作成したカスタムフィールドに希望するだけの文字を入力できるようになります。 これは下記のトラックバックに触発されて書いたものです。ありがとうございました。 小さな世界:Movable Type4.1 2つの疑問 ということで、エントリーにて紹介させて致します。 1.問題点 サンプルとして、トラックバック元記事と同じ、都道府県を選択するラジオボタンをブログ記事に設置したケースで話を進めます。 次のように、新しく作成したカスタムフィールドに、47都道府県をラジオボタンの選択項目として入力します。 が、ブログ記事投稿画面を表示させると、追加した都

    カスタムフィールドの入力文字数の制限を変更する
    wakatakahawks
    wakatakahawks 2008/03/11
    丁度一週間前に困っててmixiで質問したけどレスナシで困ってた。ありがたいっす。
  • カスタムフィールドによるアップロード画像をサムネイルで表示するプラグイン 0.02

    先日公開した「カスタムフィールドによるアップロード画像をサムネイルで表示するプラグイン」をパワーアップして、アップロード時にアイテムのオプション画面をハンドリングするようにしてみました。 これで、カスタムフィールド用のテンプレートタグを使った画像表示でも、サムネイル画像を自動的に生成してブログ記事に表示することができます。 2008.09.17 Movable Type 4.2 対応のバージョンを公開しました。 1.プラグインのダウンロード 下記のリンクをクリックしてプラグインをダウンロードします。 VisibleCustomFieldImage.zip 2008.02.17 v0.03:script error になるバグを改修しました。 プラグイン開発やサポート等にご支援・ご賛同くださる方からの寄付をお待ち申し上げます。 上記の「寄付」のリンクをクリックすると Paypal によるお支

    カスタムフィールドによるアップロード画像をサムネイルで表示するプラグイン 0.02
    wakatakahawks
    wakatakahawks 2008/01/24
    カスタムフィールドによるアップロード画像をサムネイルで表示するプラグイン
  • 「WordPress で『続きを読む』の折りたたみ」を特定のページだけに適用する

    WordPress で「続きを読む」の折りたたみ Web2.0」では、スライドダウンで文下に続きを表示するカスタマイズをご紹介しましたが、カテゴリーアーカイブや月別アーカイブでも折りたたみが適用されてしまうため、追記部分のテキスト量が多い場合、ページの読み込みに時間がかかる可能性があります。 ということで、エントリーではインデックスページのみ折りたたみを適用し、アーカイブページでは記事ページへのリンクを表示するカスタマイズを紹介します。 注:このカスタマイズを行う前に「WordPress で「続きを読む」の折りたたみ Web2.0」を設定してください。 設定方法 getContentforShowHide.php を任意のエディタで開き、以下の青色部分を追加してください。追加部分は大きく分けて4ヶ所あります。特に閉じカッコ "}" 忘れがないよう、ご注意ください。 : functio

    「WordPress で『続きを読む』の折りたたみ」を特定のページだけに適用する
  • Movable Type 4 の透過 PNG ロゴを IE6 以下のブラウザで透過する

    デフォルトテンプレートで新しく表示されている Movable Type 4 のロゴは透過PNGのため、IE6以下のブラウザでは透過されず、2色で表示されてしまいます(下)。 ここでは pngfix.js を利用して透過する方法を紹介します。 PNG in Windows IE: How To Use 他にも透過PNGライブラリは色々出回ってます。 AlphaLoader - Public Amachang to-R:アルファ画像を扱うalphafilter.jsライブラリ ユンサンの/융상의/YungSang's:透過PNG と IE と IE7 1.スクリプトのダウンロード・アップロード PNG in Windows IE: How To Use の中間辺りにある pngfix.js のリンクをクリックして、pngfix.js をダウンロード。 ダウンロードした pngfix.js をサ

    Movable Type 4 の透過 PNG ロゴを IE6 以下のブラウザで透過する
  • Movable Type 3 から Movable Type 4 へのアップグレード方法

    Movable Type 4 がリリースされましたので、Movable Type 3 からのアップグレード方法を紹介致します。 アップグレードはこれまでの MT3.x → MT3.x の方法と若干異なっています。おおざっぱに申し上げますと、データベースと構成ファイル(mt-config.cgi)以外、全て潔く削除します。 以下、Movable Type 4 のドキュメントを参考に、順を追って説明します。メジャーバージョンアップということで事前準備が色々ありますので、作業内容をしっかり把握してから実施してください。 またエントリーはアップグレードの正常性を100%保証するものではありませんので、ご自身の責任で行ってください。 注意事項 MT3管理画面系のプラグインはMT4ではエラーになります。 MT3のMTタグ拡張プラグインで一部利用できないものがあります(MTPaginate/MTCol

    Movable Type 3 から Movable Type 4 へのアップグレード方法
    wakatakahawks
    wakatakahawks 2007/08/10
    "おおざっぱに申し上げますと、データベースと構成ファイル(mt-config.cgi)以外、全て潔く削除します。"
  • 小粋空間: 管理画面のページ遷移を簡単にする Bookmarks プラグイン

    MT4 専用の最初のプラグインがリリースされたというアナウンスがありましたので、便乗して紹介します。 First Movable Type 4 Plugin released This weekend, Kevin Shay, the developer behind several of Movable Type's most popular plugins, release the first Movable Type 4 plugin. Bookmarks プラグインは、管理ページの任意のページ(例えばテンプレートのインデックスページ編集画面)をブックマークすることで、ページにダイレクトに遷移できるようにするためのものです。 以下設定と操作方法です。 1.プラグインのダウンロード 下記のサイトよりプラグインをダウンロード(スクリーンショット下の「here」をクリック)。 New Pl

    小粋空間: 管理画面のページ遷移を簡単にする Bookmarks プラグイン
  • 小粋空間: Internet Explorer 6 と Internet Explorer 7 を共存させる

    はてなブックマーク経由で「IE6 と IE7 の共存はできませんか?」という類の質問をいくつか頂きまして、ネットを検索してみたところ、簡単に共存できる方法が書かれたサイト(下記)をみつけましたので、エントリーにて IE6 と IE7 を共存する方法をご紹介します。 Tredosoft:Internet Explorer 7 running side by side with IE6. (standalone) 「共存」というのはやや誇張した表現ですが、IE7 Standalone 版を来の IE のインストールフォルダとは異なるフォルダにインストールするというものです。またインストーラを利用するので簡単にインストールできます。アンインストールも可能です。当然ながら対応 OS は Windows XPのみです。 上記のページには2つの方法が紹介されていて、このエントリーでは「インストーラ

    小粋空間: Internet Explorer 6 と Internet Explorer 7 を共存させる
  • 小粋空間: Movable Type が WordPress に負けた本当の理由

    Movable Type と比較して WordPress が人気なのは、「再構築が不要」とか「インストールが簡単」とか「デザインが豊富」とか、国内ブロガーの評価を頼りにしていましたが、下記の記事の一文を読んで、米国で Moovable Type の人気が急激に落ち、WordPress にシェアを明け渡した当の理由を知りました。 Movable Type 4.0 ベータ、ローンチ―第3四半期にもオープンソース化へ MTユーザーとSixApartの間には波乱の歴史がある。Movable Typeは決してオープンソースプラットフォームではなかったのだが、MT 3.0のリリース以前は多くのユーザーがMTをオープンソースであるかのように扱っていた。2004年のMT 3.0のリリースと同時にライセンス契約が強制されるようになったことでユーザーコミュニティーからは激しい非難の声(私の声もかなり声高に混

    小粋空間: Movable Type が WordPress に負けた本当の理由
  • リアルタイムに XHTML の文法やアクセシビリティを検証できる Firefox 機能拡張「Html Validator」

    XHTML の文法チェックには Another HTML-lint gateway や、The W3C Markup Validation Service が有名ですが、そのサイトに行かなければならないのがやや面倒という方に、リアルタイムに XHTML を検証できる Firefox 機能拡張「Html Validator」を紹介します。 「Html Validator」は、XHTML のバリデーション以外に、アクセシビリティのチェックや、ソースコードのクリーンアップ(ソースの自動修正)まで行ってくれるスグレモノで、Firefox ユーザにはポピュラーな機能拡張のひとつです。 すでにご利用の方も、記事後半にデフォルト設定以外の項目について詳細に記しておりますので、より活用できるのではないかと思います。 以下、Firefox をご利用でない方向けに、Html Validator のインストール

    リアルタイムに XHTML の文法やアクセシビリティを検証できる Firefox 機能拡張「Html Validator」
    wakatakahawks
    wakatakahawks 2007/06/15
    使い方英語で分からなかったから助かる~
  • FeedBurner が Yahoo! ブログ検索でインデックスされない事象の解決へ

    「Feedburner を利用すると Yahoo! ブログ検索にインデックスされない」という事象に対し、Feedburner が解決に向けて動き出したようです。 FeedBurner公式ブログ:ブログ検索対策 FeedBurnerのフィードをブログのフィードURLとしてブログ検索サイトにPINGを送信するとブログ検索にインデックスされないという現象が報告されております。 現象については既に確認済みであり現在対策を模索しております。 FeedBurnerチームとしてはこの現象を早急に改善すべく各ブログ検索サイト運営会社と現象に関しまして調整する予定となっております。 FeedBurner公式ブログでの発表の直前に、CNET Japan でも見解が述べられています。 グーグルRSSサービスのFeedBurnerを買収 またしばらく前から、FeedBurnerを利用するとYahoo!ブログ

    FeedBurner が Yahoo! ブログ検索でインデックスされない事象の解決へ
  • XHTML タグ一覧表示ツール

    下に表示されている XHTML タグをクリックすると、その下にある枠内に、 正しいマークアップ 使用可能な子要素(または親要素) 使用可能な属性 が表示されます。XHTML タグを記述する際、「このタグの書き方は?」「このタグの子要素(または親要素)には何が書けるの?」と思ったら使ってください。元データは Another HTML-lint のタグ一覧を利用しています。 クリック表示 マウスオーバー表示 属性表示 XHTML 1.0 Transitional [ 閉じる ] <a> <abbr> <acronym> <address> <applet> <area> <b> <base> <basefont> <bdo> <big> <blockquote> <body> <br> <button> <caption> <center> <cite> <code> <col> <colgr

  • 小粋空間: IE7 の CSS ハック

    「IE7 で閲覧すると表示が異なるのですが」というご質問を頂いたので、CSS ハックを利用して、IE7 のスタイルのみを変更する方法を紹介します。結論だけ述べますと、IE7 に異なるスタイルを適用する(=他のブラウザと表示を合わせる)場合、該当のセレクタの前に *:first-child+html を付与します。例えば、IDセレクタ #banner に適用させる場合、 *:first-child+html #banner { : [IE7用のスタイルを記述] : } となります。 なお、それ以外のブラウザのために、元の #banner の設定は、この追加したセレクタより前方に記述します(下記)。この順番を間違えると期待する表示にならないのでご注意ください。 #banner { : [IE7以外のスタイルを記述] : } *:first-child+html #banner { : [IE7

    小粋空間: IE7 の CSS ハック
  • 画像でエントリー・アーカイブをページ分割する

    Movable Type でページ分割用プラグイン MTPaginate を用い、エントリーアーカイブを画像(およびテキスト)で分割するカスタマイズです。 下記のように img 要素だけを記述したエントリーで、パラグラフ(p)要素でページ分割をする場合、MTPaginate をそのまま利用すると分割されず、全て同じページに表示されます(空行部分、つまり img 要素の前後には Movable Type の機能で自動的に p 要素が付与されます)。 <img src="http://yourhost/path/hoge1.jpg" alt="hoge1" /> <img src="http://yourhost/path/hoge2.jpg" alt="hoge2" /> <img src="http://yourhost/path/hoge3.jpg" alt="hoge3" /> これは

    画像でエントリー・アーカイブをページ分割する
  • 1